This sample document was created using accessibility techniques for headings, lists, image alternate text, tables, and columns. It should be completely accessible using assistive technologies such as screen readers.
Headings
There are eight section headings in this document. At the beginning, "Sample Document" is a level 1 heading. The main section headings, such as "Headings" and "Lists" are level 2 headings. The Tables section contains two sub-headings, "Simple Table" and "Complex Table," which are both level 3 headings.
Lists
The following outline of the sections of this document is an ordered (numbered) list with six items. The fifth item, "Tables," contains a nested unordered (bulleted) list with two items.
- Headings
- Lists
- Links
- Images
- Tables
- Simple Tables
- Complex Tables
- Columns
Links
In web documents, links can point different locations on the page, different pages, or even downloadable documents, such as Word documents or PDFs:
Images
Documents may contain images, which must have appropriate "alt" (alternate) text. Alt text should communicate what the image means, not how it looks.
Complex images, such as charts or graphs, also require long descriptions, but not all document types allow that. In web pages, long descriptions may be provided in several ways: on the page below the image, via a link below the image, or via a link on the image.
| Screen Reader |
Share |
| JAWS |
49% |
| NVDA |
14% |
| Window-Eyes |
12% |
| System Access |
10% |
| VoiceOver |
9% |
Tables
Simple Tables
Simple tables have a uniform number of columns and rows, without any merged cells:
| Screen Reader |
Responses |
Share |
| JAWS |
853 |
49% |
| NVDA |
238 |
14% |
| Window-Eyes |
214 |
12% |
| System Access |
181 |
10% |
| VoiceOver |
159 |
9% |
Complex Tables
The following is a complex table, using merged cells as headers for sections within the table. This can't be made accessible in all types of documents:
|
May |
September |
| Screen Reader |
Responses |
Share |
Responses |
Share |
| JAWS |
853 |
49% |
727 |
59% |
| NVDA |
238 |
14% |
105 |
9% |
| Window-Eyes |
214 |
12% |
138 |
11% |
| System Access |
181 |
10% |
58 |
5% |
| VoiceOver |
159 |
9% |
120 |
10% |
Columns
This is an example of columns. With columns, the page is split into two or more horizontal sections. Unlike tables, in which you usually read across a row and then down to the next, in columns, you read down a column and then across to the next.
When columns are not created correctly, screen readers may run lines together, reading the first line of the first column, then the first line of the second column, then the second line of the first column, and so on. Obviously, that is not accessible.
