Accessibility is not a niche area of web design: everybody who works on the web needs to be interested in accessibility. You should try to make your websites as accessible as possible. For some of you it’s a legal obligation, but for everyone else it’s just the right thing to do.
These are some (but not all) of the elements that you can use. This is just a basic overview, so visit the links to get more detail on how they should be used.
| HTML5 | ARIA | Description |
|---|---|---|
<header> |
role="banner" |
Introduction to a page or section. Can contain a heading (H1-H6), site logo, navigation. |
<nav> |
role="navigation" |
Can be used for various types of navigation such as site navigation, subnavigation, breadcrumbs, previous/next links. |
<footer> |
role="contentinfo" |
Describes the page or a section of the page. A page’s footer may contain author name, copyright info, privacy policy, etc. |
<aside> |
role="complementary" |
Information that is tangentially related to the main page content, but can be read separately. Visually you might see this as a sidebar. |
<article> |
no equivilent | Independent item such as a blog post, article, etc. Think of it as something that could be independently picked up and moved around, such as blog posts in a RSS feed. |