alternates-brainstorming

(Difference between revisions)

Jump to: navigation, search
(Brainstorms)
m (Strawman 6 (lists + explicit alternator + using existing HTML idiom) - fix double spaces)
Line 154: Line 154:
<ol class="alternates">
<ol class="alternates">
  <li><a href="example.mp3" rel="enclosure alternate" type="audio/mpeg">MP3 alternative</a></li>
  <li><a href="example.mp3" rel="enclosure alternate" type="audio/mpeg">MP3 alternative</a></li>
-
  <li><a href="example.wav" rel="enclosure alternate"  type="audio/wav">WAV alternative</a></li>
+
  <li><a href="example.wav" rel="enclosure alternate"  type="audio/wav">WAV alternative</a></li>
  <li><a href="example.mov" rel="enclosure alternate"  type="video/quicktime">MOV alternative</a></li>
  <li><a href="example.mov" rel="enclosure alternate"  type="video/quicktime">MOV alternative</a></li>
</ol>  
</ol>  
Line 164: Line 164:
<ul class="alternates">
<ul class="alternates">
  <li><a href="enexample.mp3" rel="enclosure alternate" type="audio/mpeg" hreflang="en">In English</a></li>
  <li><a href="enexample.mp3" rel="enclosure alternate" type="audio/mpeg" hreflang="en">In English</a></li>
-
  <li><a href="esexample.mp3" rel="enclosure alternate" type="audio/mpeg" hreflang="es">En Espagnol</a></li>
+
  <li><a href="esexample.mp3" rel="enclosure alternate" type="audio/mpeg" hreflang="es">En Espagnol</a></li>
-
  <li><a href="deexample.mp3" rel="enclosure alternate" type="audio/mpeg" hreflang="de">Auf Deutsch</a></li>
+
  <li><a href="deexample.mp3" rel="enclosure alternate" type="audio/mpeg" hreflang="de">Auf Deutsch</a></li>
  </ul>  
  </ul>  
</nowiki></pre>
</nowiki></pre>

Revision as of 14:51, 14 June 2006

Contents

Introduction

This page is to talk about alternates, that is, places where a user may be given several different items to choose amongst that at some logical level are considered equivalent.

Discussion Participants

Editor

Authors

Interested Folks

Brainstorms

Strawman 1

<fieldset>
 <a href="example.mp3" type="audio/mpeg">MP3 alternative</a>
 <a href="example.wav" type="audio/wav">WAV alternative</a>
 <a href="example.mov" type="video/quicktime">MOV alternative</a>
</fieldset> 

XHTML Sample

Discussion

Strawman 2

   <select id="entryN">
     <option value="example.mp3">MP3 alternative</option>
     <option value="example.mov">WAV alternative</option>
     <option value="example.wav">MOV alternative</option>
   </select> 

XHTML Sample

Discussion

Strawman 3

<div class="altgroup">
 <a class="alternate" href="example.mp3" type="audio/mpeg">MP3 alternative</a>
 <a class="alternate" href="example.wav" type="audio/wav">WAV alternative</a>
 <a class="alternate" href="example.mov" type="video/quicktime">MOV alternative</a>
</div> 

Discussion

Strawman 4 (lists)

An example of a list that expresses no preference.

<ul class="altgroup">
 <li><a href="example.mp3" type="audio/mpeg">MP3 alternative</a></li>
 <li><a href="example.wav" type="audio/wav">WAV alternative</a></li>
 <li><a href="example.mov" type="video/quicktime">MOV alternative</a></li>
</ul> 

An example of a list that expresses a preference (i.e. first is best, last is worst)

<ol class="altgroup">
 <li><a href="example.mp3" type="audio/mpeg">MP3 alternative</a></li>
 <li><a href="example.wav" type="audio/wav">WAV alternative</a></li>
 <li><a href="example.mov" type="video/quicktime">MOV alternative</a></li>
</ol> 

Discussion

Strawman 5 (lists + explicit alternator)

This varies #4, explicitly stating what is being alternated. Let's say we're trying to express "location". If there was no alternates, we'd just say:

<a href="example.mp3" class="location">MP3</a>

Now, let's say that we have multiple choices. Here's what I think it should look like:

<ol class="location alternates">
  <li>
    <a href="example.mp3" class="location">MP3</a>
    <br />
    I ripped this one using <a href="...">iTunes</a>
  </li>
  <li>
    <a href="example.wma" class="location">WMA</a>
    <br />
    I ripped this one using <a href="...">Windows Media</a>
  </li>
</ol> 

Discussion

David Janes:

Lucas Gonze:

David Janes:

<ol class="vcard alternates">
  <li><div class="vcard">vcard 1</li>
  <li><div class="vcard">vcard 2</li>
</ol>

Strawman 6 (lists + explicit alternator + using existing HTML idiom)

The idiom seems to apply to media files a lot, so bringing in rel=enclosure makes sense here. At the HTML level rel="alternate" is used for stating alternatives (normally on a <link>, but <link> and <a> have the same semantic), and type is applied to the links as a MIME type.

http://www.w3.org/TR/html4/struct/links.html#h-12.3

If you are listing alternatives, use a list

So for your examples, a possible model would be

<ol class="alternates">
 <li><a href="example.mp3" rel="enclosure alternate" type="audio/mpeg">MP3 alternative</a></li>
 <li><a href="example.wav" rel="enclosure alternate"  type="audio/wav">WAV alternative</a></li>
 <li><a href="example.mov" rel="enclosure alternate"  type="video/quicktime">MOV alternative</a></li>
</ol> 

Following the links syntax, language alternatives can be expressed too:

<ul class="alternates">
 <li><a href="enexample.mp3" rel="enclosure alternate" type="audio/mpeg" hreflang="en">In English</a></li>
 <li><a href="esexample.mp3" rel="enclosure alternate" type="audio/mpeg" hreflang="es">En Espagnol</a></li>
 <li><a href="deexample.mp3" rel="enclosure alternate" type="audio/mpeg" hreflang="de">Auf Deutsch</a></li>
 </ul> 

Discussion

Kevin Marks: I think this retains what you have, and brings it back in line with existing HTML practices. I have a stylistic nitpick about 'alternates' rather than 'alternatives' but as HTML has already gone the other way on that I can concede it. Is class="alternates" distinct enough to prevent false positives in looking for this structure?

See Also

alternates-brainstorming was last modified: Wednesday, December 31st, 1969

Views