Questions tagged [responsive-design]
A design approach that delivers elegant user interfaces regardless of the size of the user's display or the limitations of the device.
461
questions
9
votes
3
answers
1k
views
Design guidelines for a multi-screen or multi-device ecosystem
Since the article that was published by Precious about Multiscreen Patterns or patterns for multiscreen strategies back in 2011, there has been an increase in the amount of IoT devices and other ...
8
votes
4
answers
2k
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, ...
8
votes
8
answers
2k
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
6
answers
569
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 ...
8
votes
2
answers
5k
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 ...
8
votes
4
answers
2k
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 ...
8
votes
2
answers
5k
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 articles/...
8
votes
2
answers
1k
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 ...
8
votes
2
answers
2k
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
6
answers
5k
views
How do I design a user friendly survey with more than 150 questions?
I am designing UI/UX for a survey webapp which has more than 150 questions. Right now they are using 5 radio buttons for each question. Similar to the image below:
So the question is, how to make ...
7
votes
4
answers
1k
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
3
answers
8k
views
Best Practice for Responsive Website Header
While working on converting an outdated website to be more responsive I came across a concern with the website header. The client wants to keep their large graphic (both image and text are 1, not 2 ...
7
votes
4
answers
16k
views
What is the best way to allow users select items from a very long list in a responsive web app?
Scenario
I'm designing a web app where the user adds predefined items from List A to a custom List B.
List A is over 100 items sorted alphabetically.
List B can be customized according to user needs.
...
7
votes
2
answers
2k
views
How to present a wide chart on mobile devices?
I have a big chart which, by its nature, needs quite a lot of horizontal space. This is an example:
I'm having troubles finding a way to present it on mobile devices. While I could find a way to make ...
7
votes
3
answers
4k
views
Displaying a large number of columns in a table
I have a Twitter Bootstrap based table with responsive CSS.
Everything looks good but, when I try to put more columns than the size of the table supports, I have a line breaking.
I tried to change ...
7
votes
2
answers
4k
views
Responsive design Pattern for secondary navigation - is there a way not to swamp the user?
I am having trouble to find a good way to present the user some kind of secondary navigation on smaller screens. On Large screens, it looks something like this:
(This one is taken from http://www....
7
votes
3
answers
5k
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 / ...
7
votes
2
answers
1k
views
Why should I use em, and not % for fonts?
If ems essentially give you a result that is a percentage of the base font, what advantage is there to using it, rather than % for font sizing? I have looked around, and haven't really seen anything ...
7
votes
6
answers
1k
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 opinion....
7
votes
4
answers
5k
views
Responsive web design technique in desktop application?
What do you think about using responsive web design techniques in a desktop application?
We need more space for large data and since all monitors today are widescreen, it could be good practice I ...
7
votes
2
answers
6k
views
Responsive Design, how to display two large navigation menus?
we are currently looking at redesigning one of our sites so it is responsive. The problem is the site generally has two large menu systems per page. One at the top as the main navigation and then a ...
7
votes
2
answers
3k
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 ...
7
votes
3
answers
1k
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 ...
7
votes
4
answers
4k
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 ...
7
votes
2
answers
4k
views
Sub-menu dropdown vs tabs on mobile
I am trying to figure out what a better UX is on a mobile phone. Either having the sub-navigation as tabs, or have it be a dropdown.
Method 1 - Dropdown on mobile
In the following images, the sub-...
7
votes
2
answers
600
views
What should the summary count on an "active filter" button be representing?
Often, in facetted filtering experiences, on mobile, the filters are tucked offscreen. To indicate that the current view is being filtered, often the filter button is presented with a number ...
6
votes
7
answers
675
views
Why Browsers load Websites gradually?
When I visit a website, even on a high-bandwidth internet connection, the page will load bits at a time, such that I get to watch the page be constructed before my eyes.
Even though this happens ...
6
votes
8
answers
24k
views
How wide should a responsive-designed website be?
Maybe this is a stupid question but I wonder if it changed.
Websites used to be 960px wide so all screen resolution could easily see all the content.
But with the new 'responsive-design' and html5 ...
6
votes
4
answers
354
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 also available?
6
votes
4
answers
321
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
4
answers
1k
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
5
answers
372
views
How to convince a client to use responsive typography
I am having trouble trying to explain to my client in a non techie language, on why he should follow responsive typography.
Let me give a little bit of context: The project in question is for ...
6
votes
4
answers
1k
views
Do users really want responsive dumbed down versions of websites?
I recently read this article Google: Bad User Experience For Mobile Users May Lead To Ranking Issues where an example of responsive / mobile optimized web site is shown side by side with its desktop ...
6
votes
2
answers
2k
views
How wide should a webpage get?
So when creating a responsive design, how big should the maximum width of the container be?
Should the maximum width of a webpage be fixed (width: 100%; max-width: 1200px)?
Should it grow slower ...
6
votes
1
answer
377
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
5
answers
1k
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
2
answers
576
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 ...
6
votes
1
answer
824
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
2
answers
20k
views
How to test website for large screens?
I want to test website for large screens such as 1920 x 1080 pixels, 2560 x 1600 pixels, In browserstack i find only 1280 x 1024 pixels is maximum for windows machines, Is there any website to test ...
5
votes
4
answers
458
views
Should I place my menu on top of my mobile version of this showtimes website?
I'm trying to design a simple website that will show movie showtimes in a few cities. It's going to be a french website but I translated the important content in the screenshots and the website to let ...
5
votes
2
answers
1k
views
How to avoid the use of scroll bars in dashboard UI?
I have 4 tab container in 1 page and Users have to use scroll bar because lack of the space.
The problem is There is already scroll bars in the grids and the design looks horrible.
1-) I hate ...
5
votes
3
answers
2k
views
Best practices for how search icon functionality should work
I’m trying to find out how exactly the search icon functionality should work when the icon is clicked. This is for a responsive website.
I have three scenarios, please view them on a smaller viewport:...
5
votes
2
answers
2k
views
Full-screen "loading" overlay in desktop browsers
We've recently introduced a full-screen modal for loading operations in our web app to provide better UX for small screens. The problem was that the loading spinner we had before was sometimes out of ...
5
votes
3
answers
206
views
Prepare Community for a Redesign
I am working on a new layout and visual design of an automotive platform. This platform heavily depends on an active community that contributes information such as write-ups, pictures and discussions (...
5
votes
2
answers
7k
views
What does "form factor" mean when referring to software?
I'm asking about when the term is used in context of software UI.
I see Wikipedia articles related to hardware when Googling the term, but not sure what people mean when they refer to it in context ...
5
votes
3
answers
1k
views
Should we still provide social sharing options in a responsive design?
Since the majority of the browsers on small devices (and Safari on desktop as well) already provide a function where the user can share the content on — for example — Twitter, should we ...
5
votes
5
answers
1k
views
Responsive web design for e-commerce website? [closed]
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
5
answers
1k
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
3
answers
7k
views
What is the best treatment of pagination block in mobile view?
I'm working on a Responsive Web Design project. There is this table which can potentially go up to hundreds of records, so we are using a pagination block below it. On first load, user has the choice ...
5
votes
1
answer
2k
views
Chrome Mobile - Request Desktop Site and Media Queries
I'm wondering what people's best practices for handling the Chrome option on Android of "Request Desktop Site" when a site is developed using media queries. When the site is viewed the media queries ...