Web Governance
Are white space characters used to format tables?
No impairments: Who view the content on different screen sizes.
Bridgit is a blind mother to a five-year-old girl and an 11-year-old boy:
“I think the best way to explain it is to imagine you are sitting and reading a book. You see two pages, the one on the left and the one on the right. First, you read the left page from the top line down to the bottom, and then you move over to the right page and read it the same way.
Sometimes, when I need to read a webpage that is laid out in columns, I should first read the left column, and then the right column, just like reading a book. But what I experience is that it feels like my screen reader reads the top line of the left side, then the top line of the right side, then the second line of the left side, then the second line of the right side, and so on. It is completely impossible to understand the content when it reads like this.”
This section provides some examples of the issue.
Here is a table that was created with text and whitespace characters, such as spaces. This table may be difficult to read and navigate with screen reader software and may break or become less readable on smaller screens.
Population | 1900 | 1950 | 2000
Women | approx. 0.83 bn | approx. 1.26 bn | approx. 3.05 bn
Men | approx. 0.85 bn | approx. 1.31 bn | approx. 3.09 bn
Total | approx. 1.68 bn | approx. 2.57 bn | approx. 6.14 bn
Here is a table created using HTML code instead of white space characters. Because semantic HTML tags for tables, headers, and other elements are used, screen reader users can navigate the information and easily understand the relationships between years and population figures.
Web Governance<table border="1">
<thead>
<tr><th>Population</th><th>1900</th><th>1950</th><th>2000</th></tr>
</thead>
<tbody>
<tr><td>Women</td><td>approx. 0.83 bn</td><td>approx. 1.26 bn</td><td>approx. 3.05 bn</td></tr>
<tr><td>Men</td><td>approx. 0.85 bn</td><td>approx. 1.31 bn</td><td>approx. 3.09 bn</td></tr>
<tr><td>Total</td><td>approx. 1.68 bn</td><td>approx. 2.57 bn</td><td>approx. 6.14 bn</td></tr>
</tbody>
</table>This section provides information about how to identify and fix the issue.
The Acquia Web Governance platform highlights elements where columns or tables are arranged with whitespace characters.
To fix the issue, update your content so that you no longer use whitespace characters to create a table or column layout.
For data tables: Use the correct semantic HTML tags, such as <table>, <th>, <td>, and so on.
For columns: Use CSS techniques such as grid layout to create columns, and do not rely on whitespace characters.
If this content did not answer your questions, try searching or contacting our support team for further assistance.
If this content did not answer your questions, try searching or contacting our support team for further assistance.