Feature Detection With Modernizr for Cross-Browser Compatibility

Modernizr is an open source and compact JavaScript library that allows developers to craft various levels of experiences for users with respect to cross-browser compatibility. Modernizr helps developers to perform cross-browser testing to check whether new the generation of HTML5 and CSS3 features are natively supported by their visitor’s browsers or not and to provide dedicated fallbacks for older browsers that are notorious for their poor feature support. Modernizr coupled with the principle of progressive enhancement helps to design cutting-edge websites layer by layer, taking advantage of powerful modern web technologies without discarding users that are still using older browsers like IE.

How Does Modernizr Work?

Modernizr was launched in July 2009 by Faruk Ateş to battle cross-browser compatibility issues in a uniform, standardized manner. Today, Modernizr as feature detection library is one of the most popular JavaScript libraries, offering more than 270 tests, and is being used in 8.76% websites globally (half a million websites in the US alone). Instead of relying on highly untrustworthy browser detection methods using “User-Agent” sniffing, Modernizr is, instead, based on feature detection. While browser detection is centered around the question “what browser is the visitor using?” feature detection revolves around the question, “what features are supported by the visitor’s browser?” Modernizr runs a series of JavaScript-based feature detection tests in a user’s browser to check for cross-browser compatibility for HTML and CSS by allowing you to target each browser's functionality separately.