Darren Azzopardi SEO & Usability Lover

Bruce Lee's responsive web design

Reading 'Learning Responsive Web Design' and a Bruce Lee quote comes to mind

I share my thoughts on Clarissa Peterson's 'Learning Responsive Web Design' and even manage to include Bruce Lee-yeah read that right, Mr Bruce 'I'm hard' Lee!

I'll hold my hands up and say, I will never feel qualified to write a review on someone's work, especially when it's a book. The long and tiresome hours it would have taken to complete demands respect!

Clarissa Peterson, thanks for sharing

I don't want to be that numpty who comes along and gives it a negative review or to not do it justice, to not even sound like they've actually read it, is something I don't want to do.

I respect anyone that goes out of their way to share their knowledge. So Clarissa Peterson, thanks for sharing.

Well I've read it. I stopped abit, here and there (I'm easily distracted) but I finally finished it. Let's crack on.

What's responsive design again I hear you shout? Tell'em Bruce

Don't get set into one form, adapt it and build your own, and let it grow, be like water. Empty your mind, be formless, shapeless - like water. Now you put water in a cup, it becomes the cup; You put water into a bottle it becomes the bottle; You put it in a teapot it becomes the teapot. Now water can flow or it can crash. Be water, my friend.

Rather than regurgitate what I've read elsewhere, I'll tell you how it is, I'll tell you how I feel what responsive design is. Bruce Lee once talked about being formless like water. That no matter what contains, water will take its form, its shape. Your website is alot like water, no matter what device your website is being viewed on, it should take it's form. Not literally, like some morphing mutant but give the device full access to your website in terms of viewing pleasure, content and accessibility. I like this way of thinking because it embodies the ethos you get from this book. It doesn't tell you what screens or device to design for, just that your website should just take it's form because in the real world (is that Mtv programme still going?) you can't determine what device will be used to view your website. It just has to be ready and to provide them with access to all of your content.

When does it become responsive?

When I first heard about responsive design I was puzzled to know, when do the break points occur? My method to find this was to resize my browser slowly, from large to small and to see how the site reacts and if it appears broken i.e an image falls down or text over flows then that's when I need to address the break points.

I haven't got a plethora of devices, so I am limited to what I can test my designs on. But so far my tools have been good to me. But whatever you do, test it on devices that do come to hand, ask your friends or family if need be, just test it.

One thing I do want to mention is that this book discusses using em or rem, and if i can remember correctly the author opts for the latter in terms of sizing typography. Clarissa goes into great detail about why to use it and discusses some problems you could have when using em or rem. I've never had a problem sizing my text with ems, I've never found it difficult. Clarissa also mentions not using pixels, and I stopped using that years ago and so should you. Dealing with typography was a big section in the book.

Clarity

Using clean semantic code is a dominant component because it makes sense. As designers we want to use the right code to express the information we're sharing. Though I'm familiar with it, it's nice to find it in here because future website designers need to understand semantics from day one, along with making websites accessible. No ifs or buts.

Let's get cracking

I can't fault the depths that this book goes into, again it mentions alot about typography, compressing images, optimising files on your server and more. Because I know most of this, from my angle it covered content that if you were going to learn responsive design, then you should at least know how to compress your images and what type of measurement to use for the type before hand. I feel this book should be a step up from the standard of just web design-or am I being too picky?

It discusses the pros and cons of having a mobile and desktop site working on different url's along with deciding what content to display to the audience, how it's always better to show the exact same content that's available on the desktop version, but maybe in the mobile version, setting up a different method of accessing it. It's all about compromises and trade offs. Having one website usually does the trick and using responsive design, from a cost and maintenance point of view, makes a wiser choice.

Clarissa leans heavily into designing mobile first. Oh right, and Clarissa also mentions, no, goes into depth about content, how to get it and how sourcing content is on the top of the list of things to do. This gets bonus points from me-would she be happy if I awarded her a Blue Peter Badge, a gold one?

As I'm reading it, I'm thinking, can I start from a mobile viewpoint? Should I, I've always worked from desktop to mobile? I know I'm going to change my workflow.

Vice like device crushing the content to fit in 1 column design

I always worked from desktop to mobile, it's now time to think differently

Where I feel this benefits me is my out look now when it comes to designing on a whole. All I was really doing was crushing my content to fit in a column like design and I want step away from this. I understand the difference between mobile design and responsive design. When your site is responsive, it's not mobile designed, it's just made to fit for mobile viewing. Mobile design is when you really think about the content that's available, how to lay it out and how the experience will be for a mobile user compared to a desktop, this way of thinking pours out of the book.

Going from mobile to desktop in my head works. It gets you thinking about the images, how many http requests, minimising your css and more. Some of this you should be doing already but going from small to large, mentally, is a great starting point to be thinking about.

I enjoyed reading this book. Although it covered alot of the same ground I'm familiar with, I did come away with little nuggets to think about. My only wish was that it got stuck into responsive design straight away, the actual building part, the how to and best practice. Because the author covers areas that is ideal for new website designers, I feel I missed out on gaining access to more of Clarissa Peterson's knowledge.

Only part of my bookshelf; web design, autobiographies, pychology 'amp; online marketing

It sits happily on my bookshelf

Learning Responsive Web Design Book summary

  • Start from mobile first
  • Optimise everything as much as possible
  • Your design should be like water

If you liked the sound of this book, Learning Responsive Web Design will look good on your shelf..

Archive

Looking for more articles?
I've got an archive for you.

Need online marketing help?

I'd like to help improve your online productivity


Unsure of signing up?

Ask me your online marketing question first


My privacy commitment to you