HTML & CSS Best Practices

Estimated reading time: ( words)

Summary: HTML is for communicating basic content. CSS should be used to style the content and control how the information is displayed.

On two ends of the spectrum of web design misconceptions: that a site is accessed with a screen reader so visual elements are irrelevant, or the site is accessed with a large monitor, in a perfectly lit room, by a user with impeccable eyesight, the motor skills of a ninja, and the world’s best mouse. 

The reality, of course, is there are millions of scenarios in between, and you are designing for them all. Following accessibility guidelines will help you make sites that peform well on mobile, tablet and desktop devices, while also allowing you to deliver content to users at all levels of visual and physical ability. 

At heart of the challenge is to use HTML well. Communication is what HTML was designed to do (the "L" in HTML stands for Language, after all).

HTML is for content, CSS is for styling it

Your HTML code should be minimalist, properly describing the content it represents. Do not use HTML to affect the visual style of your content. Instead, use an external stylesheet to apply visual treatment, including size, color, typography and space.

When you allow the HTML to describe the content and use CSS to style it, you are applying a core best practice of web design known as separating design from content.

Did you find what you were looking for?

Get help

Submit your accessibility question for a personal response, and we'll use your question to improve the content of this website.