Lessons in Progressive Enhancement with CSS2 and CSS3

I have start experimenting with CSS2 and CSS3 properties to see what I can use now for progressive enhancement. And by progressive enhancement I do not mean Hey we are so f&#8230ing cool and if you are not cool enough to use the latest bleeding edge browser you can go and read our RSS feed. It is more great your are using a good browser, lets make your experience better by providing a design closer to what I would of liked to use if it was not for the limitations 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 refinements to my methods, but I have not changed my techniques or used any new CSS properties in that time.

I will be sharing what I learn, because I know a lot of people are in a similar position to me. So sit back and enjoy the ride and I hope you can learn something you can put to use.

You will notice that I make use of the CSS Zen Garden HTML in my examples. That is a conscious decision, even though the code has far more hooks than I need. CSS Zen Garden was great in 2003 when I was still learning CSS1, you could stick your head under the hood and see the techniques used by others. Unfortunately over the past few years, updates have be infrequent and concentrating on beautiful design with nothing in the CSS has been new or interesting to me. I now want something similar for CSS2/3, to showcase what is possible now with current browser technology.

My first experiment / tutorial is with the @font-face property, so enjoy and please do not litter the web with ugly sites that over use fancy type, moderation please.

Comments are closed.

Google