Bruno Ribeiro | Resources | HTML all caps

Don’t use all caps on your HTML file

When you write your HTML, you should use proper capitalization. You write your content in sentence case, which means lowercase, except for the first letter of a sentence or proper names.

If you want to use all caps in a heading, for example, rather than write it in the HTML, use the ‘text-transform’ property in the CSS.

Don’t do this:

<h2>ABOUT</h2>

Do this instead:

<h2>About</h2>

And style it on the CSS:

h2 {  
    text-transform: uppercase;  
}

In the first (wrong) example, some screen readers will read “A‑B‑O‑U‑T” rather than the word “about”.

And also, you will make your life easier if you use the text-transform property because it’s easy to reverse in case you change your mind.