Servage Magazine

Everyone who ever tried creating a website probably knows that annoying experience of HTML pages not being displayed the same way in every browser. Especially  older versions of browsers are having a hard time showing your site the way you intended it to look. The reason for this is browsers interpreting HTML code and CSS styles differently. In many cases this has lead developers to create workarounds, including the use of invalid HTML or CSS, to trick the browsers into displaying the content in a similar way.

These issues are frequently discussed on the Internet, and a common interpretation of HTML and CSS across all browsers is unfortunately not in sight. However, there is one thing that you could do to participate in this development: Make sure that your website is standard compliant!

“So, what does standard compliance mean?” In my opinion there are two important things to consider with regards to HTML websites. First of all, any web developer should split the content from the layout by using CSS styles. CSS Zen Garden has a series of beautiful showcases to prove the concept of being able to completely control the layout of a website with CSS styles. The advantage is obvious: Web developers focus on their task of creating valid HTML output, while web designers can focus on their work of creating the layout and translate it into a CSS style sheet. Thereby you can not only split these two different tasks, but also enable the possibility of completely changing the layout of your website whenever you want, without having to change the HTML core of your site. The second – and strictly speaking, the standard-compliance-related part – is ensuring that you actually use valid HTML and CSS code. You can check this with the HTML and CSS validation services from W3. There is also a useful browser plugin for Firefox which lets you validate on the fly.

“OK, but I don’t know anything about valid HTML or CSS coding!” That is not a problem at all! If you are already creating your own website then you are on the right path! There are plenty of demonstrations and tutorials available online. Some of the better ones are W3 Schools (they have tons of tutorials and references – a good page to bookmark!) and csstutorial.com.

“OK, now my website is standard compliant, but it still doesn’t look the same way in all browsers!” Yes, that is possible. The core problem of browsers interpreting the HTML in different ways still exists, but there are plenty of standard compliant workarounds for various known issues. I recommend that you continuously test your code for validity and display in multiple browsers during the development. Thereby you can address cross-browser-compatibility as the issues arise.

Have fun creating your website! And watch out for the cool feeling when the validator says you have created correct code :-)