The most cartoonish misrepresentation of progressive enhancement is that it means making everything work without JavaScript.
No. Progressive enhancement means making sure your core functionality works without JavaScript.
In my book Resilient Web Design, I quoted Wilto:
Lots of cool features on the Boston Globe don’t work when JS breaks; “reading the news” is not one of them.
That’s an example where the core functionality is readily identifiable. It’s a newspaper. The core functionality is reading the news.
It isn’t always so straightforward though. A lot of services that self-identify as “apps” will claim that even their core functionality requires JavaScript.
Surely I don’t expect Gmail or Google Docs to provide core functionality without JavaScript?
In those particular cases, I actually do. I believe that a textarea in a form would do the job nicely. But I get it. That might take a lot of re-engineering.
So how about this compromise…
Your app should work in a read-only mode without JavaScript.
Without JavaScript I should still be able to read my email in Gmail, even if you don’t let me compose, reply, or organise my messages.
Without JavaScript I should still be able to view a document in Google Docs, even if you don’t let me comment or edit the document.
Even with something as interactive as Figma or Photoshop, I think I should still be able to view a design file without JavaScript.
Making this distinction between read-only mode and read/write mode could be very useful, especially at the start of a project.
Begin by creating the read-only mode that doesn’t require JavaScript. That alone will make for a solid foundation to build upon. Now you’ve built a fallback for any unexpected failures.
Now start adding the read/write functionally. You’re enhancing what’s already there. Progressively.
Heck, you might even find some opportunities to provide some read/write functionality that doesn’t require JavaScript. But if JavaScript is needed, that’s absolutely fine.
So if you’re about to build a web app and you’re pretty sure it requires JavaScript, why not pause and consider whether you can provide a read-only version.
# Shared by Dan Danowski on Thursday, April 20th, 2023 at 1:00pm
# Shared by Diana K. Bergey on Thursday, April 20th, 2023 at 1:29pm
# Shared by Elly Loel ✨🌱 on Thursday, April 20th, 2023 at 1:29pm
# Shared by Yoram Blumenberg on Thursday, April 20th, 2023 at 3:00pm
# Shared by Fynn Becker on Thursday, April 20th, 2023 at 5:39pm
# Shared by Luke Dary on Thursday, April 20th, 2023 at 7:15pm
# Shared by depone on Thursday, April 20th, 2023 at 7:15pm
# Shared by Khalid ⚡ on Thursday, April 20th, 2023 at 7:16pm
# Shared by Zach Leatherman :11ty: on Thursday, April 20th, 2023 at 7:16pm
# Shared by The Spicy Web on Thursday, April 20th, 2023 at 7:42pm
# Shared by Colin Watson on Thursday, April 20th, 2023 at 7:42pm
# Shared by Baldur Bjarnason on Thursday, April 20th, 2023 at 7:42pm
# Shared by Thomas Broyer on Thursday, April 20th, 2023 at 7:42pm
# Shared by Peter Janes on Thursday, April 20th, 2023 at 8:10pm
# Shared by Alda Vigdís :topspicy: on Thursday, April 20th, 2023 at 8:10pm
# Shared by Torb 🦋 on Thursday, April 20th, 2023 at 8:36pm
# Shared by Sven on Thursday, April 20th, 2023 at 9:03pm
# Shared by Garrett Dimon on Thursday, April 20th, 2023 at 9:04pm
# Shared by Thomas Cannon on Thursday, April 20th, 2023 at 9:04pm
# Shared by Rob Whittaker :thoughtbot: on Thursday, April 20th, 2023 at 9:39pm
# Shared by Brian Richards on Thursday, April 20th, 2023 at 11:45pm
# Shared by Johan Bové on Friday, April 21st, 2023 at 5:37am
# Shared by Nicolas Chevobbe on Friday, April 21st, 2023 at 8:07am
# Shared by Georgimus Prime on Friday, April 21st, 2023 at 10:17am
# Shared by Aaron on Friday, April 21st, 2023 at 11:12am