Semantic structure
The semantic structure of HTML 5 makes up the backbone for delivering an accessible experience. It is crucial that this code is valid according to current specifications. Non-standard, invalid or broken code can disproportionally affect those who rely on assistive technologies.
Language & semantics
Language
Ensure that a website has been coded so that the default human language of the content in each page, passage, or phrase, can be programmatically determined.
Semantics
Utilize the full range of HTML 5’s semantic tags wherever appropriate. Avoid needlessly using <div> or <span> tags if a more semantically correct tag could be used.
Conversely, never specify a tag based on its visual appearance. For instance, there are many tags that will format text in italic, such as <cite> <dfn> <em> <i>, but each of these tags indicate a different semantic meaning. Only use a tag for the semantic meaning it represents.
If for some reason you want to format content without any semantic meaning, this is when you should use <div> and <span> tags styled with cSS.
Sequence
The sequence of content in the code should be the clearest most semantically correct order for the reader. Furthermore, the correct reading order of content must be able to be programmatically determined.
Headings
A page should be organized into sections, and further subdivided with semantic headings. These headings should describe the relevant topic or purpose of each subsection.
Links
The purpose of each link should be understandable from the link text alone. Don’t ever call a link something like “click here,” as this superfluous information will not help screen reader users identify the purpose of the link.
Describe clearly and succinctly where the link leads, or what its function is on the page. It can be more descriptively clear to use nouns within link text. Think carefully about the relationship between the link and its context, and try to prioritize using specific nouns in link names.
Component Names
The purpose of all user interface components should be able to be programmatically determined. All user interface components must also be named within the code. If the component has a visual presentation that includes text, then the name in the code must contain that text.
Non-Standard Interface Components
If you are using non-standard interface components, ensure that the name and role of all elements can be programmatically determined. Consider using WAI-ARIA to clarify this functionality.
The state, properties, and values that are recorded by these user interface elements should be able to be programmatically set. Notifications of those changes should be available to all user agents. These status messages should be presented to the user without receiving focus.