html5/spec Overview.html,1.1170,1.1171

Update of /sources/public/html5/spec
In directory hutz:/tmp/cvs-serv19129

Modified Files:
	Overview.html 
Log Message:
More slicing examples. (whatwg r1979)

Index: Overview.html
===================================================================
RCS file: /sources/public/html5/spec/Overview.html,v
retrieving revision 1.1170
retrieving revision 1.1171
diff -u -d -r1.1170 -r1.1171
--- Overview.html	4 Aug 2008 09:49:17 -0000	1.1170
+++ Overview.html	4 Aug 2008 10:04:40 -0000	1.1171
@@ -16372,17 +16372,40 @@
     containing the letters "XYZ" and the second with the word "Corp". The
     alternative text ("XYZ Corp") is all in the first image.</p>
 
-   <pre>&lt;h1>&lt;img src="logo1.png" alt="XYZ Corp">&lt;img src="logo2.png" alt="">&lt;/h1></pre>
+   <pre>&lt;h1><strong>&lt;img src="logo1.png" alt="XYZ Corp">&lt;img src="logo2.png" alt=""></strong>&lt;/h1></pre>
+  </div>
+
+  <div class=example>
+   <p>In the following example, a rating is shown as three filled stars and
+    two empty stars. While the alternative text could have been
+    "&#x2605;&#x2605;&#x2605;&#x2606;&#x2606;", the author has instead
+    decided to more helpfully give the rating in the form "3/5". That is the
+    alternative text of the first image, and the rest have blank alternative
+    text.</p>
+
+   <pre>&lt;p>Rating: <strong>&lt;img src="1" alt="3/5">&lt;img src="1" alt="">&lt;img src="1" alt=""
+>&lt;img src="0" alt="">&lt;img src="0" alt=""></strong>&lt;/p></pre>
   </div>
 
   <p>If any of the components of the sliced picture are the sole contents of
    links, then instead one image per link must have alternative text
    representing the purpose of the link.
 
-  <p>Generally, authors should avoid slicing images in this way, as it can
-   lead to unexpected renderings (e.g. if the line wraps in an unexpected
-   way, the image would get broken up). In the case of links, <a
-   href="#image2" title="image map">image maps</a> should be used instead.
+  <div class=example>
+   <p>In the following example, a picture representing the flying spaghetti
+    monster emblem, with each of the left noodly appendages and the right
+    noodly appendages in different images, so that the user can pick the left
+    side or the right side in an adventure.</p>
+
+   <pre>&lt;h1>The Church&lt;/h1>
+&lt;p>You come across a flying spaghetti monster. Which side of His
+Noodliness do you wish to reach out for?&lt;/p>
+<strong>&lt;p>&lt;a href="?go=left" >&lt;img src="fsm-left.png"  alt="Left side. ">&lt;/a
+  >&lt;a href="?go=right">&lt;img src="fsm-right.png" alt="Right side.">&lt;/a>&lt;/p></strong></pre>
+  </div>
+
+  <p>Generally, <a href="#image2" title="image map">image maps</a> should be
+   used instead of slicing an image for links.
 
   <h6 id=a-key><span class=secno>4.7.2.1.8. </span>A key part of the content</h6>

Received on Monday, 4 August 2008 10:05:16 UTC