a11yTips — Identify headings using H1 to H6 elements

Identify headings using H1 to H6 elements

no. 007

Make sure the structure of headings is marked up using H1 to H6 tags

Headings help users understand the structure of the content and how sections are nested in one another. When presented efficiently, headings help users figure out the organization of the content, allowing them to navigate by blocks, rather than as a whole. While this organization can be achieved on the presentation layer using CSS, real HTML heading tags need to be used for the headings to truly convey the semantics required to create a document outline.

To do this, simply analyze which elements of content play a heading role. Identify these elements and assign them a hierarchy level, based on intended structure: first-level heading, second-level heading, third-level heading and so on. Then assign each of these heading the corresponding H1, h2, H3, H4, H5 or H6 tags in order to create an outline for the document. Assistive technologies will then be able to reliably transform the semantics into an outline for end users, allowing them to quickly go from one section to the next.

User Story

As a user using assistive technology such as screen readers, I want headings in a web [...]

Read article at dboudreau.tumblr.com

Article Taxonomies

Categories:
Fatal error: Uncaught Error: Object of class WP_Error could not be converted to string in /home/webable/www/www/wp-content/themes/webable/content-mcm.php:65 Stack trace: #0 /home/webable/www/www/wp-includes/template.php(792): require() #1 /home/webable/www/www/wp-includes/template.php(725): load_template('/home/webable/w...', false, Array) #2 /home/webable/www/www/wp-includes/general-template.php(206): locate_template(Array, true, false, Array) #3 /home/webable/www/www/wp-content/themes/webable/single-mcm_article.php(15): get_template_part('content-mcm') #4 /home/webable/www/www/wp-includes/template-loader.php(106): include('/home/webable/w...') #5 /home/webable/www/www/wp-blog-header.php(19): require_once('/home/webable/w...') #6 /home/webable/www/www/index.php(17): require('/home/webable/w...') #7 {main} thrown in /home/webable/www/www/wp-content/themes/webable/content-mcm.php on line 65