Over It by Brad Frost
Rob Larsen was published a book with O’Reilly called “The Uncertain Web: Web Development in a Changing Landscape”. I like it:
A refreshingly honest look at the chaotic, wonderful world of web development, with handy, practical advice for making future-friendly, backward-compatible websites.
You can now read Aaron’s excellent book online. I highly recommend reading the first chapter for one of the best descriptions of progressive enhancement that I’ve ever read.
Watch this space.
My contribution to this year’s edition of the web’s best advent calendar.
A superb article by Josh on planning for progressive enhancement—clearly laid out and carefully explained.
Angry, but true.
Don’t lock yourself into a comprehensive technology that may just die within the next few months and leave you stranded. With progressive enhancement you’ll never go wrong. Progressive enhancement means your code will always work, because you’ll always focus on providing a minimal experience first, and then adding features, functionality, and behavior on top of the content.
I don’t tend to be a “magic pill” kind of believer, but I can honestly say that embracing progressive enhancement can radically change your business for the better. And I’m glad to see Google agrees with me.
Google has updated its advice to people making websites, who might want to have those sites indexed by Google. There are two simple bits of advice: optimise for performance, and use progressive enhancement.
Just like modern browsers, our rendering engine might not support all of the technologies a page uses. Make sure your web design adheres to the principles of progressive enhancement as this helps our systems (and a wider range of browsers) see usable content and basic functionality when certain web design features are not yet supported.
Patty’s excellent talk on responsive design and progressive enhancement. Stick around for question-and-answer session at the end, wherein I attempt to play hardball, but actually can’t conceal my admiration and the fact that I agree with every single word she said.
Some thoughts on progressive enhancement, although I disagree with the characterisation of progressive enhancement as being the opposite choice to making “something flashy that pushes the web to it’s limits”—it’s entirely possible to make the flashiest, limit-pushing sites using progressive enhancement. After all…
it’s much more a mindset than a particular development technique.
It’s very early days for ServiceWorker, but Jake is on hand with documentation and instructions on its use. To be honest, most of this is over my head and I suspect it won’t really “click” until I try using it for myself.
Where it gets really interesting is in the comments. Stuart asks “What about progressive enhancement?” And Jake points out that because a ServiceWorker won’t be installed on a first visit, you pretty much have to treat it as an enhancement. In fact, you’d have to go out of your way to make it a requirement:
You could, of course, throw up a splash screen and wait for the ServiceWorker to install, creating a ServiceWorker-dependant experience. I will hunt those people down.
I very much agree with Orde’s framing here: I don’t think it makes much sense to talk about “above the fold” CSS …but it makes a lot of sense to talk about critical CSS.
And, yeah, it’s another example of progressive enhancement.
Dan Donald gets to the heart of progressive enhancement:
Assumptions in themselves don’t have to be inherently bad but let’s recognise them for what they are. We know very little but that can hopefully enable us to be far more flexible and understanding in what we create.
Almost six minutes of me squinting in the sun and sharing my reckons while seagulls squawk in the background.
I really hope that this is the kind of usage we’ll see for web components: enhancements for the browsers that support them without a good ol’ fashioned fallback for older browsers.
Derek’s excellent advice on avoiding over-reliance on data attributes has this brilliant nugget of insight:
In the web front-end stack — HTML, CSS, JS, and ARIA — if you can solve a problem with a simpler solution lower in the stack, you should. It’s less fragile, more foolproof, and just works
A terrific post from Trent, touching on all the important facets of building for the web: universality, progressive enhancement, performance …great stuff!
Scott writes an absolutely spot-on skewering of the idea that progressive enhancement means you’re going to spend your time catering to older browsers. The opposite is true.
Progressive Enhancement frees us to focus on the costs of building features for modern browsers, without worrying much about leaving anyone out. With a strongly qualified codebase, older browser support comes nearly for free.
The importance of long-term thinking in web design. I love this description of the web:
a truly fluid, chaotic design medium serving millions of imperfect clients
A nice look at responsive design, progressive enhancement, and the principle of One Web.
Like Drew, I’ve noticed some real hostility to the idea of progressive enhancement recently. Like Drew, I don’t really understand where this attitude comes from. It’s not like progressive enhancement prevents you from doing anything you would do otherwise: it’s just another way of approaching the way you build for the web.
I hope I’m wrong, but I suspect that some developers are letting their tools dictate their principles—the tail wagging the dog (where the tail is Angular, Ember, etc.).
Another good ol’ rant from Tom. It’s a bit extreme but the underlying lamentation with the abandonment of progressive enhancement is well founded.
Some excellent practical advice on progressive enhancement.
I really like Scott’s approach to defining what “support” means in terms of browsers—it makes a lot sense to break things down to the component level.
A love letter to HTML, prompted by the line-mode browser hack event at CERN.
A cogent definition and spirited defence of progressive enhancement:
Progressive Enhancement is an extension of our shared values on the web and goes to the root of the web. I believe—and hope you agree—that the web is for everybody and should be accessible regardless of the device a user brings to the party.
Go, Dan, go!
‘Sfunny, I was talking about just this kind of thing at An Event Apart today.
Jason pulls together some of the themes that emerged at An Event Apart DC this week.
Yet another timely reminder from Tim, prompted by the naysayers commenting on his previous excellent post on progressive enhancement, universal access, and the nature of the web.
There’s something fundamental and robust about being able to request a URL and get back at least an HTML representation of the resource: human-readable, accessible, fault tolerant.
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.
A nice description of progressive enhancement by Norm, as applied at GDS.
This off-canvas demo is a great practical example of progressive enhancement from David. It’s also a lesson in why over-reliance on jQuery can sometimes be problematic.
A really nice explanation by Todd Kloots of Twitter’s use of progressive enhancement with Ajax and the HTML5 History API. There’s even a shout for Hijax in there.
I wholeheartedly agree with Christian’s diagnosis of the average web page: it’s overweight to the point of obesity. Fortunately Dr. Heilmann has some remedies.
Some great thoughts from Mike Davies about the strengths of the web, prompted by some of the more extreme comments made by James Pearce at Full Frontal last week.
I should point out that James was being deliberately provocative in order to foment thought and discussion and, judging from this blog post, he succeeded.
The Web’s independence from the hardware and software platform people use is a feature. It’s better than cross-platform frameworks which are constantly criticised for not producing exact native-feeling apps on the multitude of platforms they run on. The Web is above that pettiness.
This is the talk I gave at the Webdagene conference in Norway a few weeks back. I called it Responsive Enhancement but I think the Norwegian title translates as “Improvements Through Responsive Design.”
Remember when I linked to the story of Twitter’s recent redesign of their mobile site and I said it would be great to see it progressively enhanced up to the desktop version? Well, here’s a case study that does just that.
Nicholas is inside my head! Get out of my head, Nicholas!
What makes the web beautiful is precisely that there are multiple browsers and, if you build things correctly, your sites and applications work in them all. They might not necessarily work exactly the same in them all, but they should still be able to work. There is absolutely nothing preventing you from using new features in your web applications, that’s what progressive enhancement is all about.
A really great markup and CSS pattern for “content first, navigation second” from Aaron.
A great talk by Nicholas on what progressive enhancement means today. There’s some good ammunition in here.
Yet another great post from Brad:
Whenever I think of the concept of “One Web” and providing universal access to information on the web, I tend to break it down into something much simpler: give people what they ask for.
A great post that discusses exactly what we mean when we talk about “supporting” different browsers.
This is really handy: a bookmarklet that will disable any CSS3 on a page so you can check that your fallbacks look okay.
Yes! Yes! Yes!!!
Progressive enhancement is the only sane approach to today’s massively divergent landscape of devices. It can’t be repeated often enough.
This looks like a nice progressive enhancement pattern: convert a select element into an auto-completing input element (a country selector in this case).
I wholeheartedly agree with this summation of what professional web design and development entails.
Here’s an approach to responsive images in the Expression Engine CMS …but I fundamentally disagree with the UA-sniffing required.
Once there’s better support for the CSS3 attr() function, this could be a nifty way of handling responsive images (although large-screen user-agents will download more than one image).
Another approach to responsive images, this time using background images. The disadvantage is that large-screen devices will download both images. Still, pretty darn clever.
A nice round-up of responsible responsive web design techniques, ‘though I would go a bit further and suggest that the rallying cry is not so much about Mobile First but Content First.
This is a fascinating take on progressive enhancement from Luke: for a service-based site, the equivalent of Content First is API first …literally a command line interface as a baseline.
A great presentation by Andy on the use of progressive enhancement at Clearleft.
An excellent summation of the responsive enhancement approach to web development.
A great article by Malarkey wherein he lists five examples of progressive enrichment (as Dan is wont to call it) complete with side-by-side comparisons. Useful ammo, this.