[whatwg] Alt text authoring Re: Conformance for Mail clients

Sat Apr 21 11:30:43 PDT 2007

On 4/19/07, Kornel Lesinski <kornel at osiolki.net> wrote:
>
> On Thu, 19 Apr 2007 21:07:09 +0100, timeless <timeless at gmail.com> wrote:
>
> > As such, encouraging people to include alt tags means the difference
> > between me knowing that there's an image I care to look at and not.
>
> If e-mail client automatically inserted [image was here] in the text part
> of e-mail, you would know that there were images, even without user
> providing better alternative text.
>
>
> I support opinion that it doesn't make sense to _require_ e-mail clients
> to bug users about alternative text. On the web rationale for alt text is
> that you can never know who will read your page. In case of personal
> e-mail you do know.
> Pictures sent in personal e-mails almost never have function other than
> the picture itself - alt text for vacation photos, to be really an
> alternative, would have to be an essay.
>
> --
> regards, Kornel Lesiński
>

I've been following this and gathering thoughts.

(Still) Images are used on the web (and in email) in 4 ways:
1.  Images that represent text.
<p>Alt text for this image is <img alt="obvious" src="obvious.jpg">.</p>
<p>It's been a good day! <img alt=":-)" src="smile.jpg">.</p>

2. Images that are content but don't represent text (though they may be
accompanied by a caption - even if the caption could be the alt text, it
would be redundant with the caption repeated in the markup)
<p>These are my vacation photos:
<ul><li><img src="grandcanyon.jpg">My wife and I at the Grand Canyon...</ul>

3. Images that are purely decorative, not content, and don't represent text
<p><img src="plant.jpg" style="float: right">Potted plants are nice and love
water...

4. Images that are purely background images - they're size isn't necessarily
integral to layout, and the image may be repeated in the background -
there's no ambiguity to this.
<div style="background: url(tiles)"><p>Lorem ipsum...</div>

It's obvious that the <img> tag should be used for (1) and obvious that CSS
background images should be used for (4).  (2) and (3) are the controversial
examples.

For (2), authors have a few choices:
(a) Use the <img> tag and leave the alternate text blank.  This is good
because a graphical UA with no CSS would display the image, which is
important to the content.  This is bad because UAs can't tell the difference
between (1) and (2).  For example, Lynx would replace (1) with its alternate
text but wouldn't have to provide a way to download the image.  Lynx MUST
provide a way for the user to download (2) because it's part of the
content.  Lynx needs to know the difference between (1) and (2) so it can
let the user know which images are worth downloading and which images aren't
(because downloading smile.jpg or obvious.jpg would be useless to the
user).  Requiring the alt attribute causes a problem here and simply leaving
the attribute's value blank doesn't clear up enough ambiguity.  (Some
WYSIWYG editors will put the image's filename in the alt attribute by
default causing even more ambiguity.)

(b) Use a <div> or <span> styled with width and height and a background
image.  This isn't helpful to browsers that don't understand CSS and text
browsers can't give the user a link to something to download.

(c) Use the <object> tag with fallback content.  This is probably the most
useful option doesn't naturally cause any problems.  The only real issue is
that neither HTML4 nor HTML5 explicitly describe (1) and (2), and say to use
<img> for (1) and object for (2)

Some browsers have issues with the <object> tag and don't fall back
appropriately.  Also, <object> may not be semantically specific enough.  No
current WYSIWYG editors will use <object> by default for images or give
users the option to choose with <img alt="something"> is appropriate and
when <object> is appropriate.  Since this is the case, a better solution
might be to specify that the "alt" attribute is optional.  When the alt
attribute is present, the image represents text.  Non-graphical UAs* can
replace the <img> with the text of the alt attribute silenty (or at least
quietly).  When the alt attribute is missing, the image is part of the
content and non-graphical UAs should indicate that the image is missing and
offer a method to download it.

*Non-graphical UAs can include graphical UAs where the user has disabled
graphics.

For (3) authors have a few choices:
(a) Use the <img> tag with a blank or missing alt attribute.  This causes a
conflict with (1) and (2).  This image doesn't represent text so the UA
shouldn't replace it with text.  The image isn't part of the content, so
Lynx shouldn't offer a link to download the image, because it's not useful
to the user.

(b) Use a <div> or <span> with CSS height, width, and background
properties.  This isn't always good for a couple reasons.  The author may
not know the dimensions of the image (e.g. the image's src is a PHP script
that chooses randomly from a set of differently sized images).  Also, this
doesn't provide a way to scale the image.

(c) Use a <div> or <span> with the CSS3
content<http://www.w3.org/TR/css3-content/#inserting3>property.  (In
CSS2, content only applies to :before and :after).  This is
the best solution as the image can be allowed to scale if its scalable,
doesn't conflict with (1) and (2).  However, browsers don't support this
well (if at all), and that's a W3C Working Draft that hasn't been touched in
3 years.  (I'm just a peon developer, so I don't know anything about that
WG.)  Current browsers be damned, this is what HTML5 should specify
(explicitly, so there's no confusion between this and (1) and (2)).  Without
damning current browsers, something would have to be specified that's
distinguishable from (1) and (2).

to summarize:
For (2), I recommend making the alt attribute optional.

Alternatively, HTML5 could specifiy that (2) should have an alt attribute
that is blank, but I think this leaves too much ambiguity.  (What if there's
an image that represents text, is also accompanied by that exact same text,
making the alt attribute redundant.  Leaving alt blank helps here.)

For (3), I recommend that HTML5 say something about the CSS3 content
property so there's no question that (3) is different from (1) and (2).  If
compatibility with today's browsers is more important, then I don't have a
quick answer (maybe rel="decoration"?)

Hope this sums up the issue well for the sake of discussion.

-- 
Jon Barnett
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.whatwg.org/pipermail/whatwg-whatwg.org/attachments/20070421/f86152fa/attachment.htm>