This is a "not-end" requirement. What I want to mean is that this should be considered for any new page you create that Student can access. Also should correct the old pages.
I will use the label Feature Design Notes to this cases
When white space characters are used to arrange text visually to create the appearance of columns, sighted users perceive a structure that isn't represented in the code. Because assistive technologies present content in DOM order (the order that content appears in the HTML), people who use assistive technologies are likely to read the text in an order that doesn't make sense. (Also, a screen reader might announce each space character individually.)
Use one of the following techniques to restructure the content so that the DOM order matches the expected reading order:
Good: Modify the content so it has no visually apparent columns.
Better: Use a layout table to display the content in columns. #80
Best: Use CSS to display the content in columns. #77
Example 1
:x: White space characters in a <pre> element are used to create the appearance of two columns. When read in DOM order, the content doesn't make sense: "We the People general of the United Welfare, and States, in secure the Order…"
<pre>
We the People promote the general
of the United Welfare, and
States, in secure the
Order to form a Blessings of
more perfect Liberty to
Union, ourselves and
establish our Posterity,
Justice, insure do ordain and
domestic establish this
Tranquility, Constitution
provide for the for the United
common defense, States of America.
</pre>
:heavy_check_mark: CSS is used to display the content in columns in a way that the DOM order matches the expected reading order.
<style>
* {box-sizing: border-box;}
.column {float:left; width:50%;
padding:10px;}
</style>
...
<div class="column">We the People
of the United States,
in Order to form a
more perfect Union,
establish Justice,
insure domestic Tranquility,
provide for the common defense,
</div>
<div class="column">promote the
general Welfare,
and secure
the blessings of Liberty
to ourselves and our Posterity,
do ordain and establish this Constitution
for the United States of America.</div>
Related
76
Test Procedure
Search the page's HTML to determine whether the page includes any <pre> elements.
Examine each <pre> element to verify that white space characters are not used to arrange the text into a column. White space characters include spaces, tabs, line breaks, and carriage returns.
This is a "not-end" requirement. What I want to mean is that this should be considered for any new page you create that Student can access. Also should correct the old pages.
I will use the label Feature Design Notes to this cases
When white space characters are used to arrange text visually to create the appearance of columns, sighted users perceive a structure that isn't represented in the code. Because assistive technologies present content in DOM order (the order that content appears in the HTML), people who use assistive technologies are likely to read the text in an order that doesn't make sense. (Also, a screen reader might announce each space character individually.)
Use one of the following techniques to restructure the content so that the DOM order matches the expected reading order:
Example 1 :x: White space characters in a
<pre>
element are used to create the appearance of two columns. When read in DOM order, the content doesn't make sense: "We the People general of the United Welfare, and States, in secure the Order…":heavy_check_mark: CSS is used to display the content in columns in a way that the DOM order matches the expected reading order.
Related
76
Test Procedure
<pre>
elements.<pre>
element to verify that white space characters are not used to arrange the text into a column. White space characters include spaces, tabs, line breaks, and carriage returns.Expect output: Check 2 is true