Responsive Web… Servuction (part 1)!

I read, watched and listened to a lot of articles, books, blogs, websites, virtual communities… about the importance of responsive web design…

It seems important! At the end of the day, responding to changes in your user’s environment seems very Touristologisty to me!

Responsive web design is the brainchild of Ethan Marcotte. In a nutshell, we have to give answers to the following questions:

1) Which device is using any “Homus Organizativus” member of our chain of value?

Modern CSS give us “@media” to get an answer to this question. Then you can have a common design and complement it with specific designs for different devices (Desktop PC, tablet, smartphone, interactive television… you name it!)

2) Which is the best container (wrapper) for the content we want to deliver in this specific device?

Here, the answer is a flexible grid layout. That means using percentages instead of absolute numbers and a different combination of containers. Take this blog (the blog of the ones who fell in love with Touristology!) for instance.

As you can see, the big picture at the top disappears, you get a summary of two or three posts… it is like a lego construction where you reorganize the containers as you wish!

If you don’t have a mobile and want to give it a try, you can go to… There you can experiment with different models of mobiles.

3) Which content is better to display and in which way?

Is this big picture necessary? And this text?  And…? Which is the appropriate size? We have to remember that connection speed is, usually, an issue for mobile users. So, you have to choose, wisely, what to show and in which size (again percentages can be a good solution)

How to know if the weight is a problem? We can use and get something similar to this:

You will get enough information for free to assess a solution: Average Load Time; Average Page Size. If you (like me) are the kind of person that thinks that going deeper is the way to go… you can view the HAR file for more information!

To me, one of the examples that best exemplifies Responsive Web Design is the transformation of a navigation bar from “text to click” to “pictures to press with your fingers”. See this picture from 

I’m reading, watching, listening to a lot of information about the design, a lot about the devices, a lot about languages programs, a lot about how the cloud will change everything (IaaS, PaaS, SaaS) and… I strongly agree (more information here) BUT when will we begin to talk about the servuction inside this technology? Technology is like pipes… We need water! Technology is like veins… We need blood! 

When will we begin to see applications dealing with responsive web, NOT ONLY adapting to the design but also to the servuction process?

Jordi, exactly, what do you mean with Responsive Web Servuction? Ummm you will have to wait until the next post, Touristologists!!! Meanwhile… What do you think I mean?