A website is built with HTML and CSS code. This is a bit of a simplification, but it applies in general to most websites. HTML and CSS are the markup tools that determine how your content is presented. Your fonts, the colors you use, the size and placement of your images, all those things are captured in the HTML and CSS codes of your website.
HTML stands for HyperText Markup Language and is the granddaddy of internet codes. It describes the basic markup of your content. From bold and italics text to displaying images and laying out tables, HTML does it all.
HTML does have its limitations, which is why CSS was invented. CSS stands for Cascading Style Sheets and it does a lot of what HTML does, and then some. The main advantage of CSS is that you can use it to separate the content of the site from the look & feel. This means that with a proper implementation of CSS you can change the way your website looks without having to make any changes in the content.
Having good code is an important aspect of a good website. The HTML and CSS codes that generate your website’s look and feel need to work properly. If they don’t, several things might happen:
Some visitors using different web browsers might not be able to use your website. Different web browsers handle code differently and can show a user very different things based on the same HTML and CSS code. With shoddy code your website might look fine in one browser, but might be hideous in another. Or worse, it might not work at all.
Search engines like Google that visit your site to look at your content might stumble over bad code. Search engines use little automatic programs called web crawlers or spiders that roam around on the internet to supply the search engines with data. This is called indexing and it happens all the time. If your website uses poor HTML code, web crawlers might not index all your website’s content. This will harm your rankings in search engine results.
So how do you know when your website uses bad code? Fortunately there are many ways to check your HTML and CSS code. The World Wide Web Consortium (W3C for short), the international organization that sets the standards for the Internet, has online validation tools that check your website’s code for potential problems.
For your HTML code you can use the W3C Markup validator: http://validator.w3.org/
For your CSS code you can use the W3C CSS validator: http://jigsaw.w3.org/css-validator/
These validators are very thorough and will almost always give you a list of errors. Don’t worry, not all of these errors are critical. Errors indicated by yellow or blue exclamation marks (,) won’t cause a lot of problems for browsers or web crawlers and can often be safely ignored.
Errors shown with red crosses () are more important and deserve to be looked at. You should strive to have as few of these as possible, though with any complex website you’ll find it almost impossible to eliminate all of them.
Good HTML and CSS code for your site has many benefits, but most of all it will help your visitors receive the website experience you want them to.