Lessons in Progressive Enhancement with CSS2 and CSS3

I have start exper­i­ment­ing with CSS2 and CSS3 prop­er­ties to see what I can use now for pro­gress­ive enhance­ment. And by pro­gress­ive enhance­ment I do not mean Hey we are so f&#8230ing cool and if you are not cool enough to use the latest bleed­ing edge browser you can go and read our RSS feed. It is more great your are using a good browser, lets make your exper­i­ence bet­ter by provid­ing a design closer to what I would of liked to use if it was not for the lim­it­a­tions of other browsers.

As I have said before, I have not changed how I code HTML and CSS for more than five years. I have made minor refine­ments to my meth­ods, but I have not changed my tech­niques or used any new CSS prop­er­ties in that time.

I will be shar­ing what I learn, because I know a lot of people are in a sim­ilar pos­i­tion to me. So sit back and enjoy the ride and I hope you can learn some­thing you can put to use.

You will notice that I make use of the CSS Zen Garden HTML in my examples. That is a con­scious decision, even though the code has far more hooks than I need. CSS Zen Garden was great in 2003 when I was still learn­ing CSS1, you could stick your head under the hood and see the tech­niques used by oth­ers. Unfor­tu­nately over the past few years, updates have be infre­quent and con­cen­trat­ing on beau­ti­ful design with noth­ing in the CSS has been new or inter­est­ing to me. I now want some­thing sim­ilar for CSS2/3, to show­case what is pos­sible now with cur­rent browser technology.

My first exper­i­ment / tutorial is with the @font-face prop­erty, so enjoy and please do not lit­ter the web with ugly sites that over use fancy type, mod­er­a­tion please.

Comments are closed.

Google