[whatwg] Built-in image sprite support in HTML5

Silvia Pfeiffer silviapfeiffer1 at gmail.com
Fri May 21 17:07:12 PDT 2010

On Sat, May 22, 2010 at 3:23 AM, Tab Atkins Jr. <jackalmage at gmail.com> wrote:
> On Fri, May 21, 2010 at 10:12 AM, David Weitzman <dweitzman at gmail.com> wrote:
>> There are various approaches to using image sprites with HTML and CSS,
>> but at the end of the day they are all essentially hacks. A solution
>> that would be simpler than any existing approach would be to introduce
>> new attributes for <img> to specify x and y offsets and clipping on
>> images. With that you would get simpler markup for sprites and better
>> accessibility.
>> One downside of this approach is that with background image sprites
>> you can have a CSS class that abstracts away the name of the sprite
>> image. With <img> tags you would have to specify the URL and
>> height/width individually on every sprited image.
> Agreed on all points about the current spriting solutions being hacks.
> This problem is already being addressed on multiple fronts, though
> they are all still somewhat theoretical at the moment.
> The Media Fragments WG has a draft spec out for, well, Media
> Fragments, which let you specify which section of an image you want
> right in the url.  The browser should then automatically cut it out
> and serve just the sprite you want.

Yes, I was going to suggest that spec, too, see

However, what exactly happens with a media fragment URI like
http://example.com/picture.png#xywh=160,120,320,240 is not fully
specified in the Media Fragment URI spec.
One thought was to just highlight the area that is specified - similar
to a lightbox - where the other areas in the image/video are darkened.
That follows the idea of fragments being a focus region.
Another thought is to zoom into that area and decode, but not display
the others.

It is indeed something that the HTML5 spec when it adopts media
fragments will have to specify/recommend to browsers how to implement.
The media fragment WG has this far starte putting together
recommendations for display at
- it would be good to have this discussion here and feed back any
suggested changes/improvements.


More information about the whatwg mailing list