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.
47 questions
60
votes
12
answers
88k
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 ...
- 817
23
votes
9
answers
6k
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
...
- 4,902
29
votes
7
answers
35k
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 ...
- 960
70
votes
8
answers
21k
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 ...
JonW♦
- 37.6k
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, ...
- 331
101
votes
4
answers
39k
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 ...
- 1,354
96
votes
6
answers
180k
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 ...
- 1,055
22
votes
5
answers
15k
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 ...
- 7,334
16
votes
3
answers
945
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 ...
JonW♦
- 37.6k
67
votes
7
answers
98k
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 ...
Reena
46
votes
8
answers
52k
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 ...
- 563
45
votes
5
answers
4k
views
Should iOS native app be distinctly different than the responsive website's mobile version?
I was in a training session, where a room full of designers were learning iOS prototyping in Xcode, and there was an individual there who came from Apple to make sure everything in the course was done ...
- 5,525
29
votes
4
answers
4k
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 too,...
- 3,089
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?
- 221
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 ...
- 269
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 ...
- 153
61
votes
11
answers
6k
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 ...
- 6,314
27
votes
3
answers
50k
views
Are there devices narrower than 320px (and data on their usage for web browsing)?
Most organisations I know of when testing responsive designs (and responders to the question What is the smallest screen size you design for) use 320px as the narrowest device width they test for, ...
- 2,706
26
votes
5
answers
3k
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 ...
- 1,605
20
votes
2
answers
6k
views
Why is the Google Search Results page not responsive? [closed]
As every web developer/designer, I read many articles about why responsive web design is important. We are also often told, that you can learn a lot by observing the UI (and optionally the code itself)...
- 303
20
votes
6
answers
142k
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 ...
- 303
20
votes
4
answers
24k
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 ...
- 303
14
votes
10
answers
34k
views
Is 320px wide designs still relevant? (responsive web)
For a couple of years the smallest design I make for responsive websites is 375px wide. Now our new frontend developer eats my brain that I should provide 320px wide. And even if I will not she will ...
- 141
14
votes
1
answer
15k
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 ...
- 241
12
votes
5
answers
5k
views
Tabs design pattern, solving for "N" tabs
I've seen many design patterns that help solve different content presentation issues by leveraging "tabs".
Assuming I do want to display grouped content on a page (complex content or simple)...
- 1,833
12
votes
2
answers
5k
views
Are there any stats on browser widths as opposed to monitor size?
Our analytics across several sites are all showing a marked increase in 1440px+ monitor size, but has anyone seen any stats about what browser size people with large screen tend to use?
Do people ...
- 121
12
votes
1
answer
12k
views
How to use breadcrumbs in a responsive layout?
I would like to use breadcrumbs on my responsive site. Breadcrumbs become less recognisable if the links wrap as the layout is then less recognisable. This creates an issue for my site as the width ...
- 425
11
votes
2
answers
25k
views
What are the ideal widths a website should be designed for on a phone/tablet/computer?
What are the ideal/typical widths that an adaptive/responsive website should be designed for in order to accomodate the most devices possible?
- 503
9
votes
3
answers
5k
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 ...
- 91
9
votes
3
answers
2k
views
Should I reduce the number of menu items when showing on smaller devices, or use a 'hamburger' responsive menu?
So I was thinking about how I could make a responsive menu a better experience rather than just firing it into a drop down on mobile that has a hamburger as an icon.
Would it perhaps be a better user ...
- 93
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/...
- 1,198
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 ...
- 490
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 ...
- 336
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 ...
- 578
4
votes
4
answers
3k
views
Should I have "read more" links in a responsive design?
I'm currently in the middle of a re-design for a mid-market newspaper's website, and for each article there's a "Continue reading story >>" link after the lede paragraph on topic pages and the home ...
- 303
4
votes
1
answer
1k
views
Tables with a lot of data for small screen sizes
It is probably not just me who finds responsive tables barely readable when using small screen devices. In most of cases they look like in example #1.
I find this way completely impractical when ...
- 1,322
3
votes
1
answer
1k
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 ...
- 901
3
votes
2
answers
2k
views
What is the best way to responsively display large amounts of tabular data?
I'm working on a redesign that needs to translate well from desktop to tablets. There is a table that could potentially hold thousands of entries. Think of this page as a dashboard. From what I gather,...
3
votes
1
answer
555
views
What to do if more than 2 hamburger icons in nav bar?
I am building a website for each office within an agency (about 6-8 different offices). I want to make it easy for a visitor to jump to another office website when on an office website. So, each ...
- 367
2
votes
3
answers
333
views
Panel arrangement and responsive design
In a user interface it is often appropriate to use to panels arranged in a grid to display content, either as a way of showing content instances to a user or as a way of arranging content instances ...
- 7,888
2
votes
4
answers
126
views
How can I display a definition to my users on mobile?
I have a client that has some content with pretty intense scientific language. They realize this, and want to offer contextual definitions, on demand.
I can find lots examples of this being done via ...
- 51
1
vote
4
answers
404
views
Why use rem units for spacing and sizing, instead of px units?
It seems that most web designers choose scalable units (rem, based on font size) for pretty much everything, instead of fixed units (px).
But when it comes to spacing and sizing, that doesn't make ...
- 598
1
vote
2
answers
2k
views
Breadcrumbs for Mobile
We are designing a responsive site and I was wondering if we need to use breadcrumbs for mobile version.
I did some research and most of big brands don't use breadcrumbs on their mobile site but I ...
- 11
1
vote
3
answers
177
views
Responsive design for sidemenus
I have a website that was designed to have a side menu running along left side of the screen from top to bottom. Works great, looks great, but I'm having some issues when it comes to making it ...
- 111
1
vote
2
answers
945
views
Data Display of Tables: Table Cells with Must-See Values
I have a data-driven web app with horizontal resolution limit of 1280px, yet up to 15 columns (table cell data varying between 0-255 characters). I wouldn't like to display data on multiple rows as it ...
- 173
1
vote
2
answers
555
views
responsive menu logo
often times a menu bar on a responsive website turns into this three line logo:
☰
i'm curious as to why this symbol has been thoroughly adopted. why aren't words such as "Menu" or "Navigation" ...
- 198
0
votes
3
answers
2k
views
Determine correct breakpoints to wireframe to a responsive website!
My problem is about choosing the right breakpoints for a responsive website as it's wireframing (Not determining in the code phase). I am having trouble about this. Because many people say that choose ...
- 17