Content Structure
Well-structured content is not only essential for people with disabilities, it ensures that information is easy to process and navigate for every user. Structure your designs and copy with semantic HTML in mind, in order to provide screen readers and other assistive technologies with meaningful information.
Content Structure Considerations
Accessible Content
Can users access your site’s content with a screen reader?- Use HTML5 elements to define the structure of your document and the hierarchy of content within it
- For efficiency and ease of internal communication, your designs and copy documents should follow semantic HTML structure
- Always publish your content in HTML documents
- Non-native formats like PDF, Word, etc. require additional steps to make them accessible to screen readers. We strongly discourage using these formats without also providing equivalent content in native HTML text and graphics
Easy Navigation
Can users navigate your site with their keyboard or assistive technology?- Navigation menus should be separate from the content of your page using
<nav>
tags and formatted as list items using<li>
- Create a clear heading structure (
<h1>
to<h6>
) to denote each section and subsection of the page - All links (
<a>
) should clearly describe the content to which they point and distinguish themselves from other links on the page
Clarity & Purpose
Can users quickly understand page information and purpose?- Each page should provide a clear and descriptive page title
<title>
and heading<h1>
- Focus the content of each page on a specific topic
- Landing and category pages may require a summary of other pages found within
- Users should be able to easily understand and complete key tasks