W3C home > Mailing lists > Public > public-html-commits@w3.org > May 2010

html5/alt-techniques Overview.html,1.25,1.26

From: Steven Faulkners via cvs-syncmail <cvsmail@w3.org>
Date: Wed, 19 May 2010 10:32:55 +0000
To: public-html-commits@w3.org
Message-Id: <E1OEga7-00070q-4r@lionel-hutz.w3.org>
Update of /sources/public/html5/alt-techniques
In directory hutz:/tmp/cvs-serv26937

Modified Files:
	Overview.html 
Log Message:
started adding text about Using an empty alt attribute alt="" and added info about how to contribute to the document.

Index: Overview.html
===================================================================
RCS file: /sources/public/html5/alt-techniques/Overview.html,v
retrieving revision 1.25
retrieving revision 1.26
diff -u -d -r1.25 -r1.26
--- Overview.html	17 May 2010 14:06:45 -0000	1.25
+++ Overview.html	19 May 2010 10:32:53 -0000	1.26
@@ -237,7 +237,7 @@
  </head>
 <body>
 <h1>HTML5:  Techniques for providing useful text alternatives</h1>
-<h2>Editor's Draft 17th May 2010</h2>
+<h2>Editor's Draft 19th May 2010</h2>
 <h3>Editor:</h3>
 <p><a href="mailto:sfaulkner@paciellogroup.com">Steve Faulkner</a>, The Paciello Group.</p>
 <hr>
@@ -245,6 +245,8 @@
 <p>This document contains author conformance requirements for use of the alt attribute in HTML5 and best practice guidance for authors of HTML documents on providing text   alternatives for images. </p>
 <H3>Status of This document</H3>
 <p>This document is for review by the HTML and Protocols &amp; Formats working   groups and other interested people. <span class="warning">It is subject to change without notice. This document currently has no formal   standing within W3C.</span> The basis of the current content is from sections <A title="4.8.2.1.1" href="http://dev.w3.org/html5/spec/text-level-semantics.html#a-link-or-button-containing-nothing-but-the-image">4.8.2.1.1</A> to <A title="4.8.2.1.11" href="http://dev.w3.org/html5/spec/text-level-semantics.html#an-image-in-an-e-mail-or-private-document-intended-for-a-specific-person-who-is-known-to-be-able-to-view-images">4.8.2.1.11</A> of the HTML5 specification and the <A href="http://www.paciellogroup.com/blog/misc/uc/">text produced</A> for <A href="http://www.w3.org/html/wg/tracker/actions/54">Action 54</A> in the HTML   issue tracker.</p>
+<p>If you wish to make comments regarding this document, please send them to <a href="mailto:public-html-comments@w3.org">public-html-comments@w3.org</a> (<a href="mailto:public-html-comments-request@w3.org?subject=subscribe">subscribe</A>, <a href="http://lists.w3.org/Archives/Public/public-html-comments/">archives</a>)
+or  submit them using <a href="http://www.w3.org/Bugs/Public/enter_bug.cgi?product=HTML%20WG&component=alt%20techniques%20(editor:%20Steven%20Faulkner)">the W3C public bug database</a>. All feedback is welcome.</p>
 <h2>Table of Contents</h2>
 <ul>
   <li><a href="#intro">Introduction</a>
@@ -259,7 +261,7 @@
     <ul>
       <li><a href="#altmethod">The img element alt attribute</a> 
         <ul>
-          <li>Using an empty alt attribute</li>
+          <li><a href="#empty">Using an empty alt attribute</a></li>
           <li>What length should a text alternative be</li>
         </ul>
       </li>
@@ -335,8 +337,21 @@
   <li>If the alt attribute content is too long it may cause reading issues in some assistive technologies.</li>
   <li>Semantic structure cannot be added to alt attribute content.</li>
 </ul>
-<h6>Using an empty <code>alt</code> attribute <code>alt=&quot;&quot;</code></h6>
-<p class="note">To do</p>
+<h6 id="empty">Using an empty <code>alt</code> attribute <code>alt=&quot;&quot;</code></h6>
+<p>Circumstances in which <strong>it is</strong> appropriate to use an empty or null <code>alt</code> attribute:</p>
+<ul>
+  <li>An image is purely <a href="#decorative">decorative</a>.</li>
+  <li>An image is not meant to be <a href="#img-not-for-user">visible to any user</a>.</li>
+  <li>An image consists of text that is repeated as text or a <a href="#icons">graphical symbol</a> whose meaning is conveyed as text, immediately before or after the image.</li>
+  <li>The image is part of a <a href="#imgslices">group of images</a> that  form a single larger picture and one of the other images in the group has a text alternative which serves as the text alternative for the single larger picture.</li>
+  <li>The image is included as the content of a link and there is other content included that clearly describes the link target.</li>
+</ul>
+<p>Circumstances in which <strong>it is not</strong> appropriate to use an empty or null <code>alt</code> attribute:</p>
+<ul>
+  <li>An image is contained within a <code>figure</code> element and has an associated caption provided using the <code>figcaption</code> element.</li>
+  <li>An image is not purely decorative and contains information...</li>
+  <li class="note">to do</li>
+</ul>
 <h6>How long should a short text alternative be?</h6>
 <p>The answer to this question very much depends on the context an image is being used in. While there are no definitive right or wrong lengths for text alternatives provided using the <code>img</code> elements <code>alt</code> attribute, the general consensus is that if the text alternative is longer than  75-100 characters (1 to 2 sentences), it should not be considered a short text alternative and should not be presented using the <code>alt </code>attribute.</p>
 <p><span class="note">To do</span></p>
@@ -604,17 +619,6 @@
   <p><strong>Example code:</strong></p>
   <pre>&lt;p&gt;&lt;img src="figure1.gif" <strong>alt="Figure 1. Distribution of Articles by Journal Category. 
 Pie chart: Language=68%, Education=14% and Science=18%."</strong>&gt;&lt;/p&gt;</pre>
-
-
-  <h5>Advantages:</h5>
-  <ul>
-    <li>Robust support in most browsers and assistive technologies.</li>
-    <li>Text alternative is explicitly associated with the image.</li>
-  </ul>
-  <h5>Disadvantages:</h5>
-  <ul>
-    <li>The text alternative may be useful to all users.</li>
-  </ul>
 </div>
 <h4>Example 4.2</h4>
 <div class="example">
@@ -796,7 +800,7 @@
 <ul>
   <li><A href="http://www.w3.org/TR/2007/WD-WCAG20-TECHS-20071211/H67.html">Using   null alt text and no title attribute on img elements for images that AT should   ignore (HTML)</A> (WCAG technique).</li>
 </ul>
-<h3 id="icons"><span class="secno"> </span>8.  Icons and logos</h3>
+<h3 id="icons">8. Icons and logos</h3>
 <p>An icon is usually a simple picture representing a program, action, data file or a concept. Icons are intended to   help users of visual browsers to recognize features at a glance.</p>
 <p>In some cases, the icon is supplemental to a text label conveying the same   meaning. In those cases, an empty  <A href="#attr-img-alt">alt</A> attribute MUST provided. </p>
 <p>In other cases the icon adds emphasis to text content that needs to be conveyed textually, In such cases a text alternative MUST be provided.</p>
@@ -858,7 +862,7 @@
 <p><span class="note">to do</span></p>
 <h3 id="pictures">9. Images of Pictures</h3>
 <p>Images of pictures or graphics include visual      representations of objects, people, scenes, abstractions, etc.      This <a href="http://www.w3.org/TR/WCAG20/#non-text-contentdef">non-text      content</a> can convey a significant amount of information      visually or provide a <a href="http://www.w3.org/TR/WCAG20/#sensoryexpdef">specific      sensory experience</a> to a sighted person. Examples include photographs, paintings, drawings and artwork.</p>
-<p>An appropriate text alternative for a picture is a brief      description, or <a href="http://www.w3.org/TR/WCAG20/#namedef">name</a>. As in all      text alternative authoring decisions, writing suitable text alternatives      for pictures requires human judgment. The alt text value is      subjective to the context where the image is used and the page      author's writing style. Therefore, there is no single 'right'      or 'correct' piece of alt text for any particular image. In      addition to providing a short <a href="http://www.w3.org/TR/WCAG20/#text-altdef">text      alternative</a> that gives a brief description of the <a href="http://www.w3.org/TR/WCAG20/#non-text-contentdef">non-text      content</a>, also providing <a href="http://www.w3.org/TR/WCAG20/#suppcontentdef">supplemental      content</a> through another means when appropriate may be      useful.</p>
+<p>An appropriate text alternative for a picture is a brief description, or <a href="http://www.w3.org/TR/WCAG20/#namedef">name</a>. As in all text alternative authoring decisions, writing suitable text alternatives for pictures requires human judgment. The text value is subjective to the context where the image is used and the page author's writing style. Therefore, there is no single 'right' or 'correct' piece of alt text for any particular image. In  addition to providing a short <a href="http://www.w3.org/TR/WCAG20/#text-altdef">text alternative</a> that gives a brief description of the <a href="http://www.w3.org/TR/WCAG20/#non-text-contentdef">non-text content</a>, also providing <a href="http://www.w3.org/TR/WCAG20/#suppcontentdef">supplemental content</a> through another means when appropriate may be useful.</p>
 <h4>Example 9.1</h4>
 <p>This example shows an image uploaded to a photo-sharing site. The photo is of a cat,      sitting in the bath. The image has a text alternative provided using the <code>img</code> elements <code>alt</code> attribute. It also has an  caption provided by including the <code>img</code> element in a <code>figure</code> element and using a <code>figcaption</code> element to identify the caption text. The text alternative in  Example code 2 includes information  &quot;photo&quot; about the type of image, although this is not generally recommended, authors MAY include such information in the <code>alt</code> attribute content.</p>
 <div class="example">
@@ -1047,6 +1051,7 @@
 <p>&nbsp;</p>
 <h3 id="unknown">12. When a text alternative is unknown at the time of publication</h3>
 <p>In some cases an image may be included in a published document, but the author is unable to provide an appropriate text alternative. In such cases the minimum conformance requirement is to provide a caption for the image. The caption SHOULD be provided using  either the <code>figcaption</code> element. The use of <code>figcaption</code> is recommended over the use of the <code>alt</code> attribute as the <code>figcaption</code> element is designed as a container for caption text, while the alt attribute is designed as a container for a text alternative. In practice the <code>alt</code> attribute has and will continue to provide a more generic method for providing information about an image until such times that the <code>figcaption</code> element is well supported in browsers and assistive technologies.</p>
+<p class="note">to do</p>
 <H3 id="captcha">13. CAPTCHA Images </H3>
 <p><A title="http://www.w3.org/TR/WCAG20/#atdef" href="http://www.w3.org/TR/WCAG20/#CAPTCHAdef">CAPTCHA</A> stands for   "Completely Automated Public Turing test to tell Computers and Humans Apart".   CAPTCHA images are used for security purposes to confirm that <A title="http://www.w3.org/TR/WCAG20/#contentdef" href="http://www.w3.org/TR/WCAG20/#contentdef">content</A> is being accessed by   a person rather than a computer. This authentication is done through visual   verification of an image. CAPTCHA typically presents an image with characters or   words in it that the user is to re-type. The image is usually distorted and has   some noise applied to it to make the characters difficult to read. </p>
 <p>Provide <A title="http://www.w3.org/TR/WCAG20/#text-altdef" href="http://www.w3.org/TR/WCAG20/#text-altdef">text alternatives</A> that   identify and describe the purpose of the <A title="http://www.w3.org/TR/WCAG20/#non-text-contentdef" href="http://www.w3.org/TR/WCAG20/#non-text-contentdef">non-text content</A>,   and provide alternative forms of the CAPTCHA using output modes for different   types of sensory perception. For instance provide an audio alternative along   with the visual image. Locate the audio option right next to the visual one.   This helps but is still problematic for people without sound cards, the   deaf-blind, and some low hearing people. Another method is to include a form   that asks a question along with the visual image. This helps but is can be   problematic for people with cognitive impairments. </p>
@@ -1067,7 +1072,6 @@
   <LI><A title="http://www.w3.org/TR/WCAG20-TECHS/G143.html" href="http://www.w3.org/TR/WCAG20-TECHS/G143.html">Providing a text alternative   that describes the purpose of the CAPTCHA</A> W3C Note. </LI>
   <LI><A title="http://www.w3.org/TR/2007/WD-WCAG20-TECHS-20071211/G144.html" href="http://www.w3.org/TR/2007/WD-WCAG20-TECHS-20071211/G144.html">Ensuring   that the Web Page contains another CAPTCHA serving the same purpose using a   different modality</A> W3C  Note. </LI>
 </UL>
-<h3>13. Webcam images</h3>
 <p>&nbsp;</p>
 <hr>
 <h2 id="glossary">Glossary</h2>
Received on Wednesday, 19 May 2010 10:32:56 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Wednesday, 19 May 2010 10:32:59 GMT