Using HTML Headings H1-H6

Most users spend a considerable amount of time scanning rather than reading information on websites. Well-designed headings help to facilitate scanning and reading of written material. Screen readers used by the visually impaired let their users know the structure of the page based on the Headings it finds. This is how they “scan” a page for content.

  • Good page authors use unique and descriptive headings while using as many headings as necessary to enable users to find what they are looking for—it is usually better to use more rather than fewer headings.
  • Usually the title at the top of a page is the only <H1> tag on the page. All content and heading tags are associated with this <H1>.
  • Break the main sections of you page up by using the <H2> tag.
  • Further divide any <H2> tags with sections headed by an <H3> tag and so on.
  • Be sure you use headings sequentially. For example do not use an h4 tag if there is no h3 tag for which it is associated.
  • You will probably rarely use H4-H6 except for very large pages with much information.
  • Use your ca_department.css file to style your H tags across your site if you are not satisfied with the ca_master.css default <Hx> styles.
  • Use W3C.org Validator Tool with the outline box checked to see how your headings work
  • For more on using Headings check out WebAIM.org.

0 Comments

Submit a Comment