From my recent CSS3 research, it seems that there are two schools of thought when it comes to using CSS3 in your web design.

The first approach is to design your website without using CSS3 then to add CSS3 features to enhance the basic user experience of your website without any detrimental effect for those using a browser that doesn’t implement this specific CSS3 feature. For example, you can use rounded-corners for your menu because they look better – those viewing in a non-compliant browser will still be able to view your menu properly, albeit without rounded corners.

The other approach is to design for the most CSS3 compliant browsers and then to provide alternatives for browsers that do not implement a certain CSS3 capability. Note that this doesn’t mean designing for a specific browser, it is only about checking if the browser implements a certain CSS3 capability. For example, if the browser implements transitions and transformations, you can design a product area using these to show off different information about the product in a visually creative manner. If the browser doesn’t implement these, you can design the product area showing the different bits of information in a grid. This approach requires you to test if the browser implement a certain CSS3 capability then to provide two CSS codes.

Which approach do you prefer? Which approach are you currently implementing?