Re: icons for pages/sites/etc. (was Re: src attribute of IFRAME and FRAME)

See below.  -Tantek

...

From: Zoltan Hawryluk <zhawryluk@corp.attcanada.ca>
Subject: RE: icons for pages/sites/etc. (was Re: src attribute of IFRAME  
and   FRAME)
Date: Fri, Dec 7, 2001, 7:03 AM

> All this talk about images in web pages reminds me of how the <img> tag has
> always been restrictive ... in terms of that if the user agent is a non
> graphical device, all that would be shown would be the contents of the "alt"
> attribute.  This is OK most of the time, but it would be great to show, say,
> formatted ASCII Art or any other alternate HTML for the image.
>
> For example, let's say I wanted to show a logo for a company on a web page
> for all devices.  I could use:
>
> <style type="text/css">
> <!--
>  #companylogo {
>   image-url(spaceinvaders.png);
>   image-alternate-visibility: hidden-if-image-displayed; 
>    /* probably values for this would be more elegant
> that this :-) */
>   image-description: "Welcome to the Space Invaders Home
> Page";
>   width: 600;
>   height: 100;
>   border: none;
>  }
> -->
> </style>
> .
> .
> .
> <body>
>
> <div id="companylogo">
> <pre>
>  ##          ##
>         ##      ##
>       ##############
>     ####  ######  ####     Welcome to the Space Invaders Home Page
>   ######################
>   ##  ##############  ##
>   ##  ##          ##  ##
>         ####  ####
> </pre>
> </div>
>
> ....
>
>
> So ... for non-graphical user agents would show the formatted HTML alternate
> text, which would be awesome for some applications (i.e. ASCII art of graphs
> for those graphically challenged).

This actually does not require any CSS.

In fact, you can specify image content with rich fallbacks today, with
simple HTML4 simply by not using the limited <img> tag:


<object id="companylogo" type="image/png" data="spaceinvaders.png">
<pre class="asciiart">
 ##          ##
         ##      ##
       ##############
     ####  ######  ####     Welcome to the Space Invaders Home Page
   ######################
   ##  ##############  ##
   ##  ##          ##  ##
         ####  ####
</pre>
</object>


Non-graphical user agents (or user agents that don't support "image/png")
display the contents of the object instead of the object itself.

> If the user agent is an audio browser
> (e.g. for the blind) then it would read the contents of the
> image-description rule.

This effect could be achieved with current CSS syntax (albeit a slight
extension to the functionality which is in CSS2 - which is already
documented in CSS3 drafts):

@media aural {
 #companylogo {
   content: "Welcome to the Space Invaders Home Page";
 }
}

Tantek

Received on Friday, 7 December 2001 12:26:58 UTC