zachleat’s Ugly Mug

Zach Leatherman

Compatibility Tables Compendium

18 March 2015 Read in about 5 minutes #17 most popular

When it comes to web development, nothing beats a good compatibility table (especially not a listicle about compatibility tables). They help you make important decisions about new web feature production readiness, inform our best practices, and help us troubleshoot peculiar issues in fringe browsers. To that end, I’ve collected a list of useful compatibility tables that I thought were worth sharing.

Can I use

JavaScript CSS HTML SVG Alexis Deveria

These are the best. Everyone knows about these for a reason. They’re the most useful, most updated, most comprehensive compatibility tables. They have made development decisions easier and I can easily declare them one of the best resources on the web.

Mozilla Developer Network

If you’re looking for a specific web feature, a JavaScript API, or even a CSS property, chances are that the MDN documentation has a support table at the bottom. Just include MDN in your search engine query to easily find the community sourced documentation.

Browserscope

Networking Performance Steve Souders and Lindsey Simon

A huge number of tests, most notably the Network tab. You can learn a lot just by reading the tooltips on the table headers there.

The JSKB tab includes compatibility tables for addEventListener (DOM2 Events), getComputedStyle (basically, not on IE <=8).

ECMAScript Compatibility

JavaScript Kangax

The resource for ES5, ES6, and ES7 compatibility with exhaustive browser support, even including support tables for PhantomJS and Rhino. A really beautiful, encyclopedic, unbeatable reference.

CSS3 Please

CSS Paul Irish, Jonathan Neal

The inline comments on each property are a great compatibility table for CSS vendor prefixes.

The State of Web Type

Typography Bram Stein

Has some overlap with Can I Use on font formats and CSS properties, The State of Web Type really shines for its tables on OpenType Features, specifically the many different options available to font-feature-settings.

Font Family Reunion

CSS Zach Leatherman

You might recognize this one (I feel a little bit of shame for including it but only enough not to call it a shameless plug). It shows the default fonts available for use in CSS font-family across browsers and operating systems.

Unify for Unicode Characters

Unicode Accessibility John Holt Ripley

Shows which Unicode characters are safe to use across an amazing number of mobile devices. Also a great compatibility table of how screen readers will read each character.

Mobile HTML5

JavaScript CSS HTML SVG Maximiliano Firtman

Some overlap with Can I Use here but importantly does include some fringe mobile browsers like Amazon Silk, BlackBerry 5 and 6 (as well as separate entries for tablets), and the Nokia Browser.

Web Browser Compatibility

JavaScript CSS Cody Lindley

Very specific reports on JavaScript APIs, down to individual method support. Also includes CSS properties. A great, comprehensive resource.

Screen reader support for hidden content

Accessibility Steven Faulkner and the Paciello Group

A really great look into the different methods for hiding content from screen readers, with tests to show screen reader support for each. Think HTML5 hidden, aria-hidden, CSS display: none, and other hiding techniques.

<input type="file"> on Mobile

HTML Viljami Salminen

(Originally from 2012 but it looks like it’s still being updated)

Image Download with Media Queries

CSS Networking Performance Tim Kadlec

Shows CSS background-image code using different media query configurations and which browsers will download non-applicable images.

CSS Networking Performance Scott Jehl

Most browsers download all stylesheets immediately, even if their media attribute does not currently apply (think print or nonsense).

Browser Hacks

CSS JavaScript Hugo Giraudel, Tim Pietrusky, Fabrice Weinberg

A lot of things can be feature tested. Some things can’t. Before you reach for the User Agent string, why not try a weak inference instead?

QuirksMode

JavaScript CSS Peter-Paul Koch

QuirksMode will always have a special place on this list because PPK popularized the browser compatibility table. His investment into the tables on his site have helped countless people over the years and will likely continue to do so.

CSS Values

CSS Louis Lazaris

A great search interface for quick reference to CSS properties and browser support.

JavaScript Compatibility Checker

JavaScript Thijs Busser

A really impressive tool that will check JavaScript code for API use and show you your browser support matrix for that code!

CSS in Email Clients

CSS Campaign Monitor

Chris Coyier was nice enough to share this one. Campaign Monitor helps you write email using the CSS features that are available on different email clients.

Features Coming Soon

New features currently being discussed or developed. Great to see what’s coming down the pipe.

Honorable Mentions

These are not exactly compatiblilty tables (but I would consider them to be similar and very useful resources):

Additions

I’m sure I’ve missed some—if you have another please send me a tweet or leave me a comment!

Retweet to share this post