If you browsed to this site with a latest version of a more modern browser like Google Chrome, Apple’s Safari, Mozilla Firefox or Opera you are looking at many CSS3 features. If you are watching this site with IE you won’t see any of the CSS3 features and you might think this site looks pretty boring (well, you might think this anyway ;)). But the CSS3 usage should degrade gracefully making this site still available for you die hard IE users out there.
So, why did I decide to use CSS3 on my blog? CSS3 is still a standard in the make. But apart from that, many browsers started to implement parts of CSS3 already. And I think that’s a good thing because if we should wait till the standard is ready and till in turn all major browsers implemented it, we could be waiting a whole lot longer (See quote from Wikipedia: CSS level 3, which was started in 1998, is still under development as of 2009).
I think it might be a good idea to start adopting CSS3 to show browser developers and the W3C we want to use it and they should speed up their pace. Of course you can’t just always start using it on every site. If you’re targeting an audience that’s mainly using Internet Explorer it’s perhaps just no use since CSS3 will not work. If on the other hand you create a personal site or a blog, why not just use it?
You will have to test your site on all major browsers and make sure that when some CSS3 doesn’t work on browser X your site is still usable on it. This is called graceful degradation. Check this site in Internet Explorer to see what I mean.
The biggest problem right now is that Microsoft never wanted to add CSS3 parts in previous IE versions. They want to wait till the standard is ready. This could be a good decision but why can’t Microsoft start using the prefix (-ie) solution all other major browsers use? And they did create some other transitions possibilities like filter:progid:DXImageTransform.Microsoft....
But good news; Microsoft is promising some CSS3 support will be available in IE9! It can take quite some time till IE9 is available at the time of writing this article so we can only try to follow todays CSS3 standards and pray it will work (partly) on future supporting browsers.
Of course CSS3 is not the only solution for many design issues you might have which can not be solved with current CSS and HTML standards. For example shadows can be made with PNG files where you have an alpha channel available to play with. Rounded borders can be made on many different ways with current style HTML, CSS, GIF images and sometimes with some Javascript. Transitions can be made with Javascript. Rotations may be a little difficult but it can be done, see this example on Rednael.com. Selectors can be mimicked through Javascript. Etc. But… it just ain’t that simple, consistent and easy to integrate as CSS3.
If you have an opinion about using CSS3, let me know by leaving a comment! What are your reasons to start using CSS3 or not using CSS3 just yet?
Wow, some great effects. Works well on the Mac/Safari.
My older Firefox (3.0.9) doesn’t understand CSS3 like IE.
It’s making me very curious to know more about CSS3. Could it be combined with the WOFF (World Open Font Format) for instance?
In principal I don’t agree with implementing CSS3 in a browser before the standard is fixed… 🙂
If the standard is not yet committed on by the CSS3 group, but still implementations are made into new browser versions, you’ll have different implementations of the “standards” all over again. Chrome might implement it different from Firefox, leaving us with separate code for different browsers.
As the CSS3 (and HTML5) group mostly consists of browser builders (like Google, Microsoft, Apple, etc…), I think they (and we) would benefit more from a commited standard.
What you might get now, is a clash of the titans on the usage of the different implementations. If Microsoft’s implementation is wider used, it might become the standard just because it’s wider used, instead of beeing a better solution.
Thanks for the link though 😉
Thanks MacT and Martijn Thie for your reaction!
@Martijn Thie
I understand your point. If it didn’t take so long for this CSS3 standard to get fixed I might want to agree.
What you pointed out is exactly how Microsoft looked at it (perhaps because they got a lot of comments on creating their own standards before). This is only recently changing slightly as IE9 will get some CSS3 and HTML5 support.
I think your point about “Clash of the Titans” is less of an issue these days. Browser builders are looking more at what their users want and what the public opinion is. For that reason you see tests like ACID3 getting adopted as a “Look how great my browser is” measurement more and more.
It could be that the standard will at this point be implemented in slightly different ways but since a prefix (-moz, -o, -webkit and hopefully IE will use -ie in IE9) is used for all CSS3 functions, different browsers will not intervere with eachother. Only features that are in “Last Call” are implemented this way. Read this post on css3.info for more info.
Apart from that, when the standard (or a module) will be fixed one day I’m quite sure the independant tests will start testing this fixed standard. I think browsers will want to support the standard at that point. It’s becoming a sort of selling point.
I *cannot* wait for full CSS3 support.
I can’t spare the time implementing CSS2 drop shadows on my elements, sadly those not using browsers that support this will miss out.
Hey Almero, Pretty tight sight. I just started coding in CSS today. I love it. I have a question for you though. Can you point me in the direction of how i can get my tags like yours, they look nice.
Hi Vision, great that you like it. Check out the article I wrote just for these CSS3 tags: http://code.almeros.com/how-to-create-a-css3-enabled-tag-cloud