Accessibility - Web Standards: Mastering HTML5, CSS3, and XML - page 354

Ensured Readability
Ideally, text is easy to read. Complex text content may be summarized in a form that requires a reading ability less
advanced than the upper secondary education level. For example, a technical article can be too complex to read for
some people, and a text summary containing shorter sentences and more common words might be helpful for them. To
achieve AAA conformance, text lines may not exceed an average of 80 characters even if the browser window is resized.
People with certain cognitive disabilities who have trouble tracking single-spaced lines might find 1.5× or double
line spacing more convenient to read. Web pages may have buttons to improve readability by increasing line spaces
and paragraph spaces (Listing 10-3).
Listing 10-3. Sample Buttons for Manipulating Line Space and Paragraph Space
...
<script type="text/javascript">
function inclineh() {
document.getElementById('main').style.lineHeight="200%";
}
function incpars() {
var get_ps = document.getElementsByTagName("p");
for (var i = 0; i < get_ps.length; i++) {
get_ps[i].style.marginBottom="40px";
}
}
</script>
...
<div>
<a href="javascript:inclineh();"><img src="images/lineh.png" alt="Line height" 
title="Increased line height" /></a>
<a href="javascript:incpars();"><img src="images/pspacing.png" alt="Paragraph spacing" 
title="Increased paragraph spacing" /></a>
</div>
...
<div id="main">
<p>
This is the first paragraph of the main content.
</p>
<p>
This is the second paragraph of the main content.
</p>
</div>
Additionally, the letter-spacing CSS property must be used to control spacing within words (whitespace
between characters) that can further increase readability. Font sizes are best provided in relative units ( % or em ). The
em unit is preferred for text sizes of containers such as tables where percent-based fonts might result in a way too
large font size when resizing the window. Information presented by text formatting such as font face, font size, or
text decoration must also be accessible without formatting. Basic text formatting should apply not only for (X)HTML
documents but also for plain text. Text files must have text formatting that represents paragraphs, lists, and headings.
The visual presentation of texts should be controlled with CSS properties such as font-family , font-size , font-
style , font-weight , color , letter-spacing , line-height , text-align , text-transform , and background-image
and the :first-line , :first-letter , :before and :after pseudoclasses. These properties and pseudoclasses can
eliminate the need for image text.