Think Vitamin’s CSS3 Conference [in 10 min]
A bit long overdue, but if you’re anything like me and forgot about CSS3 years ago, Think Vitamin’s CSS3 online conference was a great refresher. Judging from the list of 250+ attendees, including representatives from ESPN, Disney, CBC, and several American and Canadian government departments, this clearly is a subject worth considering for implementation – especially now with increasing browser support. The biggest question faced today it seems was ‘how’, which was answered in part by all participants, although best from evangelist Andy Clarke (‘a website is NOT experienced the same in every browser’). If there’s one thing I’m definitely taking away from this conference, it’s Andy’s upcoming book, Hard Boiled Web Design.
So without further adieu, here is the slur of words from my notes:
Memorable moments
- IE9 is going to be hawt. With the preview now available, it’s surprisingly accurate at rendering every CSS3 selector, recognizing both HTML5 *and* SVG 1. *Also: discovered this little gem that forces IE browsers to behave like modern compliant browsers).
- Andy Clarke is the same old awesome. Seriously British, irate, and constantly pushing the envelope. Great words of advice in rethinking the web. Again, recommending the book.
- Paul Irish who? Peppered throughout several of the presentations, paulirish.com has a ton of info on troubleshooting web type – and he maintains the HTML5/CSS3 stuff with the Modernizr.
- Ditch your PSDs, we’re proofing in HTML. Understanding that this can evoke several emotions in the design crowd (cliff jumping, anyone?), I can also understand the benefits to this approach, especially if you’re looking to incorporate CSS3. A sentiment reinforced by both Andy Clarke and Molly Holzschlag, a constantly changing digital platform does not comply with a ‘pixel-perfect’ attitude – especially in today’s world of iPhone/iPad/netbook/etc.* Each experience doesn’t have to be horrible, either. Case in point: Dan Cedarholm’s question (view: Safari & Firefox).
*But please, for the love of God, don’t ever talk to me about holograms.
Notable notes: the presenters
- Molly Holzschlag, CSS3 Layouts. Here’s some shiny new words to add to my vocabulary: advanced layout model (ALM), Flex Box, and Grid Positioning. Let’s not forget the amazing Multicolumn either, where text flows into columns like you would expect it to in InDesign (heart!). Some of these are more suitable for a desktop screen, but a great example of added functionality to the box model.
- Sean Gaffney & Matthew Smith, Typography. The SquaredEye guys had a lot of good stuff to say about the state of type on the web, mostly on @font-face (font embedding). Biggest take-aways: watch your end-user license agreements (EULA) when embedding, there is an actual type format for the web (WOFF), and you can do some amazing stuff with type. Check out their full presentation at SlideShare.
- Andy Clarke, Think Different. The message-at-large (again): websites do not need to look the same in every browser. How do we do this? Past methods used ‘graceful degradation’, where designs largely ignored incapable browsers. Andy suggests the inverse, ‘Progressive Enhancement‘ – building a good framework first, and adding richness as you go along. Love, love, love his design examples of CD Displays (animation in Safari).
- Jina Boulton, Visual Effects – co-author of Fancy Form Design and The Art & Science of CSS, Jina ran through some interesting visual effects of CSS3, including RGBa, Box-shadow, Box-sizing, borders, and multiple backgrounds. I’d love to offer her PDF for download, but better check on that…
Rewarding Resources
- http://www.css3.info – well documented
- http://creatingsexystylesheets.com/ – a la Jina Boulton
- http://webfonts.info/ – check this out for free fonts to embed in your site
- http://www.keithclark.co.uk/labs/ie-css3/ – use JavaScript to force IE to identify CSS3
- http://delicious.com/ellentk/css3conf – all or most of the resources covered
With all of this information now available, including excellent working examples, it’s easy to pickup and run with CSS3. Although, Andy is definitely right: more than just a way of styling, it’s a different way of thinking – and *that*, I feel, is still going to take some time.
April 6th, 2010 at 10:03 am
Sorry I missed that one, it sounded great! I love the idea of the online conference. I’ve emailed the folks at Carsonified about events this summer as I would love to host one at the College for the CV Web Posse.
Your notes about the Multicolumn sound interesting. I heart complex grid layouts.
I like the idea of speeding up the development process by starting the design in html but I’ll always need to use the whiteboard for sketching first.
April 6th, 2010 at 11:16 am
Thanks Jamie! The HTML prototypes are definitely interesting, but there is a lot of design practice out there still reliant on Photoshop (myself included)….
Great idea on hosting events like this – online conferences are easy to broadcast live, and I find I learn more in group participation. My only beef is the hefty price tag for Think Vitamin – group tix are up to $600. :(