Image-dislay status media query for reducing reflows -was Re: FAQ about reasons behind CSS

On Thu, 30 Jun 2005 13:38:21 +0300, Laurens Holst  
<lholst@students.cs.uu.nl> wrote:

> Emrah BASKAYA schreef:
> ..

> Just a bold statement: I’d say that there are more images with specified  
> dimensions around, than that there are images with alt attributes :).

Yes, and that's when dimensions are not obligatory, and alt is (at least  
for XHTML)!

That is why user agents must be *told to* disable embedded image sizes  or  
adapt to alt property text size as a rule when the user turns off images,  
as in small images, alt tag is no longer readable, and that is probably  
why those forums do not give embedded size info, to make sure buttons are  
readable when images are turned off on user side. I think the html specs  
must make it obligatory for UA's to expand the image size to the Alt tag,  
if the embedded image size is smaller than the alt tag -and- images are  
turned off on user side. (This is a bit different from images not being  
able to be loaded, when the images are turned on, the UA should use images  
embedded size whether it can load it or not) I guess this is an issue with  
the html spec indeed but may be fixed by a CSS property? Here is my shot  
at it: (example)

@media screen and (image-display: off) {
img { width: <element-width> | auto | embedded; height: <element-width> |  
auto | embedded;}
}

Auto would mean the image size will be shaped around its alt tag, embedded  
means it would still keep its size even if the user has turned images off.

I think this would be a very nice 'fix' for such sites that don't want to  
declare image sizes simply for the sake of being accessible. And the style  
don't even have to be on the server side, I would even use this in my  
userCSS style! This way, the pages would be accessible, yet they would  
perform fast. Similar suggestions might have been brought up, but what do  
you think of this? If you like the idea, we can come up with a more  
eloborate proposal.

Having this feature at hand, more people would choose to declare the image  
size than not.

This feature would let us serve a style very differently according to  
where the images are turned on or off, for each element. There is no  
reason why whe shouldn't assume images being turned on or off is not a  
media-feature, and that media feature can be switched on the fly by the  
user-agent, before loading the document, or after it has loaded.

The UA knows it is a projection, and the UA knows if has images turned -  
off or not.

> ..
>> Reality:
>> 1-) There's almost always a reflow, and there will be, in a www where   
>> there are images. We'll just get used to it.
>
> Yes, but: there is a reflow on every content image, not every image.  
> There usually aren’t that much content images, and you can . If you go  
> to my website for example, http://www.grauw.nl/, I think on most pages  
> there won’t be a single content image except for the navigation one. And  
> if there is one, it either has dimensions specified, or causes a reflow.

Having content images without embedded size is not feasible indeed, and  
the authors know this will be a performance hit. This is an issue we leave  
entirely in the hands of the page's author, it is his problem to use or  
abuse his freedom not to give embedded sizes. What that means to me is  
that, we can have CSS properties that cuase performance hits, but at least  
the author could choose to implement it or not. People would choose web  
sites that load and perform better, much like today.

>
> And, as said, all the images loaded by the CSS don’t cause reflows.
>
> One single reflow is a big contrast to a reflow for each time some  
> additional data is loaded on the webpage (which would e.g. be the case  
> with grid and other layout methods).

Grids will be nice indeed, if they are implemented. I am happy to hear  
they are working on it. That will really settle a lot of issues.

>
> ~Grauw
>



-- 
Emrah BASKAYA
www.hesido.com

Received on Thursday, 30 June 2005 11:42:59 UTC