[html5] r2115 - [ac] (1) Address all recent alt='' feedback. For further details see: http://lis [...]

whatwg at whatwg.org whatwg at whatwg.org
Tue Aug 26 01:19:40 PDT 2008


Author: ianh
Date: 2008-08-26 01:19:38 -0700 (Tue, 26 Aug 2008)
New Revision: 2115

Modified:
   index
   source
Log:
[ac] (1) Address all recent alt='' feedback. For further details see: http://lists.w3.org/Archives/Public/public-html/2008Aug/0759.html

Modified: index
===================================================================
--- index	2008-08-25 10:03:53 UTC (rev 2114)
+++ index	2008-08-26 08:19:38 UTC (rev 2115)
@@ -28,7 +28,7 @@
 
    <h1 id=html-5>HTML 5</h1>
 
-   <h2 class="no-num no-toc" id=draft>Draft Recommendation — 25 August
+   <h2 class="no-num no-toc" id=draft>Draft Recommendation — 26 August
     2008</h2>
 
    <p>You can take part in this work. <a
@@ -11935,9 +11935,9 @@
      <a href="#outline">outline</a>. Abort these steps.
 
    <li>
-    <p>Associate any nodes that were not associated a <a href="#section0"
-     title=concept-section>section</a> in the steps above with <var
-     title="">current outlinee</var> as their section.
+    <p>Associate any nodes that were not associated with a <a
+     href="#section0" title=concept-section>section</a> in the steps above
+     with <var title="">current outlinee</var> as their section.
 
    <li>
     <p>Associate all nodes with the heading of the <a href="#section0"
@@ -16147,38 +16147,9 @@
 
    <dt>If the <code title=attr-img-src><a href="#src">src</a></code>
     attribute is set and the <code title=attr-img-alt><a
-    href="#alt0">alt</a></code> attribute is set to a string whose first
-    character is a U+007B LEFT CURLY BRACKET character ({) and whose last
-    character is a U+007D RIGHT CURLY BRACKET character (})
+    href="#alt0">alt</a></code> attribute is set to a value that isn't empty
 
    <dd>
-    <p>The image is a key part of the content, and there is no textual
-     equivalent of the image available. The string consisting of all the
-     characters between the first and the last character of the value of the
-     <code title=attr-img-alt><a href="#alt0">alt</a></code> attribute gives
-     the kind of image (e.g. photo, diagram, user-uploaded image). If that
-     value is the empty string (i.e. the attribute is just "<code
-     title="">{}</code>"), then even the kind of image being shown is not
-     known.</p>
-
-    <p>If the image is <i>available</i>, the element represents the image
-     specified by the <code title=attr-img-src><a href="#src">src</a></code>
-     attribute.</p>
-
-    <p>If the image is not <i>available</i> or if the user agent is not
-     configured to display the image, then the user agent should display some
-     sort of indicator that the image is not being rendered, and, if
-     possible, provide to the user the information regarding the kind of
-     image that is (as derived from the <code title=attr-img-alt><a
-     href="#alt0">alt</a></code> attribute).</p>
-
-   <dt>If the <code title=attr-img-src><a href="#src">src</a></code>
-    attribute is set and the <code title=attr-img-alt><a
-    href="#alt0">alt</a></code> attribute is set to a value that isn't
-    matched by the previous two entries (not empty, not "<code
-    title="">{...}</code>")
-
-   <dd>
     <p>The image is a key part of the content; the <code
      title=attr-img-alt><a href="#alt0">alt</a></code> attribute gives a
      textual equivalent or replacement for the image.</p>
@@ -16197,28 +16168,54 @@
     href="#alt0">alt</a></code> attribute is not
 
    <dd>
-    <p>The image's role in the document is unknown.</p>
+    <p>The image might be a key part of the content, and there is no textual
+     equivalent of the image available.</p>
 
     <p>If the image is <i>available</i>, the element represents the image
      specified by the <code title=attr-img-src><a href="#src">src</a></code>
      attribute.</p>
 
     <p>If the image is not <i>available</i> or if the user agent is not
-     configured to display the image, then the user agent may display some
-     sort of indicator that the image is not being rendered.</p>
+     configured to display the image, then the user agent should display some
+     sort of indicator that there is an image that is not being rendered, and
+     may, if requested by the user, or if so configured, or when required to
+     provide contextual information in response to navigation, provide
+     caption information for the image, derived as follows:</p>
 
-   <dt>If the <code title=attr-img-src><a href="#src">src</a></code>
-    attribute is not set and the <code title=attr-img-alt><a
-    href="#alt0">alt</a></code> attribute is set to a string whose first
-    character is a U+007B LEFT CURLY BRACKET character ({) and whose last
-    character is a U+007D RIGHT CURLY BRACKET character (})
+    <ol>
+     <li>
+      <p>If the image has a <code title=attr-title><a
+       href="#title">title</a></code> attribute whose value is not the empty
+       string, then the value of that attribute is the caption information;
+       abort these steps.
 
-   <dd>
-    <p>The user agent should display some sort of indicator that an image is
-     missing, providing to the user the information regarding the kind of
-     image that it would be (as derived from the <code title=attr-img-alt><a
-     href="#alt0">alt</a></code> attribute).</p>
+     <li>
+      <p>If the image is the child of a <code><a
+       href="#figure">figure</a></code> element that has a child <code><a
+       href="#legend">legend</a></code> element, then the contents of the
+       first such <code><a href="#legend">legend</a></code> element are the
+       caption information; abort these steps.
+     </li>
+     <!-- aria processing goes here -->
 
+     <li>
+      <p>Run the algorithm to create the <a href="#outline">outline</a> for
+       the document.
+
+     <li>
+      <p>If the <code><a href="#img">img</a></code> element did not end up
+       associated with a heading in theoutline, or if there are any other
+       images that are lacking an <code title=attr-img-alt><a
+       href="#alt0">alt</a></code> attribute and that are associated with the
+       same heading in the outline as the <code><a href="#img">img</a></code>
+       element in question, then there is no caption information; abort these
+       steps.
+
+     <li>
+      <p>The caption information is the heading with which the image is
+       associated according to the outline.
+    </ol>
+
    <dt>If the <code title=attr-img-src><a href="#src">src</a></code>
     attribute is not set and either the <code title=attr-img-alt><a
     href="#alt0">alt</a></code> attribute is set to the empty string or the
@@ -16367,10 +16364,12 @@
 
    <p>Here it is not known at the time of publication what the image will be,
     only that it will be a coat of arms of some kind, and thus no replacement
-    text can be provided, and instead only the kind of image is provided:</p>
+    text can be provided, and instead only a brief caption for the image is
+    provided, in the <code title=attr-title><a href="#title">title</a></code>
+    attribute:</p>
 
    <pre><p>The last user to have uploaded a coat of arms uploaded this one:</p>
-<p><img src="last-uploaded-coat-of-arms.cgi" alt="{user-uploaded coat of arms}"></p></pre>
+<p><img src="last-uploaded-coat-of-arms.cgi" title="User-uploaded coat of arms."></p></pre>
 
    <p>Ideally, the author would find a way to provide real replacement text
     even in this case, e.g. by asking the previous user. Not providing
@@ -16431,12 +16430,6 @@
    href="#alt0">alt</a></code> attribute depend on what the image is intended
    to represent, as described in the following sections.
 
-  <p>A general requirement that applies in all cases is that the <code
-   title=attr-img-alt><a href="#alt0">alt</a></code> attribute's value must
-   not start with a U+007B LEFT CURLY BRACKET character ({) and end with a
-   U+007D RIGHT CURLY BRACKET character (}), unless the attribute is giving
-   the <em>kind</em> of image rather than replacement text.
-
   <h6 id=a-link><span class=secno>4.7.2.1.1. </span>A link or button
    containing nothing but the image</h6>
 
@@ -16728,7 +16721,7 @@
 to both the DOM and to Script Execution. Script Execution is
 linked to the DOM, and, using document.write(), passes data to
 the Tokeniser.</p>
-<strong><p><img src="images/parsing-model-overview.png" alt=""
+<p><strong><img src="images/parsing-model-overview.png" alt=""
         title="Flowchart representation of the parsing model."></strong></p></pre>
 
    <pre><!-- Using <figure> and <legend> -->
@@ -16861,7 +16854,7 @@
 <p>You come across a flying spaghetti monster. Which side of His
 Noodliness do you wish to reach out for?</p>
 <strong><p><a href="?go=left" ><img src="fsm-left.png"  alt="Left side. "></a
-  ><img src="fsm-middle.png"  alt=""
+  ><img src="fsm-middle.png" alt=""
   ><a href="?go=right"><img src="fsm-right.png" alt="Right side."></a></p></strong></pre>
   </div>
 
@@ -16990,30 +16983,48 @@
      sharing an image on his blog).</p>
 
     <p>In such cases, the <code title=attr-img-alt><a
-     href="#alt0">alt</a></code> attribute's value must be a description of
-     the <em>kind</em> of image, surrounded by braces ("{" and "}"), if that
-     is known. The kind of image is something along the lines of "photo",
-     "diagram", "painting", "user-uploaded image", etc. If even the kind of
-     image cannot be determined, then the string <code title="">{}</code>
-     must be used.</p>
+     href="#alt0">alt</a></code> attribute's value may be omitted, but one of
+     the following conditions must be met as well:</p>
 
+    <ul>
+     <li>The <code title=attr-title><a href="#title">title</a></code>
+      attribute is present and has a non-empty value.
+
+     <li>The <code><a href="#img">img</a></code> element is in a <code><a
+      href="#figure">figure</a></code> element that contains a <code><a
+      href="#legend">legend</a></code> element that contains content other
+      than <a href="#inter-element">inter-element whitespace</a>.
+
+     <li>The <code><a href="#img">img</a></code> element is the only <code><a
+      href="#img">img</a></code> element without an <code
+      title=attr-img-alt><a href="#alt0">alt</a></code> attribute in its <a
+      href="#section0" title=concept-section>section</a>, and its <a
+      href="#section0" title=concept-section>section</a> has an associated
+      heading.
+    </ul>
+
     <p class=note>Such cases are to be kept to an absolute minimum. If there
      is even the slightest possibility of the author having the ability to
-     provide real alternative text, then it would not be acceptable to
-     provide the "<code title="">{...}</code>"-style value.</p>
+     provide real alternative text, then it would not be acceptable to omit
+     the code title="attr-img-alt">alt attribute.</p>
 
     <div class=example>
      <p>A photo on a photo-sharing site, if the site received the image with
       no metadata other than the caption:</p>
 
      <pre><figure>
- <strong><img src="1100670787_6a7c664aef.jpg" alt="{photo}"></strong>
+ <strong><img src="1100670787_6a7c664aef.jpg"></strong>
  <legend>Bubbles traveled everywhere with us.</legend>
 </figure></pre>
 
-     <p>In this case, though, it would be better if a detailed description of
-      the important parts of the image obtained from the user and included on
-      the page.</p>
+     <p>It could also be marked up like this:</p>
+
+     <pre><h1>Bubbles traveled everywhere with us.</h1>
+ <strong><img src="1100670787_6a7c664aef.jpg"></strong></pre>
+
+     <p>In either case, though, it would be better if a detailed description
+      of the important parts of the image obtained from the user and included
+      on the page.</p>
     </div>
 
     <div class=example>
@@ -17025,7 +17036,7 @@
  <h1>I took a photo</h1>
  <p>I went out today and took a photo!</p>
  <figure>
-  <strong><img src="photo2.jpeg" alt="{photograph}"></strong>
+  <strong><img src="photo2.jpeg"></strong>
   <legend>A photograph taken blindly from my front porch.</legend>
  </figure>
 </article></pre>
@@ -17052,10 +17063,12 @@
      <p>Sometimes the entire point of the image is that a textual description
       is not available, and the user is to provide the description. For
       instance, the point of a CAPTCHA image is to see if the user can
-      literally read the graphic. Here is one way to mark up a CAPTCHA:</p>
+      literally read the graphic. Here is one way to mark up a CAPTCHA (note
+      the <code title=attr-title><a href="#title">title</a></code>
+      attribute):</p>
 
      <pre><p><label>What does this image say?
-<strong><img src="captcha.cgi?id=8934" alt="{captcha}"></strong>
+<strong><img src="captcha.cgi?id=8934" title="CAPTCHA"></strong>
 <input type=text name=captcha></label>
 (If you cannot see the image, you can use an <a
 href="?audio">audio</a> test instead.)</p></pre>
@@ -17070,24 +17083,16 @@
   <tr> <th> Images <th> Descriptions
  <tbody>
   <tr>
-   <td> <strong><img src="2421.png" alt="{}"></strong>
+   <td> <strong><img src="2421.png" title="Image 640 by 100, filename 'banner.gif'"></strong>
    <td> <input name="alt2421">
   <tr>
-   <td> <strong><img src="2422.png" alt="{}"></strong>
+   <td> <strong><img src="2422.png" title="Image 200 by 480, filename 'ad3.gif'"></strong>
    <td> <input name="alt2422">
 </table></pre>
-    </div>
 
-    <div class=example>
-     <p>The values given in the "<code title="">{...}</code>" syntax are
-      intended for the user, they are not keywords. So, for instance, in a
-      Finnish document, they would be in Finnish. The following snippet shows
-      how a photo might be marked up on a Finnish-language photo upload site,
-      when the user has not provided any replacement text:</p>
-
-     <pre><html lang="fi">
- ...
- <strong><img src="v3525.jpeg" alt="{valokuva}"></strong></pre>
+     <p>Notice that even in this example, as much useful information as
+      possible is still included in the <code title=attr-title><a
+      href="#title">title</a></code> attribute.</p>
     </div>
 
     <p class=note>Since some users cannot use images at all (e.g. because
@@ -17095,9 +17100,11 @@
      browser, or because they are listening to the page being read out by a
      hands-free automobile voice Web browser, or simply because they are
      blind), the <code title=attr-img-alt><a href="#alt0">alt</a></code>
-     attribute is only allowed to contain the <em>kind</em> of image rather
-     than replacement text when no alternative text is available and none can
-     be made available, e.g. on automated image gallery sites.</p>
+     attribute is only allowed to be omitted rather than being provided with
+     replacement text when no alternative text is available and none can be
+     made available, as in the above examples. Lack of effort from the part
+     of the author is not an acceptable reason for omitting the <code
+     title=attr-img-alt><a href="#alt0">alt</a></code> attribute.</p>
   </dl>
 
   <h6 id=an-image><span class=secno>4.7.2.1.10. </span>An image not intended
@@ -17145,6 +17152,12 @@
    title=attr-title><a href="#title">title</a></code> attribute can be used
    for supplemental information.
 
+  <p class=note>One way to think of alternative text is to think about what
+   how you would read the page containing the image to someone over the
+   phone, without mentioning that there is an image present. Whatever you say
+   instead of the image is typically a good start for writing the alternative
+   text.
+
   <h4 id=the-iframe><span class=secno>4.7.3 </span>The <dfn
    id=iframe><code>iframe</code></dfn> element</h4>
 

Modified: source
===================================================================
--- source	2008-08-25 10:03:53 UTC (rev 2114)
+++ source	2008-08-26 08:19:38 UTC (rev 2115)
@@ -9758,7 +9758,7 @@
    <span>sectioning root</span> element in the DOM. There is no
    <span>outline</span>. Abort these steps.</p></li>
 
-   <li><p>Associate any nodes that were not associated a <span
+   <li><p>Associate any nodes that were not associated with a <span
    title="concept-section">section</span> in the steps above with <var
    title="">current outlinee</var> as their section.</p></li>
 
@@ -13626,41 +13626,10 @@
 
    <dt>If the <code title="attr-img-src">src</code> attribute is set
    and the <code title="attr-img-alt">alt</code> attribute is set to a
-   string whose first character is a U+007B LEFT CURLY BRACKET
-   character ({) and whose last character is a U+007D RIGHT CURLY
-   BRACKET character (})</dt>
+   value that isn't empty</dt>
 
    <dd>
 
-    <p>The image is a key part of the content, and there is no textual
-    equivalent of the image available. The string consisting of all
-    the characters between the first and the last character of the
-    value of the <code title="attr-img-alt">alt</code> attribute gives
-    the kind of image (e.g. photo, diagram, user-uploaded image). If
-    that value is the empty string (i.e. the attribute is just "<code
-    title="">{}</code>"), then even the kind of image being shown is
-    not known.</p>
-
-    <p>If the image is <i>available</i>, the element represents the image
-    specified by the <code title="attr-img-src">src</code>
-    attribute.</p>
-
-    <p>If the image is not <i>available</i> or if the user agent is not
-    configured to display the image, then the user agent should
-    display some sort of indicator that the image is not being
-    rendered, and, if possible, provide to the user the information
-    regarding the kind of image that is (as derived from the <code
-    title="attr-img-alt">alt</code> attribute).</p>
-
-   </dd>
-
-   <dt>If the <code title="attr-img-src">src</code> attribute is set
-   and the <code title="attr-img-alt">alt</code> attribute is set to a
-   value that isn't matched by the previous two entries (not empty,
-   not "<code title="">{...}</code>")</dt>
-
-   <dd>
-
     <p>The image is a key part of the content; the <code
     title="attr-img-alt">alt</code> attribute gives a textual
     equivalent or replacement for the image.</p>
@@ -13682,31 +13651,50 @@
 
    <dd>
 
-    <p>The image's role in the document is unknown.</p>
+    <p>The image might be a key part of the content, and there is no
+    textual equivalent of the image available.</p>
 
-    <p>If the image is <i>available</i>, the element represents the image
-    specified by the <code title="attr-img-src">src</code>
+    <p>If the image is <i>available</i>, the element represents the
+    image specified by the <code title="attr-img-src">src</code>
     attribute.</p>
 
-    <p>If the image is not <i>available</i> or if the user agent is not
-    configured to display the image, then the user agent may display
-    some sort of indicator that the image is not being rendered.</p>
+    <p>If the image is not <i>available</i> or if the user agent is
+    not configured to display the image, then the user agent should
+    display some sort of indicator that there is an image that is not
+    being rendered, and may, if requested by the user, or if so
+    configured, or when required to provide contextual information in
+    response to navigation, provide caption information for the image,
+    derived as follows:</p>
 
-   </dd>
+    <ol>
 
-   <dt>If the <code title="attr-img-src">src</code> attribute is not
-   set and the <code title="attr-img-alt">alt</code> attribute is set
-   to a string whose first character is a U+007B LEFT CURLY BRACKET
-   character ({) and whose last character is a U+007D RIGHT CURLY
-   BRACKET character (})</dt>
+     <li><p>If the image has a <code title="attr-title">title</code>
+     attribute whose value is not the empty string, then the value of
+     that attribute is the caption information; abort these
+     steps.</p></li>
 
-   <dd>
+     <li><p>If the image is the child of a <code>figure</code> element
+     that has a child <code>legend</code> element, then the contents
+     of the first such <code>legend</code> element are the caption
+     information; abort these steps.</p></li>
 
-    <p>The user agent should display some sort of indicator that an
-    image is missing, providing to the user the information regarding
-    the kind of image that it would be (as derived from the <code
-    title="attr-img-alt">alt</code> attribute).</p>
+     <!-- aria processing goes here -->
 
+     <li><p>Run the algorithm to create the <span>outline</span> for
+     the document.</p></li>
+
+     <li><p>If the <code>img</code> element did not end up associated
+     with a heading in theoutline, or if there are any other images
+     that are lacking an <code title="attr-img-alt">alt</code>
+     attribute and that are associated with the same heading in the
+     outline as the <code>img</code> element in question, then there
+     is no caption information; abort these steps.</p></li>
+
+     <li><p>The caption information is the heading with which the
+     image is associated according to the outline.</p></li>
+
+    </ol>
+
    </dd>
 
    <dt>If the <code title="attr-img-src">src</code> attribute is not
@@ -13864,11 +13852,12 @@
 
    <p>Here it is not known at the time of publication what the image
    will be, only that it will be a coat of arms of some kind, and thus
-   no replacement text can be provided, and instead only the kind of
-   image is provided:</p>
+   no replacement text can be provided, and instead only a brief
+   caption for the image is provided, in the <code
+   title="attr-title">title</code> attribute:</p>
 
    <pre><p>The last user to have uploaded a coat of arms uploaded this one:</p>
-<p><img src="last-uploaded-coat-of-arms.cgi" alt="{user-uploaded coat of arms}"></p></pre>
+<p><img src="last-uploaded-coat-of-arms.cgi" title="User-uploaded coat of arms."></p></pre>
 
    <p>Ideally, the author would find a way to provide real replacement
    text even in this case, e.g. by asking the previous user. Not
@@ -13934,13 +13923,7 @@
   attribute depend on what the image is intended to represent, as
   described in the following sections.</p>
 
-  <p>A general requirement that applies in all cases is that the <code
-  title="attr-img-alt">alt</code> attribute's value must not start
-  with a U+007B LEFT CURLY BRACKET character ({) and end with a U+007D
-  RIGHT CURLY BRACKET character (}), unless the attribute is giving
-  the <em>kind</em> of image rather than replacement text.</p>
 
-
   <h6>A link or button containing nothing but the image</h6>
 
   <p>When an <span>a</span> element that is a <span>hyperlink</span>,
@@ -14256,7 +14239,7 @@
 to both the DOM and to Script Execution. Script Execution is
 linked to the DOM, and, using document.write(), passes data to
 the Tokeniser.</p>
-<strong><p><img src="images/parsing-model-overview.png" alt=""
+<p><strong><img src="images/parsing-model-overview.png" alt=""
         title="Flowchart representation of the parsing model."></strong></p></pre>
 
    <pre><!-- Using <figure> and <legend> -->
@@ -14401,7 +14384,7 @@
 <p>You come across a flying spaghetti monster. Which side of His
 Noodliness do you wish to reach out for?</p>
 <strong><p><a href="?go=left" ><img src="fsm-left.png"  alt="Left side. "></a
-  ><img src="fsm-middle.png"  alt=""
+  ><img src="fsm-middle.png" alt=""
   ><a href="?go=right"><img src="fsm-right.png" alt="Right side."></a></p></strong></pre>
 
   </div>
@@ -14555,18 +14538,31 @@
     (e.g. a blind photographer sharing an image on his blog).</p>
 
     <p>In such cases, the <code title="attr-img-alt">alt</code>
-    attribute's value must be a description of the <em>kind</em> of
-    image, surrounded by braces ("{" and "}"), if that is known. The
-    kind of image is something along the lines of "photo", "diagram",
-    "painting", "user-uploaded image", etc. If even the kind of image
-    cannot be determined, then the string <code title="">{}</code>
-    must be used.</p>
+    attribute's value may be omitted, but one of the following
+    conditions must be met as well:</p>
 
+    <ul>
+
+     <li>The <code title="attr-title">title</code> attribute is
+     present and has a non-empty value.</li>
+
+     <li>The <code>img</code> element is in a <code>figure</code>
+     element that contains a <code>legend</code> element that contains
+     content other than <span>inter-element whitespace</span>.</li>
+
+     <li>The <code>img</code> element is the only <code>img</code>
+     element without an <code title="attr-img-alt">alt</code>
+     attribute in its <span title="concept-section">section</span>,
+     and its <span title="concept-section">section</span> has an
+     associated heading.</li>
+
+    </ul>
+
     <p class="note">Such cases are to be kept to an absolute
     minimum. If there is even the slightest possibility of the author
     having the ability to provide real alternative text, then it would
-    not be acceptable to provide the "<code
-    title="">{...}</code>"-style value.</p>
+    not be acceptable to omit the code title="attr-img-alt">alt</code>
+    attribute.</p>
 
     <div class="example">
 
@@ -14574,11 +14570,16 @@
      image with no metadata other than the caption:</p>
 
      <pre><figure>
- <strong><img src="1100670787_6a7c664aef.jpg" alt="{photo}"></strong>
+ <strong><img src="1100670787_6a7c664aef.jpg"></strong>
  <legend>Bubbles traveled everywhere with us.</legend>
 </figure></pre>
 
-     <p>In this case, though, it would be better if a detailed
+     <p>It could also be marked up like this:</p>
+
+     <pre><h1>Bubbles traveled everywhere with us.</h1>
+ <strong><img src="1100670787_6a7c664aef.jpg"></strong></pre>
+
+     <p>In either case, though, it would be better if a detailed
      description of the important parts of the image obtained from the
      user and included on the page.</p>
 
@@ -14594,7 +14595,7 @@
  <h1>I took a photo</h1>
  <p>I went out today and took a photo!</p>
  <figure>
-  <strong><img src="photo2.jpeg" alt="{photograph}"></strong>
+  <strong><img src="photo2.jpeg"></strong>
   <legend>A photograph taken blindly from my front porch.</legend>
  </figure>
 </article></pre>
@@ -14623,11 +14624,12 @@
      <p>Sometimes the entire point of the image is that a textual
      description is not available, and the user is to provide the
      description. For instance, the point of a CAPTCHA image is to see
-     if the user can literally read the graphic. Here is one way to mark
-     up a CAPTCHA:</p>
+     if the user can literally read the graphic. Here is one way to
+     mark up a CAPTCHA (note the <code title="attr-title">title</code>
+     attribute):</p>
 
      <pre><p><label>What does this image say?
-<strong><img src="captcha.cgi?id=8934" alt="{captcha}"></strong>
+<strong><img src="captcha.cgi?id=8934" title="CAPTCHA"></strong>
 <input type=text name=captcha></label>
 (If you cannot see the image, you can use an <a
 href="?audio">audio</a> test instead.)</p></pre>
@@ -14642,28 +14644,17 @@
   <tr> <th> Images <th> Descriptions
  <tbody>
   <tr>
-   <td> <strong><img src="2421.png" alt="{}"></strong>
+   <td> <strong><img src="2421.png" title="Image 640 by 100, filename 'banner.gif'"></strong>
    <td> <input name="alt2421">
   <tr>
-   <td> <strong><img src="2422.png" alt="{}"></strong>
+   <td> <strong><img src="2422.png" title="Image 200 by 480, filename 'ad3.gif'"></strong>
    <td> <input name="alt2422">
 </table></pre>
 
-    </div>
+     <p>Notice that even in this example, as much useful information
+     as possible is still included in the <code
+     title="attr-title">title</code> attribute.</p>
 
-    <div class="example">
-
-     <p>The values given in the "<code title="">{...}</code>" syntax are
-     intended for the user, they are not keywords. So, for instance, in
-     a Finnish document, they would be in Finnish. The following snippet
-     shows how a photo might be marked up on a Finnish-language photo
-     upload site, when the user has not provided any replacement
-     text:</p>
-
-     <pre><html lang="fi">
- ...
- <strong><img src="v3525.jpeg" alt="{valokuva}"></strong></pre>
-
     </div>
 
     <p class="note">Since some users cannot use images at all
@@ -14671,10 +14662,12 @@
     are using a text-only browser, or because they are listening to
     the page being read out by a hands-free automobile voice Web
     browser, or simply because they are blind), the <code
-    title="attr-img-alt">alt</code> attribute is only allowed to
-    contain the <em>kind</em> of image rather than replacement text
-    when no alternative text is available and none can be made
-    available, e.g. on automated image gallery sites.</p>
+    title="attr-img-alt">alt</code> attribute is only allowed to be
+    omitted rather than being provided with replacement text when no
+    alternative text is available and none can be made available, as
+    in the above examples. Lack of effort from the part of the author
+    is not an acceptable reason for omitting the <code
+    title="attr-img-alt">alt</code> attribute.</p>
 
    </dd>
 
@@ -14729,10 +14722,16 @@
   title="attr-title">title</code> attribute can be used for
   supplemental information.</p>
 
+  <p class="note">One way to think of alternative text is to think
+  about what how you would read the page containing the image to
+  someone over the phone, without mentioning that there is an image
+  present. Whatever you say instead of the image is typically a good
+  start for writing the alternative text.</p>
 
 
 
 
+
   <h4>The <dfn><code>iframe</code></dfn> element</h4>
 
   <dl class="element">




More information about the Commit-Watchers mailing list