Ramon’s Weblog

A Picture is Worth a Thousand Words: Getting Semantic With HTML5 November 23, 2010

If you have HTML experience and have been working in the Web business a good while, you should know there has been a large number of changes to the HTML standard over a relatively short time. There are so many new and exciting things coming to the Web market it’s impossible to put everything into one article. Last week I mentioned some things about client-side storage and how it’s handled by HTML5. This week I am continuing down the path of HTML5 and mentioning other important features that will become more commonly used by developers as Web browsers catch up to these new standards.

For those who are familiar with the term “semantic coding”, you know this term is used to describe correct markup with meaningful naming or definitions. Who wants to open up another developer’s code and spend additional time trying to figure out what is going on in regard to structure and naming? The code needs to stand on its own, and be considered self-explanatory. This semantic way of structuring and naming is a trend that started a while back and is used by good Web designers or developers.

W3C has implemented some new tags in HTML5. It is common for one to structure pages using the <div> tag with IDs named “branding” or “nav_main” for example. HTML5 has introduced the tags <header>, <nav>, <article>, <aside>, and <footer>. I didnt name all of the new tags, but the whole importance behind these is to allow developers to write less code but add more meaning to the content. The new tags will make it easier for other developers, browsers, and search engines to distinguish what is important and what is not.

It is really exciting to see the standards change to make production easier and overall user experience better. Oh my, I recall the table and frames madness going on in the nineties, and I am so relieved we are not in those stone ages anymore.

5 Exciting Things to Look Forward to in HTML 5