Leveraging Advanced Web Features in Responsive Design

A terrific case study in progressive enhancement: starting with a good ol’ form that works for everybody and then adding on features like Ajax, SVG, the History API …the sky’s the limit.

Tagged with

Related links

Why we teach our students progressive enhancement | Blog Cyd Stumpel

Progressive enhancement is about building something robust, that works everywhere, and then making it better where possible.

Tagged with

Custom Asidenotes – Eric’s Archived Thoughts

An excellent example of an HTML web component from Eric:

Extend HTML to do things automatically!

He layers on the functionality and styling, considering potential gotchas at every stage. This is resilient web design in action.

Tagged with

Hack to the Future - Frontend - Matt Hobbs

Put the kettle on. This is a long one!

Matt takes a trip down memory lane and looks at all the frontend tools, technologies, and techniques that have come and gone over the years.

But this isn’t about nostalgia (although it does make you appreciate how far we’ve come). He’s looking at whether anything from the past is worth keeping today.

Studying past best practices and legacy systems is crucial for understanding the evolution of technology and making informed decisions today.

There’s only one technique that makes the cut:

After discussing countless legacy approaches and techniques best left in the past, you’ve finally arrived at a truly timeless and Incredibly important methodology.

Tagged with

Hiding elements that require JavaScript without JavaScript :: dade

This is clever: putting CSS inside a noscript element to hide anything that requires JavaScript.

Tagged with

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.

Tagged with

Related posts

Reasoning

In which I find a tagline for Web Day Out and a tagline for React.

Streamlining HTML web components

Some handy tips courtesy of Chris Ferdinandi.

Progressively enhancing maps

How I switched to high-resolution maps on The Session without degrading performance.

Making the website for Research By The Sea

Having fun with view transitions and scroll-driven animations.

My approach to HTML web components

Naming custom elements, naming attributes, the single responsibility principle, and communicating across components.