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.
455
questions
1
vote
1
answer
96
views
Need help with button layout on small device
I have the following button layout on my web app and it looks fine on larger screens..
On portrait iPad or smaller it looks like this..
I'm not sure what the best way to display, hide/show these ...
- 14.4k
92
votes
6
answers
176k
views
What is the smallest screen size you design for [closed]
I'm looking to make my website responsive, however this is my first foray into responsive design, and I'm pretty clueless at the moment.
I have no idea what the current state of play is with regard ...
- 591
45
votes
8
answers
50k
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 ...
- 1
67
votes
7
answers
97k
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 ...
- 401
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 ...
0
votes
1
answer
197
views
How to layout tabs when the website becomes responsive?
We have this kind of layout on our e-commerce website. Basically, you can move from one tab to the next to view the different promotions.
My question is since on the responsive version the screen ...
- 982
0
votes
1
answer
138
views
Should the hamburguer button have the same color as links?
For consistency and to make users recognize quickly clickable links/buttons, "the color of a button should depend on its state and its purpose"*.
In the case of the hamburguer button it does not ...
- 14.2k
4
votes
1
answer
617
views
Is it better to display all products or use a carousel on a responsive website?
I have two versions for displaying products in an e-commerce website (responsive):
Long version (all shown):
Short version (with carousel):
I am having a dilemma which to use. On one hand the long ...
- 16.2k
1
vote
1
answer
89
views
Should I provide multiple style guides for responsive design?
I am designing a responsive website and wanted to provide the developers with a style guide. But I was wondering if I should provide 2 separate guides, one for the big screen one for the small.
- 26.7k
0
votes
3
answers
172
views
Optimizing Heavy content and data based website to mobile responsive
I was working on a product which deals with data of companies where there are lot of views and lot of data.
At this point my client wanted it to be responsive on mobile and tabs and ipads.
How do i ...
- 11
6
votes
4
answers
993
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 ...
CommunityBot
- 1
1
vote
1
answer
113
views
How to show time-breakdown × availability from multiple parties in Web App?
I'm designing an scheduling application and I would like to know what's the most intuitive way to display the info of time-breakdown × availability from multiple parties.
Below shows my current ...
- 16.8k
3
votes
3
answers
642
views
hamburger menu vs alternatives for sites
In his article Zoltan Kollin provides several alternatives to hamburger menus. Removing app solutions we're left with:
More
Show primary options, hide others under "more".
Progressively ...
CommunityBot
- 1
2
votes
1
answer
1k
views
Hide content under toggle on mobile, show on desktop by default
Is there any design pattern to hide content under the toggle / accordion on the mobile and to show it fully on the desktop?
I have a list, that I'm hiding on small resolutions and showing on desktop....
- 96
2
votes
2
answers
523
views
Remove swipe action from responsive carousel on desktop?
I have a carousel on the site similar to Airbnb. It can be swiped on mobile as expected:
On desktop though they add arrows and remove swipe.
The question is should you remove swiping on desktop? ...
2
votes
1
answer
2k
views
Full-width dropdown vs left sidebar on mobile
I'm in a fairly early stage of creating a responsive Wordpress theme. I have a basic fixed header bar and I'm working on a left-hand navigation panel right now. I'm taking some inspiration from the ...
- 37.3k
11
votes
3
answers
3k
views
Should a UX Designer design in Pixels, Ems, or another unit of measurement?
I'm getting reading to set up my wireframe file for a responsive site. But after reading more about CSS pixels vs. pixels vs. ems, I can't decide how best to design the site and then communicate the ...
- 101
9
votes
7
answers
31k
views
What is the meaning of responsive design?
I have heard of many websites using "responsive design".
What is this and why should somebody use it?
2
votes
2
answers
285
views
How Far is it recommended to show large table content on mobile browsers [duplicate]
Is it good practice to show all content that is in desktop version to mobile browser.
Can mobile browser handle this kind of data,With low bandwidth.
How far is it legible to read with that huge ...
CommunityBot
- 1
2
votes
1
answer
3k
views
Best practices for filter in responsive web app?
I'm working on a responsive web app.
When a user searches for something they have the ability to set filters. Would it be best to keep them in the context of the page with a drop down/accordion-...
CommunityBot
- 1
1
vote
1
answer
785
views
Is there a better way to present lists of bullet point links in responsive design?
I'm being challenged by a concept on a website redesign. It's a technical/medical website and there are some category pages that list subcategories in giant, bulleted lists of links. There are no ...
- 31
3
votes
3
answers
346
views
Are there any standard patterns of phone vibrations?
The phones nowadays contain a vibrator that is used to notify the user about an action or to give a feedback regarding requested event.
Is there any standard pattern or general rules that specify ...
- 298
3
votes
2
answers
312
views
How to manage long horizontal form
I am redesigning a bad design (IMO) dashboard which shows a list of form fields related to each "Team", such as
Title,
First Name,
Last Name
and list goes on. It has total of 18 fields which ...
- 501
23
votes
9
answers
8k
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 ...
- 8,904
2
votes
2
answers
118
views
What's the correct way to present form with multiple options on mobile?
I'm currently working on satisfaction survey which will be available also on mobile devices.
I have two variants of layout:
I prefer version A because is easier to read (one reading direction).
...
- 16.8k
0
votes
1
answer
54
views
Rescalling a design for Android UI [closed]
How can I rescalle an mdpi design for Android UI to other resolutions in Photoshop? And is there any app for Win to do that in real time (like Skala)?
- 111
6
votes
7
answers
640
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 ...
CommunityBot
- 1
3
votes
1
answer
904
views
Standard numbers for responsive layout
What are the (standard) numbers to work with, when making css responsive layout?
@media screen and (min-width: px) {
/* Mobile */
}
@media screen and (min-width: px) {
/* Tablet */
}
@media ...
- 16.8k
69
votes
8
answers
20k
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 ...
2
votes
2
answers
748
views
Are multiple filter options good for mobile?
We are designing a responsive web app which contains dynamic data. We have a huge variety of filters(Nested) like Location(all countries), founded year, Sectors(Practice area, Feeds, Business models), ...
- 16.8k
0
votes
2
answers
147
views
Are pop-up's good for mobile? If yes how should you show them in mobile
I am working on a web application. I have a huge data on pop-up. I am attaching a scenario(desktop view) for better understanding. I need to convert this to mobile.
- 647
1
vote
1
answer
59
views
Website,WebApp,Responsive Site,Mobile Native App
So there is lot of debate going on in world wide web about websites taking over mobile native apps.
Well it stays subjective.
But i came up with this case recently.
So we have a website that has a ...
- 14.2k
0
votes
3
answers
254
views
Different implementations of a menu for a responsive social media website
I'm currently working on a UX for a social media website. My current draft is available here http://yiays.000webhostapp.com/Nyes-Concept.png
Any advice in general is welcome, however my main concern ...
- 470
1
vote
3
answers
1k
views
Is vertical alignment of UI a good practice?
I am a frond-end web-dev, who gets tons of designs where texts are vertically centered according to something. Every time when I go and start to vertical align stuff I am going in an eternal struggle ...
- 22.6k
1
vote
2
answers
264
views
How to best present a long list of icons in a responsive layout?
On desktop, we have a list of logos on a page. However, when we design the mobile responsive, each logos just stack on top of each other. It becomes a very looong list. What is the best way to present ...
CommunityBot
- 1
3
votes
4
answers
251
views
Menu categories are both on the page and the hamburger menu.. is it redundant?
I am creating the responsive version of a website and I ran into some issue. The website has 3 main categories (say, Cat 1, Cat 2, and Cat 3).
First I thought of putting the 3 categories on the page ...
CommunityBot
- 1
0
votes
3
answers
2k
views
Use of Max-Width In Fluid (Or Responsive) Web Design
I see that a lot of fluid websites use a min-width and max-width property on their web pages designed mainly for desktop. When the browser width is less than min-width, content stops shrinking and the ...
- 101
2
votes
1
answer
152
views
How to assign people to groups on a mobile device?
I have created a page where users can search for pupils and add them to a group, by moving them from one column to another. This works great on a desktop device, but trying to reduce this page down to ...
- 406
0
votes
2
answers
135
views
Responsive design approach
Mostly I am using bootstrap for my website and I keep it pretty responsive. However some of my pages are hard to adjust with media queries.
I have a size limit 769px for mobile.
Is it a acceptable ...
0
votes
2
answers
525
views
Dropdown Error State for Quiz
I need a little help with this one. We are creating a quiz that has drop down inputs for many of the questions. Essentially, the user would select an answer from the dropdown and than click submit.
...
- 11
5
votes
2
answers
19k
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 ...
- 113
3
votes
2
answers
519
views
Interaction to show/hide tags using info icon
Product : Universal file holder for a large enterprise
Situation : Navigation side bar with unnecessary file details
The files are tagged so they can be filtered. However, we already have those ...
- 3,848
2
votes
3
answers
673
views
Responsive design for big resolutions
I would like to design a one-pager site which will be responsive and will be presented well in huge resolutions, such as 2560 width. One method of doing this is design the site with a maximum fixed ...
- 4,481
4
votes
4
answers
3k
views
When designing a responsive layout is it right to assume the iPad layout will be the same as the desktop?
When designing responsive layouts I tend to do 2 sets of wireframes. I design for both mobile and desktop and assume that the iPad will adopt the same layout as the desktop due to size. ( this is if ...
CommunityBot
- 1
0
votes
1
answer
288
views
Best way to make a menu responsive
I've got a navigation menu which looks as following and, it's concealed and triggered using a menu button.
View of the page while menu is collapsed
download bmml source – Wireframes created ...
- 412
1
vote
0
answers
108
views
Cross mobile platform interface navigation
I have to architect a mobile web responsive interface that will be the same for iOS and Android clients.
The app has several areas which I would like to switch using bottom navigation/tabs with icons ...
- 531
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 ...
- 227
6
votes
5
answers
368
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 ...
- 394
1
vote
4
answers
6k
views
Responsive design - Most common resolution steps
I am developing a web app that needs to be available on desktop, tablet and mobile.
I know already about responsive design, media queries and all that stuff, but my question here is more about ...
- 1
3
votes
2
answers
397
views
Responsive Web Design based on physical size?
The current practice of using media queries via pixel-thresholds is fine, but what if someone decided to use their 50-inch 4k tv as a vertical monitor and actually sit really close to it?
I could see ...
- 412