Professional CSS: Build a Website from Scratch

Progressive Enhancement

Kevin Powell

Kevin Powell

Kevin Powell Media Inc.
Professional CSS: Build a Website from Scratch

Check out a free preview of the full Professional CSS: Build a Website from Scratch course

The "Progressive Enhancement" Lesson is part of the full, Professional CSS: Build a Website from Scratch course featured in this preview video. Here's what you'd learn in this lesson:

Kevin explains that progressive enhancement involves adding features to a website that enhance the user experience. Kevin also mentions that different users may have different experiences on a website, and that progressive enhancement allows for a more tailored experience based on the capabilities of the user's browser or device.

Preview
Close

Transcript from the "Progressive Enhancement" Lesson

[00:00:00]
>> Kevin Powell: And what I just talked about there with JavaScript is something that's considered a progressive enhancement. We're enhancing the page for users who have that feature, in this case, JavaScript, so most people are getting the enhanced version of it. There's other times where we can add progressive enhancements to our pages as well.

[00:00:17]
And this is one of those situations that comes up where people will be you know, should every user have the exact same user experience? And people want cross browser experiences to all be identical. And then there's the idea of pixel perfection and all of this. I've always found it a little bit funny that somebody's completely fine with one user having two different experiences on a given website.

[00:00:40]
Because if I open a website on my phone and I go to the same website on my computer, they're not the same experience. The layout is different, the navigation is probably different, the interactions might even be different, and that's me as a single user getting two different experiences.

[00:00:54]
So, I don't understand why two users that never see those two different, one user ends Fauci and one user on Chrome need to have an exact same user experience. When one singular user can have multiple different experiences on a single website. And the idea of progressive enhancement is adding features that make the site better or prettier or do nice things, or whatever it is.

[00:01:18]
It makes it enhances the website, but it does so in a progressive way. So we're not using a technology that ruins the website for somebody else. Everything is completely functional, they're getting the base styling. They're gonna have a website that works and then on users that are on more modern browsers or support other features.

[00:01:34]
Then even from could be JavaScript, or it could be some CSS features, or it could be a lot of other things. If those are supported, then they get that fancier version of whatever it is. And we're gonna be looking at a few features, going forward from here that are really, really nice progressive enhancements that we can add to our page.

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now