- From: Steven Faulkners via cvs-syncmail <cvsmail@w3.org>
- Date: Wed, 09 Jun 2010 15:10:55 +0000
- To: public-html-commits@w3.org
Update of /sources/public/html5/alt-techniques In directory hutz:/tmp/cvs-serv3999 Modified Files: Overview.html Log Message: fix for publication Index: Overview.html =================================================================== RCS file: /sources/public/html5/alt-techniques/Overview.html,v retrieving revision 1.35 retrieving revision 1.36 diff -u -d -r1.35 -r1.36 --- Overview.html 9 Jun 2010 15:04:15 -0000 1.35 +++ Overview.html 9 Jun 2010 15:10:53 -0000 1.36 @@ -126,7 +126,7 @@ </head> <body> <div class="head"><p><a href="http://www.w3.org/"><img width="72" height="48" src="http://www.w3.org/Icons/w3c_home" alt="W3C"></a></p><h1 class="title" id="title">HTML5: Techniques for providing useful text alternatives</h1> -<h2 id="w3c-working-draft-05-may-2010"><acronym title="World Wide Web Consortium">W3C</acronym> First Public Working Draft 10 June 2010</h2> +<h2 id="w3c-working-draft-05-may-2010"><acronym title="World Wide Web Consortium">W3C</acronym> Working Draft 10 June 2010</h2> <dl><dt>This version:</dt><dd><a href="http://www.w3.org/TR/2010/WD-alt-techniques-20100610/">http://www.w3.org/TR/2010/WD-alt-techniques-20100610/</a></dd><dt>Latest published version:</dt> <dd><A href="http://www.w3.org/TR/alt-techniques/">http://www.w3.org/TR/alt-techniques/</A> </dd><dt>Latest editor's draft:</dt><dd><a href="http://dev.w3.org/html5/alt-techniques/">http://dev.w3.org/html5/alt-techniques/</a></dd> <dt>Editor: </dt> @@ -436,7 +436,7 @@ is burned out. If it is, replace the bulb. If it still does not work; buy a new lamp.</p> </div></pre> </div> -<h4 id="hae">Example 2.3</h4> +<h4 id="haee">Example 2.3</h4> <div class="example"> <p>Here's another example of the same <a href="#flowchart">flowchart</a> image, showing a short text alternative included in the alt attribute and a longer text alternative in text, programmatically associated using the <a href="http://www.w3.org/TR/wai-aria/states_and_properties#aria-describedby">aria-describedby</a> attribute:</p> <p><strong>Example Code:</strong><br> @@ -821,7 +821,7 @@ </ul> <h3 id="webcam">10. Webcam images</h3> <p>Webcam images are static images that are automatically updated periodically. Typically the images are from a fixed viewpoint, the images may update on the page automatically as each new image is uploaded from the camera or the user may be required to refresh the page to view an updated image. Examples include traffic and weather cameras.</p> -<h4 id="hbg">Example 10.1</h4> +<h4 id="hbgg">Example 10.1</h4> <p>This example is fairly typical; the title and a time stamp are included in the image, automatically generated by the webcam software. It would be better if the text information was not included in the image, but as it is part of the image, it is required that it is provided as a text alternative. A caption is also provided using the <code>figure</code> and <code>figcaption</code> elements. As the image is provided to give a visual indication of the current weather near Sopwith House, a link to a local weather forecast is provided, as with automatically generated and uploaded webcam images it may be impractical to provide such information as a text alternative. </p> <p>The text of the alt attribute includes a prose version of the timestamp, designed to make the text more understandable when announced by text to speech software. The text alternative also includes a description of some aspects of what can be seen in the image which are unchanging, although weather conditions and time of day change. </p> <p><strong>Note: </strong></p> @@ -933,7 +933,7 @@ <h3 id="imgslices">11. A group of images that form a single larger picture with and without links</h3> <p>When a picture has been sliced into smaller image files that are then displayed together to form the complete picture again, one of the images MUST have its alt attribute set as per the relevant rules that would be appropriate for the picture as a whole, and then all the remaining images MUST have an empty alt attribute.</p> -<h4 id="hbi">Example 11.1</h4> +<h4 id="hbii">Example 11.1</h4> <div class="example"> <p>In this example, a picture representing a company logo for the <SPAN title="">PIP Corporation</SPAN> has been split into two pieces, the first containing the letters "PIP" and the second with the word "CO". The alternative text ("PIP CO") is all in the first image.</p> <p><strong>Example Image:</strong></p> @@ -999,17 +999,14 @@ <p>Finally, we have an opinion piece talking about a logo, and the logo is therefore described in detail in the alternative text.</p> <PRE><p>Consider for a moment their logo:</p> <STRONG><p><img src="/images/logo" alt="It consists of a green circle with a green question mark centered inside it."></p></STRONG> <p>How unoriginal can you get? I mean, oooooh, a question mark, how <em>revolutionary</em>, how utterly <em>ground-breaking</em>, I'm sure everyone will rush to adopt those specifications now! They could at least have tried for some sort of, I don't know, sequence of rounded squares with varying shades of green and bold white outlines, at least that would look good on the cover of a blue book.</p></PRE> <p>This example shows how the alternative text should be written such that if the image isn't <em title="img-available"><A href="#img-available">available</A></em>, and the text is used instead, the text flows seamlessly into the surrounding text, as if the image had never been there in the first place.</p> -</DIV> --> +</DIV> -<!-- <H4 id="hbn">Example 14.1</H4> +<H4 id="hbn">Example 14.1</H4> <p>This example shows a <a href="http://recaptcha.net/learnmore.html">CAPTCHA test</a> which uses a distorted image of text. The text alternative in the alt attribute provides instructions for a user in the case where she cannot access the image content. </p> <div class="example"> <p><strong>Example Image:</strong></p> <p><img src="images/captcha.gif" alt="captcha containing the words 'aides' and 'sprucest'. The letters are distorted and the color of the letters and background is partially inverted," width="270" height="60"></p> <p><strong>Example code:</strong> </p> - <PRE><img src="captcha.png" <strong>alt="An audio challenge follows if you cannot view this image."</strong>> -<!-- audio CAPTCHA option that allows the user to listen and type the word --> -<!-- form that asks a question --></PRE> </div> <H4 id="hbo">Further Techniques</H4> <UL>
Received on Wednesday, 9 June 2010 15:11:01 UTC