Categories
Web development

When can I use…

Preview of the 'When can I use' page

A few weeks ago I was trying to find out which browser supported exactly which experimental feature, be it CSS3, HTML5, or something else. I found a couple of useful pages, but nothing quite as detailed as what I was looking for. Since I enjoy graphs, charts, and showing the world how much IE6 really sucks, I went ahead and made what I was looking for.

Thus was born the “When can I use…” page, which shows tables of a variety of current and upcoming web technologies. For all major browsers (Internet Explorer, Firefox, Safari, Opera and Chrome), versions for four different eras (past, present, near and far future).

The page can be customized to show only certain browsers/features/eras, so you have the option to ignore lesser used browsers or for that matter the most used one (it’s a lot of fun to pretend Internet Explorer doesn’t exist). I’ve also included a summary at the bottom of the page, which shows what percentage of the displayed features are supported.

Most features were tested myself, to ensure that the information is accurate. Please let me know if you notice any mistakes. Keep in mind that a “supported” feature may not actually work 100%, as well as the fact that some of the specifications are not set in stone yet, so what may be supported today may not actually work in the future. However, it is likely that in most cases the browser will update its support as the spec changes.

The feature list includes anything I personally feel is of significant use to web designers, but still lacks support in at least one browser version. I am open to adding more features, but only if it’s of significant importance and not just a detailed subset of another feature.

I intend to update the page as new browsers are released, or at the very least once a year. Due to its popularity, the page is updated as soon as new information becomes available.

192 replies on “When can I use…”

Webkit (Safari and Chrome) only has partial support for multiple backgrounds. Try three background images with three different positions.

Ah, see, would have been helpful to know you’re the Fakesmile author. 🙂

I’ve added XHTML+SMIL, but since the status is “W3C Note”, which apparently doesn’t mean much, I’ve put it under “Unofficial / Note”. I may also do the same for XHTML+Voice, which is also only a “Note”. That or change it to just “VoiceXML”, but I think that might be straying too far from regular web design.

By Post Author

Thanks a lot @Alexis.
I just heard you calling for ideas of new technologies you might want to add. First, as the fakesmile author, it’s the very first thing that came to my mind. Second, in my experience, I guess it would be pretty straightforward for implementors to extend svg+smil to the xhtml ns. (Timesheets is a bit trickier though)
(I like css transitions, but not the complicated and incomplete css animations, yuk. but hey i might be biased)
So, I think what xhtml+smil misses the most is advertising 🙂
Though, I have mixed feelings about mentioning fakesmile as it could serve as an excuse for not implementing it natively… :-/

@David

Thanks for info! And FYI, I’m still looking into the XHTML+Voice support as well as XHTML+SMIL. Out of curiosity, are you interested in seeing XHTML+SMIL support for any particular reason?

By Post Author

Ivan, you’re wrong. Gamma information in PNG for me (webdeveloper) is very problematic, because I use pngs in backgrounds, gradients etc.

PNG Support: Internet Explorer up to and including version 7 don’t include gamma information in PNG files. Solution: remove gamma chunk from PNG files (this way you loose great PNG feature).

I’m sorry. I was just throwing specs out of my head. Ok with the criteria.

I’m not sure for XHTML+TIME : it doesn’t quite replace HTML+TIME, as XHTML doesn’t replace HTML. So it’s the only way to animate HTML declaratively for the moment.

About XHTML+SMIL, do JS alternatives count for #3 ? If so, FakeSmile does currently work in Opera, Safari and Firefox. I mean to the question “can i use XHTML+SMIL?” the answer is “yes if you include a JS hack”.
For #1, ask Jeff Schiller what he thinks.
For #2, well… mentioning the spec on your page will give it more visibility 🙂

thanks !

@David – Thanks for the suggestions! I think I need to make a FAQ or something. 🙂

For now I’d like to only include items that meet the following criteria:

  1. Useful to web designers for web sites
  2. Likely to be eventually implemented by the majority of browsers
  3. Currently implemented by at least one browser
  • VML: Was replaced by the W3C with SVG, really don’t see it passing #2
  • HTML+TIME: Was replaced by the W3C with XHTML+SMIL, so no #2
  • XHTML+SMIL: No implementation at all yet, from what I can tell. So no #3. Admittedly not sure of #1 or #2 either.
  • XHTML+Voice: Hm…yeah, okay. Good one!
  • Widgets: Not really a web design feature, so I’m not sure about #1. But maybe.

Note that I’m open to re-evaluating those criteria. I don’t want to anti-Microsoft, but also I don’t want “never” to be the answer to question to “When can I use”. And if it becomes evident that no other browser is interested in adopting Webkit’s proposals, I’ll remove them too.

By Post Author

Alexis,

How about VML, HTML+TIME, XHTML+SMIL, XHTML+Voice, Widgets ? (sorry, heard you tweet about other potential technologies to include)

Can you provide info about each alternatives ?

thanks

Sorry for the late responses everybody…

@Dan – Thanks, I guess I could add links to some of the tables on that page, assuming that’s what you mean.

@radex – Thanks!

@Jaakko – I certainly see what you mean, but don’t think changing the opacity of a PNG happens enough to say there’s only partial support. I would say that’s more of an issue with the MS filter property.

@David – Good question. I believe it was intentional when I decided to do that, since I felt the summary should really only take into account the browser’s actual capabilities.

By Post Author

Is it intentional that the alternatives (at least js) don’t have an influence on the Summary results ?
If so, why ?

PNG alpha transparency for present IE (7.0) is marked as supported. This is not true. Try to change the opacity (using filter: alpha) for element containing transparent PNG (32-bit) and see what happens: transparent pixels becames black. IMO IE7 only *partially* supports PNG alpha transparency.

Comments are closed.