Day 009 on My journey to becoming a CSS Pro with Keith Grant

Continuing from Day 008

I learned something cool: Progressive Enhancement.

As the name suggests, Progressive Enhancement is about enhancing or improving CSS by using newer CSS syntax in web page design.

I like how Keith puts it when talking about CSS:

The language is intentionally designed to be both forward and backward compatible, and it provides you with the tools to keep your code working in both old and new browsers at the same time.

Forward compatibility means that old browsers can handle newer CSS syntax. In other words, older browsers are “compatible with the future” because they will simply ignore what they don’t understand and use a fallback. A fallback is code the browser relies on if it doesn’t understand the newer syntax, provided the older code is declared.

Backward compatibility means that new browsers can handle older CSS syntax. In other words, newer browsers are designed to understand legacy CSS.

To understand it better:

• New CSS code works on an old browser = Forward Compatible
  


• Old CSS code works on an old browser = Normal
  


• New CSS code works on a new browser = Normal
  


• Old CSS code works on a new browser = Backward Compatible
  

Understanding this gives you an advantage in styling web pages that work across most user agents. It’s good practice to keep learning and trying out newer, more efficient ways to write CSS, while still providing fallbacks. That way, users without updated browsers can still experience a functional design.

This is basically the essence of Progressive Enhancement.

I believe anyone can become a CSS Pro, and therefore I am.