At 1:05 PM -0500 9/25/10, Keith Purtell wrote:
Hope this doesn't veer off topic...
I'm experimenting with making my site more accessible for
vision-impaired people by using ems in my CSS style sheet for image
sizes as described at http://sperling.com/examples/zoom/
The problem is calculating the ems. I have to open the image in
Photoshop, use Image Size to figure what the height and width pixels
would be at a slightly smaller size, then go to an online site that lets
me convert pixels to ems. What a hassle. Shorter path?
- Keith Purtell
Keith:
Normally you can divide pixels by 16 to arrive at the em needed for images.
However, the point I was making in the link you provided above
(thanks for reading) was that you can provide the viewer with an
image that is larger than necessary. That way people with lower
vision can "zoom" the page and the graphics will not degrade as fast
as if they were zooming standard sized images.
In the example I provide, if you will note, I simply doubled the 16
figure to 32. In other words, I divided the pixels of the images by
32 to arrive at the ems needed to show the picture.
For example, the girl image is 391 pixels wide and my css provides
that image to the user at 12.21875em (i.e., 391/32). So, when a low
vision user views the page at one zoom level above standard, the
image is not as degraded as it would have been at a lower ratio .
Now, some will argue that the page loads slower (and they will be
right), but I argue that doesn't mean as much as it did and that is
becoming less of a problem as time goes by. IMO, making images
accessible for low vision users is worth the expense of "slower" load
times.
Thanks for viewing.
Cheers,
tedd
--
-------
http://sperling.com/
______________________________________________________________________
css-discuss [[email protected]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
