Article Headings, Please!

This has become an issue for me of late, and it needs more attention. And that is lack of sub-headings in articles. Not just the page heading and/or article heading, but headings  throughout an article to make it more accessible and usable. Especially so the longer an article is. (And of course, use proper markup! H1, H2, etc.)

Examples, Poor

Among many, I came across the following articles which could really use more headings. The articles are fairly long, and could no doubt be broken up into sections.

Why Headings?

Why are headings so important? First of all, it’s part of accessibility guidelines such as WCAG 2.0; see section 2.4.6 Headings and Labels. The W3C points out that headings create meaning when read out of context. And they help people with limited short-term memory. In addition, headings provide:

  • Better navigation for screenreaders.
  • Default formatting when CSS is not available.
  • More semantic.
  • Scanning more usable and readable document.
  • SEO.

Examples, Good

Here are examples of articles with good use of headings:

Please use headings and sub-headings as it creates more web accessible and usable articles.

5 comments

  1. Ares Vista

    Good points here about writing articles. People will not read a huge block of text all the way through. They will, however, be drawn to important points in the article, and sub-headings is a great way to guide the reader through your information.

  2. Andy

    From an accessibility point of view headings (and by that I mean semantic headings, not paragraph tags made bold and the font size increased – which I’ve seen quite a bit!) are important. But for sighted users too, it’s a far better experience to read an article broken up with headings. Chances are your visitors aren’t going to stick around and wade through 20 straight paragraphs of text!

  3. Jonny Axelsson

    Of course I use heads and subheads in my articles and blog entrys (though rarely in my blog comments). In my blog I would probably benefit from digression and recap block elements.

    The alterative is of course to write less text…

Post a comment

You may use the following HTML:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>