Categories
Web development

Big “When Can I Use” update!

UPDATE: The Android 2.2 browser has now also been included.

I’m happy to announce a number of new changes to caniuse.com, providing all sorts of new information for your feature support needs:

Mobile browser information

Preview of mobile browser columnsThe most popular WCIU request has been to add tables for support for mobile web browsers. This is now available together with the desktop browsers, including for now: iOS (iPhone/iPad/iPod touch) browsers, Opera Mini, Opera Mobile and the Android browser. These are known to be the most popular mobile browsers, so I thought I’d start with them. You can view each type as a set by using the URL caniuse.com/#agents=desktop or caniuse.com/#agents=mobile. In the future more mobile browsers are likely to be added, with the grade A browsers on this chart having priority.

Browser usage statistics

Preview of global usage statisticsIf you’d like to know just what percentage of users can use a given feature, you can now get a rough idea from the “Global user stats” displayed in the upper-right hand corner of a feature. Of course your audience may be very different, so this should just be used as a guide. Mobile browser statistics are not currently included, but hopefully I can find some way to include them in the future.

Single feature pages

Each feature has its own non-hash URL now, (i.e. caniuse.com/webworkers) which is useful when sharing a feature table with others or looking up a feature quickly. These pages are designed to load quickly, with a link back to their interactive versions.

Search from address field

This previously existing feature has now been improved: Type in your query directly after http://caniuse.com/ and you will be directed either to the related feature page or (if multiple results are found) to the search results page. For example, caniuse.com/corner will redirect you to the caniuse.com/border-radius page.

Feature index

Preview of feature indexA full overview of all features mentioned on WCIU listed by category is now available by clicking on the big “Index” tab. The same overview is available on each single feature page too.

Feedback buttons

Each feature now includes a “Feedback” button, which you can use to quickly send me a correction/link suggestion, etc.

More browser features

Five new features have been added:

Also, thanks to the site’s restructuring, I plan on adding many more features in the future.

Bug fixes and minor improvements

I have fixed a number of bugs related to the working of the option checkboxes and URL hash, so things should work more as you’d expect them to. A number of links/notes/descriptions have also been updated. I’ve also added a “Three versions back” era (hidden by default) in case you need to go back even further in time.

So that’s it! The remaining request I’ve had is for a public API, which is something I’m still looking into but should be in my next big update.

Enjoy the new features, and let me know if you run into any bugs or mistakes.

Categories
Web development

border-radius for all!

Screenshot of rounded corner generator

One of CSS3’s most popular features is border-radius. The ease of just being able to specify your rounded corners in CSS is very appealing compared to using JavaScript or a bunch of bloated HTML to accomplish a simple effect. So here I will describe a CSS-only method we can use today that works in all four major browsers. Sadly, this does not include Internet Explorer, so I will include an alternative solution for it too.

Categories
Opera blog post Web development

SVG Image and Background Image Replacer

It’s here! A working version of the SVG image replacement script.

Purpose

This script substitutes specified images and background images with SVG images for web browsers that support them. This makes it perfect for anyone who would like to start using SVG for their site design, but wants to make sure it will look okay for browsers that do not yet support it.

Features

  • Future-proof – Checks for actual support, no browser sniffing
  • Unobtrusive – Only affects browsers with support, uses fallback content without support or if javascript is disabled
  • Simple to use – Just include one javascript file to your pages and use the appropriate image names
  • Small file – Only 1.8 KB!
Categories
Opera blog post Web development

Web Standards, the real Flash killer

There’s changes in the wind in the world of visual web technologies, and they show a beautiful future for what might soon (and to some degree now) be possible with the use of web standards.

Specifically, I’m talking about web alternatives to that ever popular Adobe Flash plug-in. Note that I won’t be talking about Microsoft’s Silverlight here, since it has many of the same shortcomings as Flash does.

There seem to be three major ways Flash is being used today: For online videos, as a web page interface, and for web-based games. Upcoming standards being developed and implemented for each of these uses.