Progressive Enhancement
83 items from jbmoelker/progressive-enhancement-resources ★151
-
HTML5 Test html5test.com
Test and compare HTML5 feature support across browsers.
-
Feature vs Browser vs Form factor detection html5rocks.com
As different strategies to tune your app to its environment.
-
HTML5 Accessibility html5accessibility.com
Compare feature support of HTML5 tags, input types and properties across major browsers.
-
Progressive hamburger menu heydonworks.com
List of links in footer enhanced to off-canvas menu.
-
Make the page usable with only HTML gov.uk
This sets the baseline for every device and browser.
-
Configure Desired Capabilities in Selenium github.com
Run automated browser tests in different scenarios.
-
Toggle switch ghinda.net
Checkbox or radios, visually enhanced to sliding toggle switches using CSS only.
-
Project Fugu API tracker fugu-tracker.web.app
Browser support status overview of web API's filling the "app gap".
-
Font Family Reunion fontfamily.io
Compatibility tables for default local (system) fonts.
-
iOS PWA Compatibility firt.dev
Support table for PWA features including service worker, manifest, background sync and push notifications (Unofficial, maintained by Maximiliano Firtman).
-
Responsive Carousel filamentgroup.github.io
List of images enhanced into responsive carousel with various behaviour options.
-
Charts filamentgroup.com
From data table to themed charts using HTML5 canvas (article and library).
-
jQuery custom file input filamentgroup.com
Article and library.
-
EnhanceJS filamentgroup.com
Lets you asynchronously load CSS & JS after a set pre-defined feature tests.
-
Grade components, not browsers filamentgroup.com
Component level feature tests and enhancements.
-
Checkboxes & radio buttons filamentgroup.com
With custom focus, hover and checked state. Enhanced asynchronously.
-
Designing with Progressive Enhancement filamentgroup.com
The book (400+ pages) on Progressive Enhancement.
-
Feature.js featurejs.com
Lightweight feature detection suite.
-
Text browsers en.wikipedia.org
Good way to test if your content is accessible at the baseline. Try Lynx for example.
-
Detecting (HTML5) features diveinto.html5doctor.com
Intro to different feature detection techniques with examples and demos.
-
Device emulators and simulators developers.google.com
-
SVG requiredFeatures developer.mozilla.org
Render SVG elements only if their [requiredFeatures] evaluate to true.
-
MDN Compatibility tables developer.mozilla.org
MDN's web technology documentation has a browser compatibility table end the end of each article.
-
Run Internet Explorer using Virtual Machines developer.microsoft.com
To test IE browsers on other platforms.
-
Edge Platform Status developer.microsoft.com
-
API Catalog developer.microsoft.com
Lets you compare implementation of API specifications in major desktop browsers.
-
Testing in Opera Mini dev.opera.com
Download the app, emulate on desktop, setup to test local websites. (Opera Mini accounts for over 5% browser usage world wide)
-
cURL curl.haxx.se
Web page to see the pre-rendered source code of a page.
-
CSS3 Test css3test.com
Fine-grained tests for CSS3 feature support of your current browser.
-
Timeline css-tricks.com
From definition list to SVG illustration (article with demos).
-
Conditioner.js conditionerjs.com
Conditionally load JS modules based on directives in HTML attributes.
-
Progressive Enhancement: It's about the content cognition.happycog.com
Sharing content is the core of the web. Progressive Enhancement ensures access to content.
-
Chrome Platform Status chromestatus.com
-
CSS Feature Toggles chrome.google.com
Chrome DevTools extension to toggle support of selected CSS features for testing progressive enhancement fallbacks.
-
Barba.js barbajs.org
Add page transitions with event hooks, cache and prefetch support.
-
The Content-out Approach articles.uie.com
Provide wide access to content without technological restrictions.
-
Understanding Progressive Enhancement alistapart.com
Apply technologies in an intelligent way, layer-upon-layer, to craft an amazing experience.
-
Test Driven Progressive Enhancement alistapart.com
Core functional experience enhanced after testing capabilities.
-
Writing polyfills addyosmani.com
If your baseline is still too high for some browsers, consider polyfills (aka Regressive Enhancement).
-
Adaptive Web Design adaptivewebdesign.info
Book on Progressive Enhancement from content to design and interaction.
-
Progressive Enhancement checklist (1st edition, HTML) adaptivewebdesign.info
, Checklist of 2nd edition (PDF) - Actionable list to check you've applied Progressive Enhancement best practices. Part of Adaptive Web Design book.
-
Accessibility Support a11ysupport.io
Compare accessibility support of HTML elements and ARIA roles across browsers & assistive technologies.
