WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: semantic HTML for intro text


From: Jukka K. Korpela
Date: May 25, 2007 2:20PM

On Fri, 25 May 2007, Moore, Michael wrote:

> The heading at the top of the page <h1> - this is the main heading of
> the page

That much is rather obvious, especially since the text there is "This is
example heading?" The rest is Latin and obviously not any real context, so
how can we deduce the intended structure?

> The orange intro text, <p class="intro"> give it a style

Is it intro or summary? The question called it intro, but why is it
visually so prominent? Neither intros nor summaries have any suitable
semantic markup, so using just classes and styling seems obvious. But the
visual appearance - which is relevant to accessibility, too, since
accessibility has many aspects - should reflect the intended role. If it
is just an introduction, it should not be particular prominent.

If it is really a summary, one might consider using a parahgraph with
its content wrapped inside strong markup:
<p class="summary"><strong>summary text</strong></p>
You might then use CSS to highlight in some particular manner, probably
turning off the default bolding, since bold text is hard to read in large
quantities. Yet some browsers might _read_ the text emphatically due to
the <strong> markup. However, this approach is probably too contrived in
most cases. If the reading mode is really different for <strong> elements,
then it might be too emphatic. Who want's to listen an entire paragraph
spoken emphatically?

> The smaller heading <h2> - this is a subheading

Rather, second-level heading. Perhaps it is.

> The quote <blockquote>

That would be logical markup, but is it accessible? Normally quotation
marks should be omitted when using a blockquote, and browsers shouldn't
add quotation marks either, and they don't. We could add them in a style
sheet, but can we rely on that?

My point is that the common way of presenting block quotations as
indented, and possibly in a different font, does not work in non-visual
presentation. Unless a browser somehow recognizes the <blockquote> markup
or the indentation when deciding on the speech mode, the block quotation
will be read (or rendered in Braille) as normal text - with no indication
of its being a quotation, or where the quotation ends. The user might be
able to figure such things out from the context, but really obscure
situations may arise.

Quotation marks, on the other hand, might be expected to act as hints to
programs in many cases. So maybe we should use them for block quotations,
too, against recommendations and typographic practice? I don't like the
conclusion, but what can we do?

I have no idea of why the quoted text appears in bold. If it is meant to
emphasize the quote, I think using CSS for that is sufficient, since there
is hardly any suitable way to emphasize it non-visually.

Jukka "Yucca" Korpela, http://www.cs.tut.fi/~jkorpela/