Hiding elements that require JavaScript without JavaScript :: dade
This is clever: putting CSS inside a noscript element to hide anything that requires JavaScript.
A pragmatic browser support strategy | Go Make Things
- Basic functionality should work on any device that can access the web.
- Extras and flourishes are treated as progressive enhancements for modern devices.
- The UI can look different and even clunky on older devices and browsers, as long as it doesn’t break rule #1.
Related links
Ten years ago today I coined the shorthand “js;dr” for “JavaScript required; Didn’t Read”. - Tantek
Practice Progressive Enhancement.
Build first and foremost with forgiving technologies, declarative technologies, and forward and backward compatible coding techniques.
All content should be readable without scripting.
If it’s worth building on the web, it’s worth building it robustly, and building it to last.
mirisuzanne/track-list: Enhance a list of audio tracks with playlist controls
This is very nice HTML web component by Miriam, progressively enhancing an ordered list of audio elements.
Progressive enhancement brings everyone in - The History of the Web
This is a great history of the idea of progressive enhancement:
It is an idea that has been lasting and enduring for two decades, and will continue.
If Not React, Then What? - Infrequently Noted
Put the kettle on; it’s another epic data-driven screed from Alex. The footnotes on this would be a regular post on any other blog (and yes, even the footnotes have footnotes).
This is a spot-on description of the difference between back-end development and front-end development:
Code that runs on the server can be fully costed. Performance and availability of server-side systems are under the control of the provisioning organisation, and latency can be actively managed by developers and DevOps engineers.
Code that runs on the client, by contrast, is running on The Devil’s Computer. Nothing about the experienced latency, client resources, or even available APIs are under the developer’s control.
Client-side web development is perhaps best conceived of as influence-oriented programming. Once code has left the datacenter, all a web developer can do is send thoughts and prayers.
As a result, an unreasonably effective strategy is to send less code. In practice, this means favouring HTML and CSS over JavaScript, as they degrade gracefully and feature higher compression ratios. Declarative forms generate more functional UI per byte sent. These improvements in resilience and reductions in costs are beneficial in compounding ways over a site’s lifetime.
Related posts
Progressively enhancing maps
How I switched to high-resolution maps on The Session without degrading performance.
Mismatch
It’s almost as though humans prefer to use post-hoc justifications rather than being rational actors.
Web App install API
It’s kind of ridiculous that this functionality doesn’t exist yet.
Applying the four principles of accessibility
Here’s how I interpret the top-level guidance in the Web Content Accessibility Guidelines.
My approach to HTML web components
Naming custom elements, naming attributes, the single responsibility principle, and communicating across components.