Blue Dreamer Blog
Written articles and my personal thoughts on web design, ecommerce, the internet and odd ramblings about life, the universe and everything!
Why use valid html markup?
Many DIY webmasters, and indeed some so-called professional web designers use WYSIWYG editors such as Dreamweaver or, even worse, the antiquated Microsoft Frontpage. The main problem with these sort of editors is that they can create badly marked up code full of errors and empty or deprecated tags. Frontpage is notorious bad for producing invalid and bloated HTML but thankfully, in the right hands, Dreamweaver can produce compatible code.
So why use valid code?
Correctly coded and error free HTML pages load a lot quicker in your web browser giving a better user experience. If there are errors your browser has to figure out firstly whether or not to display the erroneous code, and secondly how it should display the code - if at all! Although web browsers are quite clever the results can never be relied on and you can’t guarantee what your visitors will see - what you see on your local computer might not be what your sites visitors see - think about it! Correctly coded HTML also allows search engines to better index what matters on your site - the content.
Out with <font> tags
WYSIWYG html editors make it very easy to use the <font> tag without you knowing it. This tag, along with BASEFONT, CENTER, S/STRIKE (strike through), U (underline), APPLET, DIR, ISINDEX and MENU have all been deprecated for some time and shouldn’t be used, see a list of depracated html tags for further explaination. Always create your styling with CSS instead.
Don’t use tables for layout!
Another sympton of WYSIWYG editors is that they make html table based layouts seem the right thing to do. Once upon a time tables were used to maintain consistent layouts in old web browsers, but modern browsers now support correct HTML/CSS coding methods negating the need to use tables in this way. You should only use tables for tabulated data. Table based layouts take longer to render in your web browser, use more code, slow your pages down and cause display issues on some browsing devices. Read this excellent presentation - Why tables for layout is stupid for a more complete summary.
Keeping it valid
The correct way of marking up web pages is using HTML for defining the structure (headings, paragraphs, content areas) and CSS for styling it (layout, colours, visuals). For learning the correct HTML markup techniques I recommend W3 schools HTML tutorials, and for CSS W3 schools CSS tutorials.
Search engine benefits
A well designed web page will be easier for search engine spiders to crawl and grab your all important content, and the better your search engine listings are the more chance you have of being found. The benefits are self explainatory really!
Comments
You should probably be pointing people to HTML 5 links rather than HTML 4 ones. In particular, a few attributes have been ‘undeprecated’:
http://www.w3.org/html/wg/html5/diff/
Fair point Nicholas, though HTML4 is the current standard at the time of writing… HTML5 has been a long time coming so until browsers start supporting it I’m not holding my breath. When it does come there will be a lot to write about I’m sure!