W3C – 10 Points of Correct Web Design

Building a W3C compliant website is actually pretty straightforward. One of the core ideas to making sure that you get your code compliant is to use “Semantic Markup” (that's our first tip) and we'll give you nine ways here to make sure that you get it right.

Tag your Paragraphs
Knowing when to use the <p> tag, and when to use the <br/> tag is the mark of a professional. It's also an essential way to make sure that you're building your text correctly. If you want to edit spacing around the paragraphs, that's what your CSS file is for – don't make adjustments inside articles.

Get the Tables SEO friendly
Tables are about organizing data and aren't a convenient way to arrange text in rows and columns. Make sure that when you use a table, the data is linked clearly.

Abandon “Bold” and Be “Strong”
The old <b> for bold tag is no longer compliant with web standards. The new tag is <strong> - this tells the world that the comment is “prominent” in the text and most of the time it's used to make text bold. However, you can make text prominent without it being bold too.

Do the same with “Italics” and “em”
The old italic <i> tag is also defunct, it's been replaced with <em> for emphasis and that's important to note. It lets search engines know what's important too, the fact that some text was leaning in the past wasn’t particularly relevant - knowing that you're emphasizing something is.

Use the Right Classes
Make sure you use the standard HTML classes when appropriate, if you must add a new way of presenting information – create a new class <p class=”this page”> and then add a style in the CSS.

Use Alt Text on Images
It's essential for reaping SEO benefits, but for the visually impaired user alt text means having the images explained with a speech synthesizing browser. Skip this and the search engines skip your images too.

Use “Self closing” when you need to
That means using the <br/> syntax and not the old <br> as appropriate. That might seem nitpicky but in fact it's how the standards dictate you do it.

Make sure you have sub-ordinate headersThat means taking advantage of the <h-number> tag to denote the importance of headings. You can start at <h1> for the most important and work all the way down to <h6> if you really need to.

Focus on the <h1> tag

You're marking this as the most important part of the page – so make sure that it is. Get your syntax right, and you're one step close to W3C compliance and if you check through the tips above, you'll see it's not hard to do.