Applying progressive enhancement

In this recipe, you will read about progressive enhancement. Progressive enhancement is a web development approach, which is also described as a part of the Web Standards Curriculum by the W3C. You will also learn to know the differences between the progressive enhancement and graceful degradation approaches for web development.

Getting ready

In this recipe, you will work with CSS background gradients and CSS columns. These techniques are also described in the Browser support, Mobile first strategies, Using vendor prefixes, and Cross-browser CSS3 with Compass recipes of this chapter. You can read these recipes to learn more about CSS background gradients and CSS columns.

How to do it...

The following steps will show you how progressive enhancement works:

1. Create your main project file called main.scss. This file should import the gradient partial file. So, the main.scss should contain a SCSS code like that shown here:

   // scss-lint:disable ColorKeyword, ColorVariable...