A design approach that delivers elegant user interfaces regardless of the size of the user's display or the limitations of the device.
66
votes
4answers
3k views
Should users be able to zoom in a responsive webdesign?
When it comes to a responsive design: should users still be able to zoom in or out?
We are currently working on a responsive design and one of our testers found it awkward that he wasn't able to zoom ...
42
votes
7answers
2k views
Responsive Web Design - what should happen when the mobile device is rotated?
Currently, the standard behaviour for viewing web pages on a mobile is that:
If viewed in portrait the text is smaller because the width of the device is small and the whole page width needs to fit ...
40
votes
9answers
3k views
Should users be forced into a responsive design (without the ability to opt out)?
There is nothing worse than getting automatically redirected to a mobile version of a site, and not having (or not easily finding) a "view normal site" link. It's not just that the mobile site is a ...
24
votes
4answers
1k views
Responsive design: Should I go bigger than 1024px?
I have 6 responsive variations for a web app, from 916px to 320px wide. While running some internal tests, 2 out of 6 people mentioned that they would prefer if the app responded to bigger screens ...
21
votes
4answers
624 views
Why is that the most popular sites don't use responsive design (and choose to use a mobile version instead)?
I think I don't have post screenshots. Most popular sites don't have responsive design (in fact I haven't seen any single one that does): Facebook, YouTube, Quora, Twitter, and the list goes on. With ...
20
votes
9answers
4k views
What techniques can I use to wireframe sites with responsive/fluid layouts?
How do you make wireframes for responsive or fluid layouts? Typical wireframing techniques are static and aren't well suited to showing how designs scale. What techniques exist to capture the dynamic ...
17
votes
4answers
2k views
How to adapt your website for TV browsers?
Many home electronic brands have presented new television sets with built-in browsers and apps. Even though not many of these have enjoyed widespread adoption, the responsive web design movement talks ...
14
votes
3answers
465 views
Is breaking established web conventions in order to be consistent across multiple devices an unexpected (and therefore harmful) user experience?
As a good working example: The standard convention is for mega menus to appear on hover (see sites such as play.com and next.co.uk).
This fits with Jakob's Law of the Web User Experience which ...
13
votes
4answers
7k views
What is the exact difference between fluid and responsive design?
What is the exact difference between fluid and responsive design?
I am bit confused about fluid and responsive design. Fluid is the one where we give width in percentages so that design will look ...
12
votes
8answers
2k views
Responsive web design Vs Separate website for Mobile
Responsive Web design is buzzword these days. which means to create a same website and optimized for all devices.
There are also some website which convert the desktop websites into Mobile website
...
12
votes
9answers
4k views
How should large table columns be handled on a responsive design?
Related to This Question, I'm interested in what I should do with a responsive design theme where the users have control over the columns which are displayed in a tabular, data rich page. Users are ...
10
votes
4answers
694 views
What's the reason behind fixed (position) navbars?
It's becoming almost customary for responsive designs to have fixed-position navbars, where the navbar is fixed to the top (usually, or even bottom sometimes) of the viewport of the browser.
Don't ...
10
votes
6answers
654 views
Responsive Menu that has a LOT of menu items
We have a responsive menu that on mobile just shows the top level menu items (x8), but on desktop also shows hover drop drop downs with service areas within the parent menu item.
The problem is we ...
9
votes
4answers
447 views
What is the generally accepted resolution for mobile design?
So, I am a week and a half into a new project, and I've been designing for a resolution of 320px * 480px. I am new to the game and I've just found out that that resolution is too small considering the ...
9
votes
4answers
335 views
What does “mobile-first” mean?
So I've been trying to find a legitimate answer to this question for a couple days. I read an interview in Awwwards recent publication Trends Web and Mobile 2013 with the following answer in regards ...
9
votes
2answers
599 views
Responsive text or truncated text in Mobile devices?
I was reading this very interesting article on the use of responsive text to show only critical content on mobile devices by the use of responsive text to show one version for the web and one version ...
9
votes
2answers
678 views
How should modal popups and tool tips be handled in responsive websites?
I am reviewing some website wireframes from a client and have decided to make the new site responsive. I've had pretty good luck so far with responsive theming and design from a few past projects and ...
9
votes
4answers
118 views
Best Approach for Responsive Linked Images from Desktop to Mobile?
I am redesigning a website from the early 90's and trying to make it more "responsive". An issue came up that involves two images on the homepage when viewed on mobile devices. These images are linked ...
9
votes
3answers
515 views
Usability testing and responsive web design
What are your take on usability testing and responsive web sites? The flow of page objects, hiding and showing different types of menus or the resizing of objects could have a big impact on ...
8
votes
8answers
347 views
Icons vs. Dropdown for primary mobile navigation
I am working on a responsive design in which there are 5 selections in the primary navigation. I'm thinking because there are only 5 I could use icons instead of a dropdown for the primary navigation. ...
8
votes
2answers
281 views
What's the best approach for header/footer in responsive web design?
I'm an IA doing a responsive site, as part of a much larger scale e-commerce site. Our pages are the only responsive parts of the overall site, so 90% of our site will not yet be responsive. Part of ...
8
votes
2answers
1k views
Is switching to a selectbox navigation for mobile devices a good solution for complex menus?
An example of this functionality can be found in this site (shrink the browser viewport to see the selectbox navigation take over.)
Is this a good practice? Wondering if anyone has any experience to ...
7
votes
4answers
334 views
Responsive design on desktop
I am creating a responsive UI application for desktop, tablet and smartphone. And it looks and works fine.
Most of the site has a responsive design like microsoft or nokia global. It also changes ...
7
votes
4answers
468 views
Best way to indicate that a image gallery can be swiped left-right on mobile/tablet
I'm in the process of adding responsive design to our website and one of the main features that users interact with is our image gallery (we are an editorial-based website). At normal viewport sizes, ...
7
votes
1answer
3k views
What is a good alternative to drop-down menus for site navigation on touch-screen/mobile devices?
We're in the process of redesigning our website, and one of the design goals is to make the site more mobile/tablet friendly.
Our current site is very large, and the navigation is somewhat ...
7
votes
6answers
591 views
What's the best “show navigation” icon for limited screen space
I read through the article and comments on "We need a standard show navigation icon for responsive web design" by Andy Clarke and it got me thinking about the subject and I'd like to hear your ...
7
votes
5answers
136 views
Responsive Breakpoints?
Twitter Bootstrap uses these break points for responsive design:
Large Display: 1200px
Default: 980px
Tablet: 768px
Mobile: 480px
A client said they are using 1280px for their Large Display ...
6
votes
3answers
454 views
Responsive Design - How to deal with wide HTML Tables
I am doing a proof of concept with responsive design. One web page that I am modifying has some extremely wide tables. I really don't know how to shrink the tables width so there is no horizontal ...
6
votes
4answers
170 views
Hide controls on a touch enabled device and only show them if someone uses a mouse?
We're building a responsive web site and we're having a discussion about how to display controls on a map. The theory is that people with touch-enabled devices do not need to see zoom sliders because ...
6
votes
4answers
279 views
Should I use responsive design for an enterprise application used on a variable number of screens?
I'm designing UI for an enterprise application in which the users view their work environment in a single screen mode and dual screen mode (desktops only!).
With this system, the users fill in ...
6
votes
3answers
935 views
Responsive website - navigation usability advice
I am developing a site which is to respond to different screen sizes. The site is fairly large and has up to 4 levels deep in terms of page/menu hierarchy. What I am wrestling with now is how to adapt ...
6
votes
3answers
179 views
How does “upload an image” behave in a Responsive Design environment?
i.e. "Upload CTA" usually launches an OS based file selection interface on desktop devices. How would this work within a responsive design environment if the user is on a mobile browser. Would it / ...
6
votes
1answer
195 views
How to achieve this layout in a responsive design?
I am currently, working on the below layout and I am finding it difficult to maintain alignment and layout.
Below is the layout I want, in blue border.
6
votes
2answers
192 views
Contact form on mobile vs. mailto: link?
I have decided to put a contact form in the footer for my portfolio site and opening the question up to include any site where the decision was to add a contact form on the desktop version...
Would ...
6
votes
5answers
631 views
Is this an instance where I should apply responsive design?
I'm not a great graphic designer or UI designer. I'm developing a plugin that has a popup window on click of a link on webpages. The effect is similar to this one:
http://fancybox.net/
But instead ...
6
votes
2answers
184 views
When is appropriate to include buttons and or swipe command in a Responsive Design off-canvas layout.
When is appropriate to include buttons and or swipe command in a Responsive Design off-canvas layout?
While doing some Responsive Web Design research for sites using the off canvas navigation ...
6
votes
2answers
86 views
Mobile website text link
When developing a mobile or responsive website (for touch screens) making navigation links and other buttons larger to be easier to tap and avoid 'fat fingers' is a good idea.
My question is what ...
5
votes
6answers
183 views
What are the strengths and weaknesses of dynamic responsive typography?
By dynamic responsive typography, I mean a system where the type changes in real time based on an external attribute of the environment or the user, without the user explicitly setting it.
Here is an ...
5
votes
4answers
277 views
Is making all your desktop content available the same as making all the functionally available?
I was wondering if the argument for providing all the content from your desktop site on your mobile site includes making all the functionality and features too available?
5
votes
5answers
845 views
Responsive web design for e-commerce website?
I'm going to build a big e-commerce website and client want that website should be for all user Desktop, Tablets and Smartphones. and budget is not a problem. Site is an e-commerce website lost of ...
5
votes
5answers
303 views
Is it reasonable to partially implement responsive design?
Has anyone ever heard of someone making only some pages on their web site responsive? What do you think about this idea, is it good or bad? I'm not really sure how I feel about the idea. Please ...
5
votes
2answers
130 views
Layout question regarding “Select existing record or create new one” pattern
I want to create a wizard for creating new data.
In one of the steps the user is supposed to select an existing record or create a new one.
There are of course different ways to solve this.
I am ...
5
votes
2answers
605 views
Design patterns for Search
I know this may sound very generic question, but I am forced to post this to understand different patterns of search. I am working on a content oriented site which contains various types ...
5
votes
3answers
138 views
Using a Timeline in a Responsive Design?
I might already know the answer to this but would like some feedback / opinions on this. I am currently putting together a responsive design that will use a linear horizontal timeline. This works ...
5
votes
3answers
243 views
Responsive mobile testing - Is resizing the desktop browser adequate?
Other than touch events, is there any appreciable difference between testing a responsive design by resizing a desktop browser and testing it on a mobile device? There are a plethora of mobile devices ...
5
votes
1answer
390 views
Responsive Web Primary Menu - Show as expanded or contracted by default?
For a responsive website where - at a set break-point - the primary navigation contracts to as single menu item that opens and closes the navigation menu (See the Starbucks.com site for an example) is ...
5
votes
2answers
213 views
A modern image gallery: fluid or elastic?
I am new to UX and IA and everything about interface and solution design. I need to do a simple image gallery based on grids. I read about responsive design and media queries.
Ok, in wide screen i ...
4
votes
4answers
564 views
Should a responsive or adaptive web design be done with only two layouts?
I am working on a small Drupal site that needs to be mobile and desktop optimized. Tablets are not a large part of the anticipated usage. The process has not been ideal. We are planning on taking a ...
4
votes
3answers
139 views
Why does Gmail hide email options under a '+' sign?
Why does Gmail website hide options like "links", "smileys" etc. under a '+' sign when there is clearly enough room along the footer? Am I missing something, or is google really pushing google+?
...
4
votes
3answers
228 views
Visual language for fixed and fluid widths
Is there a common visual language (symbols) to highlight what parts of a web page that should be fixed or flexible when you're doing wireframes?
For example - a web page consists of two columns. One ...
