The Core
Why We Are Here => Web Development => Topic started by: bill on August 23, 2012, 04:14:49 AM
-
I've got some big web re-design projects coming up and I'm wondering whether is would be prudent to put HTML5 and Responsive Web Design (RWD) into the specs. I was always a fan of fluid web designs back in the day. Now that most browsers can handle the CSS I've been intrigued by the rash of Responsive Design sites like the Boston Globe (http://bostonglobe.com/) site that appear super functional in today's multi-device market. I'm just wondering how difficult it would be to put one of these designs together and maintain it.
-
I have experimented with responsive design using WordPress Twenty Eleven as a base. It's quite easy to get caught in technology fascination and I'm a bit worried about the usability issues that arises when users experience different layout as they resize their browser or change devices. There are so many bad cases out there where you just want to click 'full version' button but it's not there.
On the other hand I have seen some cases where it works. One of my favorites is http://www.jyskebank.dk/. If you browse this site using iPad you can use gestures and swipe the slider up and down.
Instead of thinking one fluid responsive layout you should be thinking mobile, tablet and desktop.
-
We're dabbling in responsive where budget/logic doesn't allow for distinct mobile/tablet/desktop versions. We're doing this using Omega as a base theme on Drupal which makes it an easy win. Because drupal also provides for displaying different sized images based on the same logic there are some easy wins to be had.
I haven't yet seen any way to offer a "view full version" link. However from what I have seen from the logic that would just require inserting a test for a session cookie in the script that checks resolution and adding a couple of links to drop and clear that cookie. Might look in to that actually.
-
I've been dabbling with a Drupal responsive theme and have seen a few people I respect (and I think that you do too - incredibill and coopster I think) strongly recommend Twitter Bootstrap for responsive HTML5 designs.
Anyway, I haven't tested on a wide range of platforms, but I'll just throw out that if you're going to do responsive image resizing or otherwise push the limits, you can expect some conflicts with, say, jQuery image manipulation for image sliders or overlays. Things like that have to be a bit more carefully constructed than you might be used to.
-
I'd definitely +1 for twitter bootstrap if you are building from scratch.
-
http://www.boottheme.com/#generatetheme
-
Damn. I need to get an ipad and learn this. Or at least see what it is so I know what oyu guys are talking about.
-
> Damn. I need to get an ipad and learn this
No you don't. Simply drag your screen size in and out and you'll see that as the size changes it adapts very smoothly - ala Responsive (to screen size change) Design
-
> No you don't
Get an iPad anyway