[whatwg] Definition of alt= attribute
Matthew Paul Thomas
mpt at myrealbox.com
Wed Jan 18 04:43:42 PST 2006
For a while I've been honing a clearer definition of the alt=
attribute, one that tries to curtail the worst misuses of the attribute
without being horribly wordy. Since alt= is not yet defined in the Web
Applications 1.0 draft, my text may be useful.
In HTML 4 alt= is an attribute for <img>, <applet>, and <input>. I can
think of no reason for <input alt= to exist (<form alt= would make
slightly more sense, for non-interactive UAs), and Web Applications 1.0
currently includes an "applets" HTMLCollection but no <applet> element,
so I've tweaked the text to refer to <img> elements exclusively. If
<applet> is introduced, alt= should be put in a "Common attributes"
section, and occurrences of "image" changed to "item".
Anyway, continuing from the existing beginning of the <img> section:
----
<p>Since the two representations are alternate, not supplementary, a
user agent should render either an image or its alternate text but not
both at once. For example, a <abbr>UA</abbr> should not show alternate
text in a tooltip. Authors who wish to provide supplementary text for
an image may use the <code>title</code> attribute instead.</p>
<p>Specifying alternate text helps readers without graphic display
terminals, visually impaired people, others who prefer listening to
documents rather than viewing them, people viewing documents offline
when an image is not available, and so on. To produce sensible
alternate text, authors should follow these guidelines:</p>
<ul>
<li><p>Do not describe the image. For example, do not write <code
class="bad example"><img src="logo.png" alt="ExampleCorp
logo"></code>, or <code class="bad example"><img src="logo.png"
alt="logo.png (3890 bytes)"></code>. Instead, write text that
fulfils the image’s purpose; for example, <code class="good
example"><h1><img src="logo.png" alt="Welcome to
ExampleCorp"><h1></code>. A description is appropriate only if
the image itself is discussed but not elsewhere described in the
document. For example: <code class="good example"><p>I managed to
snap a photo of the animal. <img src="animal.jpg" class="photo"
alt="It's a bit blurry, but it shows a large brown creature running
through the forest."> At last, evidence of the
moa!</p></code></p></li>
<li><p>Do not provide alternate text for an image when it is used for
formatting, decoration, illustration, or linking to a solely graphical
resource. Instead, use <code>alt=""</code>. For example, a portrait of
someone should usually have <code>alt=""</code>, unless either their
physical appearance or the artwork itself is highly relevant and not
described elsewhere in the document.</p></li>
</ul>
----
--
Matthew Paul Thomas
http://mpt.net.nz/
More information about the whatwg
mailing list