Dev Depot: Can I Use...

Stephen Yagielowicz

Today’s web developers face a growing range of platform types and variants, causing problems for high-end designers. Here’s some guidance and a tool to help target your desired devices.

Modern web development requires compatibility across an increasing variety of display devices, with designers seeking to balance universal accessibility with the need to stand apart from today’s competitive crowd, by employing all the latest technologies and gee-whiz visual effects.

Given the capabilities of high-end Internet access platforms, it can be tempting to go “just a little bit further” with design in order to grab a little extra sparkle.

Sometimes this balancing act fails, however, and in the process destroys the user experience for a percentage of potential customers. What’s worse is that operators may not even know it is happening — appreciating their site on their own display device and assuming (or relying on the guarantees of a design team) that everyone sees it the same.

While nothing can replace manual browser and platform compatibility tests, knowing what is supposed to work on each can ease and speed the development process.

One valuable reference tool to help designers target desired devices is Can I use. (www.caniuse.com), an online listing of compatibility tables detailing support of CSS3, HTML5, JS API, SVG and more, across desktop and mobile browsers.

Do you need to know if IE8 supports Canvas Drawings or the versions of Firefox that support session history management capabilities? How about which platforms enable SVG in CSS backgrounds or can handle the WebM/VP8 video format?

Can I use… has the answers — and even lets you make them your own.

The Can I use… compatibility tables are embeddable through an iframe on third-party websites by simply appending “/embed” to any feature page’s URL — for example, www.caniuse.com/[feature id]/embed. This is very useful for integration within a design firm’s corporate Intranet or on a developer site’s resources page.

A browser comparison tool allows granular customization of compatibility reports enabling users to drill down to the data they need. Further tailoring of results is achieved by entering Google Analytics account information in order to import the visitor statistics from your specific site, clearly illustrating which browsers you need to target and which features those browsers support.

Given the capabilities of high-end Internet access platforms, it can be tempting to go “just a little bit further” with design in order to grab a little extra sparkle or to enhance functionality — but knowing where to draw the line takes experience, feedback, statistics — and tools such as Can I use…

Related: