@Chris Armstrong – I’ve often pondered that myself. It makes it tough when our heroes are dead. The best we can do is embrace their teachings and try to apply their principles to our work.
Copy & paste the code below to embed this comment.
nitin.nanivadekar
I am running Chrome and Firefox on Ubuntu.
On Chrome, the bottom, section five through section seven, expands to the whole page. On Firefox, the bottom only shows up below content … I call our world Flatland …
How can we trust the article? The author has not even answered my earlier comment.
Responsive design has a certain responsibility and it must be taken into the right consideration while even writing articles, esp. if you’re on AlistApart. A lot of people are following you for the advice and you can’t just deliver pre-alpha articles.
I would like the author responds to my comment. Please write to nitin.nanivadekar@gmail.com if you want to keep it private.
Copy & paste the code below to embed this comment.
Chris Armstrong
@Nitan thanks for your comments :) As I mentioned in the source code, the examples were built to visually demonstrate the article’s ideas, and I’m sure there are far more effective ways to execute them.
I’ll fire you an email to discuss further, rather than getting too technical here :)
Copy & paste the code below to embed this comment.
pafmobile
The page scrolling in your webpage should be fluid but its not in my windows phone!!
You should check it out. Otherwise is just a perfect concept itself.
Like every project the answer is … it depends. We’ll use total fluid and infinite grid layout when designing a content oriented website targeted for a full range of devices.
When images are part of the design and not only in the content. Pourcentages heights of images can become hard to manage and maintain. But clearly future proofed ;-)
I always find it rather patronising when promoters responsive design see the subject as a must because it is never backed up by user research. Where can I find user research on responsive design? I do build fluid sites (£££) but personally when I browse I prefer a fixed site. For example as you get smaller content is often moved around making it hard to find and often removed all together. This is typical when going to desk top to mobile on both the FT and the BBC websites. Also having to scroll and scroll and scroll homepages can be a pain when you can move left to right as well as up and down and pinch zoom on a mobile more efficiently.
Copy & paste the code below to embed this comment.
Chris Armstrong
Great question! I guess the theory is that designs which take your particular environment into consideration will produce better experiences than one-size-fits-all solutions.
Imagine if pocket novels simply scaled down text size and layout, and came with magnifying glasses to help you read them? Giving the user a layout that’s better suited to their canvas size may result in them having to turn more pages (or scroll more), but if done right it should make the content more accessible and pleasant to consume.
Thankfully, some cold hard data is starting to come to light to support this theory. Here are a few recent examples where RWD has had a successful impact:
• http://gravitydept.com/blog/skinny-ties-and-responsive-ecommerce/
• http://www.bostonglobe.com/business/2012/10/30/the-boston-globe-circulation-rises-nearly-percent-herald-falls-nearly-percent/OSqacPxh1L0kQycUnBP1oM/story.html
This does raise another valid issue though: user preference. When we make responsive design choices, we’re making assumptions about the context in which a user is viewing content. For example, you might assume that because a user’s canvas width is <400px that they’re on a mobile device, probably with a touch interface. However they could simply have their browser window at a narrow width in the corner of their desktop.
It’s our job as designers to make the best assumptions we can with the data we have available, but we’re not always going to get it right, and that’s when giving users options to customise their experience could be helpful (if done in a way that does’t impede the experience for everyone else).
@Derek I totally agree, every project is different. Even something as simple as changing the font means reconsidering the ideal column width, which has a huge knock-on effect on a layout.
I am all for content-first strategies. The problem with this approach though, is it seems all the tools and libraries available are optimised for layout-first grids. Right now it seems like each developer is on their own, having to read generic advice and apply it on a case-by-case basis.
I wonder if it is possible to distill a finite number of content types from the wide spectrum of content in the wild? It would seem like this is a necessary step towards being able to offer advice, tools and libraries that are both practical and specific.
PS. after authenticating with Twitter, I was sent back to the home-page: not very convenient. :P
Copy & paste the code below to embed this comment.
acanel3
Thanks for the article.
After reading a number of articles on responsive and fluid web design I’d like to offer my own quirky perspective.
I can see the benefits of setting up mathematical routines that serve to rearrange a set of visual elements within any number different rectangles but, for me, the benefits seem to be primarily in speeding up productivity.
However, it seems to me that a number of the articles in ALA’s “Responsive Design” category are casting fixed designs/layouts in an unflattering way.
The wish for that which might be called Eternity is seen as a foolish wish.
In contrast, the wish to ‘let go of control’ is associated with an outlook that would be held by a Buddhist sage.
I wouldn’t have such a difficult time accepting the premise of setting up an automated layout routine if this premise was being presented as a solution to certain economic and time constraints. Instead, these automated layout routines are endowed with an air of mysticism which, to me, seems unnecessary and misleading.
I would prefer to let myself fall under the influenced of a design (e.g. building, website,…) of a human being who was engaged in an inner process of observing how a set of spatial relationships influenced his/her being, and who was then able to recognize in him/herself, and communicate (via stone, glass, wood, pixels, etc.) something of a universal idea or feeling.
The alternative would be to let myself be influenced by a mechanism that calculates how far a wall should move away from me when I walk into a room (responsive architecture), or how my column widths distribute themselves (responsive web page).
If the current economy was able to support a scenario where a strong designer actually designed (manually) twelve different fixed layouts, each for different devices, I would get more pleasure in looking at how she or he tried to communicate the same feeling/idea in twelve different ways.
In this world where “content is king”, apparently aesthetics is the lowly serf. Visual relationships are demoted to the level of “style”.
26 Reader Comments
Back to the ArticleLeban Hyde
@Chris Armstrong – I’ve often pondered that myself. It makes it tough when our heroes are dead. The best we can do is embrace their teachings and try to apply their principles to our work.
If only… :-)
nitin.nanivadekar
I am running Chrome and Firefox on Ubuntu.
On Chrome, the bottom, section five through section seven, expands to the whole page. On Firefox, the bottom only shows up below content … I call our world Flatland …
How can we trust the article? The author has not even answered my earlier comment.
Responsive design has a certain responsibility and it must be taken into the right consideration while even writing articles, esp. if you’re on AlistApart. A lot of people are following you for the advice and you can’t just deliver pre-alpha articles.
I would like the author responds to my comment. Please write to nitin.nanivadekar@gmail.com if you want to keep it private.
Chris Armstrong
@Nitan thanks for your comments :) As I mentioned in the source code, the examples were built to visually demonstrate the article’s ideas, and I’m sure there are far more effective ways to execute them.
I’ll fire you an email to discuss further, rather than getting too technical here :)
pafmobile
The page scrolling in your webpage should be fluid but its not in my windows phone!!
You should check it out. Otherwise is just a perfect concept itself.
zufrieden
Like every project the answer is … it depends. We’ll use total fluid and infinite grid layout when designing a content oriented website targeted for a full range of devices.
When images are part of the design and not only in the content. Pourcentages heights of images can become hard to manage and maintain. But clearly future proofed ;-)
cheflecode
For simply and scalable grids design check “boxesPhi”. A simply grid system for jquery & javascript at www.cheflecode.com/boxesPhi
Johandesilva
I always find it rather patronising when promoters responsive design see the subject as a must because it is never backed up by user research. Where can I find user research on responsive design? I do build fluid sites (£££) but personally when I browse I prefer a fixed site. For example as you get smaller content is often moved around making it hard to find and often removed all together. This is typical when going to desk top to mobile on both the FT and the BBC websites. Also having to scroll and scroll and scroll homepages can be a pain when you can move left to right as well as up and down and pinch zoom on a mobile more efficiently.
pixelheap
Still dipping my toes into the responsive way of web building but this is fantastic food for through. Great work Chris!
Chris Armstrong
Great question! I guess the theory is that designs which take your particular environment into consideration will produce better experiences than one-size-fits-all solutions.
Imagine if pocket novels simply scaled down text size and layout, and came with magnifying glasses to help you read them? Giving the user a layout that’s better suited to their canvas size may result in them having to turn more pages (or scroll more), but if done right it should make the content more accessible and pleasant to consume.
Thankfully, some cold hard data is starting to come to light to support this theory. Here are a few recent examples where RWD has had a successful impact:
• http://gravitydept.com/blog/skinny-ties-and-responsive-ecommerce/
• http://www.bostonglobe.com/business/2012/10/30/the-boston-globe-circulation-rises-nearly-percent-herald-falls-nearly-percent/OSqacPxh1L0kQycUnBP1oM/story.html
This does raise another valid issue though: user preference. When we make responsive design choices, we’re making assumptions about the context in which a user is viewing content. For example, you might assume that because a user’s canvas width is <400px that they’re on a mobile device, probably with a touch interface. However they could simply have their browser window at a narrow width in the corner of their desktop.
It’s our job as designers to make the best assumptions we can with the data we have available, but we’re not always going to get it right, and that’s when giving users options to customise their experience could be helpful (if done in a way that does’t impede the experience for everyone else).
Something we need to think more about, I reckon.geo
@Derek I totally agree, every project is different. Even something as simple as changing the font means reconsidering the ideal column width, which has a huge knock-on effect on a layout.
geo
Discuss this article. We reserve the right to delete flames, trolls, and wood nymphs.
Ron
I am all for content-first strategies. The problem with this approach though, is it seems all the tools and libraries available are optimised for layout-first grids. Right now it seems like each developer is on their own, having to read generic advice and apply it on a case-by-case basis.
I wonder if it is possible to distill a finite number of content types from the wide spectrum of content in the wild? It would seem like this is a necessary step towards being able to offer advice, tools and libraries that are both practical and specific.
PS. after authenticating with Twitter, I was sent back to the home-page: not very convenient. :P
Rob Wood
The examples currently appear to be broken. Thought provoking article and the water analogy is a good one.
Rose Weisburd
@Rob Wood Strange, the links are working for me. Perhaps it was a temporary hiccup.
Rob Wood
@Rose Weisburd They work fine now. I think it was a problem with http://responsive.is so not the article at all.
Apologies to the author!
acanel3
Thanks for the article.
After reading a number of articles on responsive and fluid web design I’d like to offer my own quirky perspective.
I can see the benefits of setting up mathematical routines that serve to rearrange a set of visual elements within any number different rectangles but, for me, the benefits seem to be primarily in speeding up productivity.
However, it seems to me that a number of the articles in ALA’s “Responsive Design” category are casting fixed designs/layouts in an unflattering way.
The wish for that which might be called Eternity is seen as a foolish wish.
In contrast, the wish to ‘let go of control’ is associated with an outlook that would be held by a Buddhist sage.
I wouldn’t have such a difficult time accepting the premise of setting up an automated layout routine if this premise was being presented as a solution to certain economic and time constraints. Instead, these automated layout routines are endowed with an air of mysticism which, to me, seems unnecessary and misleading.
I would prefer to let myself fall under the influenced of a design (e.g. building, website,…) of a human being who was engaged in an inner process of observing how a set of spatial relationships influenced his/her being, and who was then able to recognize in him/herself, and communicate (via stone, glass, wood, pixels, etc.) something of a universal idea or feeling.
The alternative would be to let myself be influenced by a mechanism that calculates how far a wall should move away from me when I walk into a room (responsive architecture), or how my column widths distribute themselves (responsive web page).
If the current economy was able to support a scenario where a strong designer actually designed (manually) twelve different fixed layouts, each for different devices, I would get more pleasure in looking at how she or he tried to communicate the same feeling/idea in twelve different ways.
In this world where “content is king”, apparently aesthetics is the lowly serf. Visual relationships are demoted to the level of “style”.
Sorry to be such a contrarian.