- From: Matthew Paul Thomas <mpt@myrealbox.com>
- Date: Thu, 19 Jan 2006 01:43:42 +1300
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/
Received on Wednesday, 18 January 2006 04:43:42 UTC