Monday, June 15th, 2009
CSS3 properties can greatly improve your workflow, making some of the most time-consuming CSS tasks a breeze and allowing for better, cleaner and more lightweight markup. Some properties are still not widely supported, even by the most recent browsers, but that doesn’t mean we shouldn’t experiment with them or give visitors with modern browsers advanced features and CSS styling.
In this regard, keep in mind that educating our clients is both useful and necessary: websites don’t have to look exactly the same in every browser, and if a difference doesn’t negatively affect the aesthetics or usability of a website, it should be considered. If we continue to waste valuable time and money making every detail pixel-perfect (instead of adopting more flexible and future-oriented solutions), users won’t have an incentive to upgrade their browsers, in which case we would have to wait a long time before older browsers become legacy browsers and robust modern browsers become the standard.
The earlier we experiment with and adapt new CSS3 properties, the earlier they will be supported by popular browsers and the earlier we’ll be able to use them widely.
The words above are a conclusion in a piece in Smashing Magazine on taking your design to the next level with CSS3.
The post goes into details with case studies and examples for a huge set of enhancements available in modern browsers:
- Selector improvement
- RGBA and Opacity
- Multi-Column Layout
- Multiple Backgrounds
- Word Wrap
- Text Shadow
- @font-face Attribute
- Border Radius
- Border Image
- Box Shadow
- Box Sizing
- Media Queries
Take a walk through the article and play with the ideas. I really like Tim Van Damme‘s site!
Posted by Dion Almaer at 11:41 am