Textual Content
Quotations
WAI Definition (Checkpoint 3.7)
Mark up quotations. Do not use quotation markup for formatting effects such as indentation.
Explanation
Use the <q>or <blockquote> tags to mark up quotations.
If you want to achieve indentation effects, use margins or padding in CSS.
Rationale
Some screen readers identify text that has been correctly marked as a quotation differently, which gives people who use these technologies important information about the context of the text.
Technique
Short quotations of 10 words or less should use the <q> tag for markup. Long quotations of 11 words or more should use the <blockquote> tag.
Example
<blockquote>I feel honoured and very humbled when I think of all our founding fathers wise enough and courageous enough to save this world from the scourge of war who have negotiated, drafted and finally signed the Charter of the United Nations, which has shaped the future of the whole international community.</blockquote>
<p>Secretary-General Ban Ki-moon in remarks at San Francisco War Memorial, 26 July 2007</p>
To indent a paragraph without using the <blockquote> tag, use the following combination of CSS and HTML code:
CSS
p.indent {margin-left:2em;}
HTML
<p class="indent">This paragraph will have a left indent.</p>
Validation
Test
Using the Firefox Web Developer's Toolbar (plugin):
Go to Outline > Outline block elements.
Note
Make sure the option "Show element name when outlining" is checked (in the Outline menu).
Success Criteria
The <blockquote> and <q> tags are to be used for quotations only.