How long have people coveted the joyous features that CSS3 is now bringing to your browser? How long have we spent hacking around trying to create gradients and rounded corners to now have these very things easily at our fingertips. Quite a good damn while and I for one am very grateful for the new found ease and flexibility we have in deploying these features even if there is not full support everywhere.
Not so long ago I put together an article for Smashing Magazine about using CSS3 and I did mention that using CSS3 features would not be suitable for every situation and that they should be used sensibly and not just splashed everywhere and I think a sign of the maturity and true usefulness of CSS3 will come as people realise this and use it where it is truly necessary, using it as a design tool and not include it just for the sake of it (1px white text shadow springs to mind again!).
So I was rather pleased to see Google+, ok Google haven’t been praised for their groundbreaking design in the past but Google+ is a really well put together and visually appealing design and it’s mostly square. There are the odd subtle rounded corners but on the whole there are a lot of straight edges meeting straight edges with no hint of curve and it looks lovely, you don’t look at it thinking “Oh if only they’d rounded the corners of that button”. It’s not like Google are completely blind to CSS3, there’s plenty used around the Google+ site and the other redesigns of the Google network of sites, no they have chosen to leave square edges in without a hint of remorse.
Yes ladies and gentleman just because you know how to use a gradient doesn’t mean you have to, just because you know all of the border-radius web prefixes by heart doesn’t mean you need to use them – it is hip to be square.
For those who haven’t been to Smashing Magazine recently they published another of my articles a couple of days ago.This time a look at CSS3 and some practical aspects of using it, it’s aimed at those new to using CSS3 and wanting to find out some basic ideas, but I’m sure it’ll help out more experienced people as well.
Some of you may have noticed that I’ve not done any writing for a while, well it’s kind of a new years resolution for me to get back into it. I’ve got lots of half articles strewn around which I’ll look at finishing off but I thought I’d kick off with a look back at last year.
This was requested on the original CSS hover tabs post and as usual it has taken me ages to get around to doing it.
Anyway it is just the previous version realigned and also with an added tab to show you how easy it is to customise and add extra tabs.
You can view the demo here, it’s pretty straight forward and I won’t go into detail as it is all worked using the same principles as the original post so read that first and then take a look at the source of this one. It’ll do you good to do some thinking and look at what’s changed!