Blogging and all that malarkey

My Responsive Web Design workshop at Smashing Magazine is getting closer and some tickets are still available. In the meantime, here are three useful new resources for responsive layout using CSS3:

A year ago I travelled to Oslo in Norway to teach a two day responsive design workshop at FINN. The team there have (obviously) been working hard and yesterday they let me know they’d a new responsive design. It looks great

A really fun site by David Paliwoda and Jesse Williams.

The Stuff and Nonsense nutty boys header is pretty tall and I decided I wanted to reduce its height for small screens, such as phones, in landscape orientation. When I wrote the CSS to make this happen I made some nutty assumptions. In the spirit of sharing our mistakes:

Two shows in one week. Aren’t you the lucky one? While I’m in Japan for two weeks, Anna’s joined by Ashley Baxter, who took over her father’s insurance business at eighteen. They talk about starting young, learning new skills, determination, vision and overcoming fear.

While Anna is en vacance en France, in this week’s episode of Unfinished Business I’m joined by guest co-host, designer Laura Kalbag to talk about mentoring students and how to give them, and other newcomers, valuable commercial project experience. Laura also talks about how best to ask for, and deal with, client feedback while I remember Mickey, the world’s cleverest chimpanzee.

I hope you enjoyed yesterday’s new, Madness-inspired home page header. We certainly enjoyed making it.

I like to think that at Stuff and Nonsense, our house isn’t so much a place to work as it is a house of fun and although we take the work we do very seriously, we don’t take ourselves too seriously at all. We hope that sense of fun comes across on our site and today we’re putting aside our embarrassment, putting on our baggy trousers and unveiling a new header on our home page.

Endless possibilities for mischief.

Flexible layouts. Equal height columns. Presentation independence from your HTML source order. These things haven’t been so easy to achieve with CSS — until now. The flexible box layout, the new flexbox specification, makes creating any of these layouts easy and much more.

Backwards compatibility is still an issue, but there’s no doubt that flexbox is (part of) the future of CSS layout.

Jordan Moore (who wears rattlesnake skin shoes) on how to give users the option to “Toggle a Responsive Design On and Off”:

Whenever I’m asked what aspects of design developers should learn, I always answer grid ratios and typography. From now on I’ll also point people to this great little slide deck by Dan Barber.

I’ve been using Emmet these last few months in Espresso and find it incredibly useful. I suppose between this and Sass, I write half the code I used to. (Now I just need to write the Emmet shortcuts reminder sheet I’ve been planning for months too.)

Today’s Squidfingers.

After I mentioned on Unfinished Business about wanting to improve Rock Hammer’s typography Sass, Zachary Kain got in touch to tell me about Typeplate, a “typographic starter kit” that’s worth your attention too.

We know that it’s only web designers who habitually resize a browser window to see if a site’s responsive. But why not reward their dedication with a little something special? Add this to your stylesheet:

@media only screen and (min-width: 960px) and (max-width: 970px) {

body {
-webkit-transform : rotate(180deg);
-moz-transform : rotate(180deg);
-o-transform : rotate(180deg);
transform : rotate(180deg); }

}

This could be the most essential CSS3 media query you’ll need today.

Following my visit to the University of Ulster in Belfast, in this week’s; Unfinished Business, Anna and I talk about how hard it is to keep up with new technologies and techniques and how to decide what aspects of web design and development to learn next.

I’ve always had a soft spot for the people at Smashing Magazine and I loved being at their Smashing Conference last September, so when they asked me if I’d like to be a part of their workshop programme, I didn’t hesitate to say “yes.” This coming June my wife and I will be heading back to beautiful Freiburg where I’ll host a ‘CSS3 for Responsive Web Design’ workshop.

Back in 2009, I took what I thought would be a trip of a lifetime to Japan to speak and host a workshop at Web Directions East. I spent a hectic few days in Tokyo then set off for a place I never thought I visit, Hiroshima. I’ll never forget standing, in tears in front of the A-Bomb dome, or visiting the shrines on Miyajima Island. I met new friends and went home with stories to tell.

In this week’s episode of Unfinished Business, Anna and I talk about Anna’s new limited company, why she needed to set up a company and how she went about doing it. Andy moans about not understanding GitHub (again) and why developer tools often make him feel stupid. After hours, they talk about an episode of Anna’s favourite cartoon, Adventure Time.

(I’d like to apologise for the scratchy audio in this week’s episode. It was entirely my fault. It’s a still a great show this week and I hope the audio quality does’t spoil it too much.)

If you listen to Unfinished Business, you’ll know that I’m a big, big fan of Hammer For Mac, the app its developers say lets you create HTML builds & templates quicker, more efficiently & more conveniently. Hammer works for us because these days we mostly deliver static HTML and CSS templates, instead of static visuals, and we rarely develop complete sites.

Slides from Chris’ excellent talk on CSS3 layout modules at today’s Camp Digital in Manchester. He covered, Flexible Boxes, Multiple Columns and more.

This couldn’t have come at a better time (for me.)

In this week’s episode of Unfinished Business, Anna and I talk about the benefits Stuff and Nonsense gained when we ditched daily rates and fixed project pricing and switched to estimating, working and billing in weekly patterns. I explain how agile methods can benefit designers and clients, even though I don’t really know the difference between agile and scrum. After hours, we talk about our movie of the week, Tarantino’s Kill Bill Vol 2.

This episode is sponsored by Typecast; quickly style type in the browser and check for readability, rendering and beauty as you work.

Two of Five Simple Steps’ business related books: Web App Success and Managing Web Projects. Use the offer code UNFINISHEDBIZ30 for 30% off for an additional week.