The Importance of Semantics

The idea of semantics on the internet isn't something new, but when designing a site it should be taken into consideration. Now, this isn't an article on how the semantic web works, but nonetheless it still plays an important role in HTML.

Think about it this way. You know that the tag <h1> makes text bigger and bolder, but what exactly does <h1> mean? Well, it's a Heading tag, specifically the first level. Headings are like section titles - they tell something about the next block of text or so. So, instead of just putting <span>text-size:xx-large</span> for your headings, you should use a suitable heading tag. Headings should also make sense, and you should organize your document neatly like that. Changing how it looks is a job for CSS.

Now think about all the other tags. The <title> is one of the most important ones. Don't just treat it as the "line-of-text-above-the-buttons", it should be the actual title of the page. A good title would be like, "The Mechanics of a Speedometer", not "Bob's Car Site", or, god-forbid, "Untitled Document 1". Everything else has a purpose too. A <p> tag should be used for a paragraph - not for making blank spaces (like FrontPage does when you press enter). Tables should be for presenting information that would normally make sense in a table, like spreadsheet data, a guide of CSS declarations along with their values and uses, the market share data of popular browsers, etc. Tables are not for layout!

So, think about what your tags mean before you use them. Try not to overly rely on visual things by using formatting to make headings and other parts of a document that already have a corresponding HTML tag. CSS is supposed to seperate the content from the visual part of a document.

© 2005-2026