Comments on: UI Design Guidelines for Responsive Design

By: adam

adam — Tue, 09 Apr 2013 12:06:19 +0000

Thanks for the link.. i am sure you will love — http://www.uxzeal.com

By: Tony Smith

Tony Smith — Fri, 08 Mar 2013 12:12:01 +0000

Thank you so much for great article.Responsive website design might turn out as a great way to progressively enhance even small budget projects for mobile devices.

By: Patrick

Patrick — Tue, 26 Feb 2013 23:19:51 +0000

Nice write up overall, first off. But I have a bone to pick, and it isn’t just you that is doing this. I have seen a ton of write up’s lately talking about ‘retina displays’ and acting as if they are unique to Apple. Apple wasn’t the first company to have a hi-res screen. Further more, there are multiple devices with much higher ppi than any of the Apple ‘retina displays’.

If you are going to write an article and make these blanket claims, could we at least do a little research first on the ‘facts’ you are throwing out there, especially something as basic as claiming only one tablet or one company has a ‘retina’ level display (btw, retina is marketing, not a real technical term). Every major player is making ulra-hi-res devices, from phones all the way to computers. Heck, the highest ppi device is 100+ ppi above the iPhone, and 200+ above the iPad.

By: Andrea

Andrea — Tue, 29 Jan 2013 17:44:34 +0000

Hi,
thank you for sharing such interesting thoughts!
I’m reading more and more about the increasing need to create different interfaces for different devices; and I can’t help asking myself a question: how shall we manage the inevitably related increased budget with our clients?
The creation of different interfaces means more production time and, in turn, more budget for the clients.
Thinking about how difficult it is to have them take the cost of the only desktop version, I think it will be a great challenge to educate them to the new multi-design needs and the related increased budgets.
Here in Italy, it’s not unusual to be asked to design for desktop, tablet and smartphone without increasing the bill!
How do you think abotu that ? Which strategies should be considered as to this issue?

By: Tim Pietrusky

Tim Pietrusky — Sat, 26 Jan 2013 20:23:07 +0000

I think that you should not think in “devices”. It could be anything… a computer in a car, a fridge or glass. You can’t predict what your users are using.

By: Kayla

Kayla — Sat, 26 Jan 2013 16:39:10 +0000

Excellent point — my personal computer is even a touchscreen and I failed to mention this! I think the biggest concern would still be on tablets/mobile though, because on a desktop, even if its touchscreen, there is a keyboard and mouse option, which is usually the primary input source anyway. Of course, you make an excellent point — it doesn’t hurt to think about touchscreens on desktop to improve the user experience if they are using them at any given time, and how that implementation will likely grow in the future.

We can say the same with retina display too — with the new Macbook having retina display as well. Put the focus on implementing it with mobile, but we should always be reminded that retina, touchscreen, and more are all coming to desktops soon!

By: Kayla

Kayla — Sat, 26 Jan 2013 16:35:48 +0000

I tend to do use separate mobile and desktop stylesheets, while still using the same pages. For large images that are relevant to the design, I use background image that can easily be swapped out on desktop/mobile. So, when using completely separate stylesheets, on mobile only the mobile stylesheet is downloaded, referencing only the mobile background images. For all other images (using an img tag), there are of course plenty of responsive images plugins (JS) available that will help do the job. :)

By: maverick

maverick — Fri, 25 Jan 2013 14:14:02 +0000

Good article!
However, you should add one thing to your list, since for me that’s one of the greatest drawback of the “Responsive Web Design”.
Be careful when you decide to change something between 2 breakpoints (hiding content, adding content, changing display…) because sometimes, the final user can be really lost if there’s too much differences between 2 versions of the same page.
Besides, I believe that the user should always be able to choose his favorite kind of display (layout/menu/etc.), and if he wants to see the desktop version on his mobile phone, he should be able to do it. With RWD and especially due to media-queries, user is not anymore able to choose the version of a website he wants… What a pity :(

By: emok

emok — Thu, 24 Jan 2013 12:27:53 +0000

awesome

By: Sarah Bauer

Sarah Bauer — Wed, 23 Jan 2013 22:18:41 +0000

Very thoughtful analysis of UI design guidelines for responsive web. I’d add that it’s important while designing for smart phones to strike a balance between assumptions about the “mobile context” and the burgeoning demographic of users accessing the Internet solely from a mobile device. Those users (31 percent of Americans as of June 2012), may need access to all the desktop content, not just a pared down “mobile” version. Things to think about as designers create new ways to deliver content through these channels.

Check out Karen McGrane’s article “Uncle Sam Wants You (To Optimize Your Content for Mobile)” over at A List Apart for more stats and insights!

Cheers
Sarah Bauer
Navigator Multimedia