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
3
answers
2k
views
Best practices for navigation menu positioning in a responsive header?
Assuming you have a responsive header that always takes up the full width of the viewport (such as the one in https://mailchimp.com), are there any best practices to follow for positioning the ...
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 ...
3
votes
1
answer
2k
views
Responsive Pricing Table
I am designing a simple Landing Page which has 2 lines about the product and the Pricing Table.
I want to Make a Responsive Layout for Mobile. Not sure which is the best way to display the Pricing ...
11
votes
4
answers
2k
views
Responsive sidebar sub-navigation
We're working on a new, responsive version of a large website and need to support the main navigation and sub-navigation that changes based on the department. Below is a mockup of how we are ...
1
vote
2
answers
278
views
responsive two-column layout
This might be a really basic question, but I am trying to figure out how to best create a responsive two-column layout. Let's say you have two sets of data. For example, latest departures and arrivals ...
1
vote
2
answers
614
views
Responsive feature comparison layout / grid
I have a list of applications (~120 items).
Each application on the list has the same features (logo, name, OS name, price range, short product info), so basically this is a table with 120 rows and ...
0
votes
2
answers
475
views
What are components more important in a Login interface - System?
I made a system web for administration information and my customer solicit me a interface elegant and professional and like he is a people older and he doest not knows a lot about how to workings ...
1
vote
1
answer
77
views
What should I do to get user know about scrollable content in the project/course
The project I am making has tables in it. I am working on responsive now. Big tables that do not fit in a small device, I have given them vertical scroll.
So my tables look like this in desktop
and ...
2
votes
1
answer
1k
views
Responsive secondary and tertiary navigation
I'm working on a responsive Product Customization feature for an e-commerce website that has a hamburger primary nav, but will also need a secondary navigation for selecting the main Customization ...
1
vote
3
answers
233
views
Is it bad practice to direct a user to a mobile friendly side of the site on screen resize
I have an html5 application that consists of two different interfaces. The desktop interface demands a minimum of 900 pixels in width to function properly. The mobile version is built in an entirely ...
0
votes
1
answer
167
views
Why are there no large-scale responsive templates for admin sites?
I have to change an old ERP system (typical private admin site) interface to be more modern and responsive. I’m not a designer but a developer with some frontend experience so my plan was to buy a ...
0
votes
3
answers
156
views
Is there data to show mobile users bouncing from desktop sites?
Owner of a company I'm helping is not happy with the current responsive Bootstrap view shown to mobile users and wants to disable it, showing them the desktop site.
I have a feeling that it may hurt ...
0
votes
3
answers
394
views
Responsive images for 3 different types of screens : Is this a good design?
Above image is a wireframe layout of my portfolio website. The navbar is at the bottom while the 2 images fill the remaining screen. The left and right picture will be contained in their own DIV (...
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
...
2
votes
2
answers
120
views
Is it a good practice to extract some menu items from the main navigation on medium sized screens?
A designer I work with often creates a navigation for websites that looks like this on different screen sizes (mobile, tablet, desktop):
On small screen sizes (mobile):
there's a burger menu holding ...
1
vote
2
answers
108
views
Is there a particular name for this design element?
I have seen a lot of magazine/news templates that basically stick a set of posts together and they usually span 2 rows and 3 or more columns.
The best I can think of is maybe calling it a collage, ...
3
votes
4
answers
270
views
Why web apps do not consider high resolution screens in their designs? [duplicate]
Have a look at the image below, this is how Youtube will look when someone opens on high resolution screen.There are empty space on both sides and I have checked this with many popular web apps, same ...
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 ...
1
vote
2
answers
3k
views
Best practices for image aspect ratios
I understand my image sizing should be dictated by other factors but I was curious if there were any standards for image aspect ratios in responsive web design. i.e., 1:1 or 3:4 which reflects the ...
0
votes
1
answer
130
views
Design was made to look perfect at full and fixed width, how to deal with it on wider screens?
A website design has been provided to me which I should turn into a HTML page.
But here is the catch:
It was made to only look good when taking full width (it has a slideshow, and also a horizontal ...
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 ...
1
vote
2
answers
286
views
Image size high-fidelity prototype
What is the resolution and image size to use for high-fidelity UX prototypes? I am supply images to someone doing a UX design for smartphones-iphone and android, tablets and desktop--I am wondering if ...
1
vote
2
answers
1k
views
Is it logical to use tables for responsive web design in 2018?
As the title says I was wondering whether using tables for responsive web design still a thing in 2018?
What are the pros and cons if I do use tables instead of semantic markup apart from SEO?
0
votes
3
answers
314
views
Best way to represent hundreds of rows - marketing calendar
I am creating a UI similar to a marketing calendar. But it has hundreds of rows, each row showing a bar that represents how long the process took. So the table header represents time (weekly, monthly, ...
0
votes
2
answers
733
views
Best practice for responsive vertical side menu
If we have the classical vertical side menu (on the left) for desktop:
then, what is the best practice for displaying it responsively, especially when there's quite a few menu buttons?
To hint you ...
0
votes
1
answer
526
views
How to use anchor tags in mobile?
In the above image top navigation bar and left sidebar is fixed. When I click on the option 6 it will jump to a section 6. So, the problem I'm facing is how do I translate this view into mobile?
3
votes
1
answer
892
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 ...
0
votes
1
answer
92
views
What would I call this element? [closed]
I am trying to create a card that has a position absolute show more div option. I need it to not move any other elements and be responsive. I don't know how to do a search for it because I don't know ...
17
votes
5
answers
6k
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 ...
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 ...
1
vote
1
answer
287
views
Should a responsive website have the same breakpoints for every page or can they be different for each page?
I'm designing a responsive e-commerce website. I'm wondering if every page of the site should have the exact same breakpoints or not. Since pages like Product detail page, account page, shopping cart ...
0
votes
2
answers
1k
views
Usability issue when resizing browser window on responsive website
As I was discussing about the benefits of using responsive web design (RWD) nowadays, my manager said that one of his biggest gripe is the fact that horizontally resizing the browser window often ...
2
votes
1
answer
130
views
Sidebar Ads in Responsive Layouts - How to make happy both advertises and readers ?
I have a blog and I make money from advertisements.
Currently, Advertisements are displayed on the sidebar only because I don't need to disturb readers when reading articles.
There are two 300*250 ...
20
votes
6
answers
141k
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 ...
0
votes
2
answers
126
views
Difference between mobile site and web responsive? What should be the approach?
There are so many sites that work on m-site particularly like makemytrip
but one the same side, there are products that are web responsive which are manipulated using the CSS media queries.
One of ...
1
vote
3
answers
2k
views
Hover over web images for additional details best practices
I know that a discussion was already made on various places whether it is good to use hover on images on the web or in mobile apps. With the rise in mobile use where touch is prevalent do you think ...
1
vote
1
answer
654
views
How to display a CTA on mobile
With the CTA on my site instead of just saying 'See More' or 'Learn More' I've tried to be more specific as in it relates to the content.
For example I have this one CTA that says 'Plan your wining ...
2
votes
3
answers
4k
views
What is the "desktop" alternative for a material design full-screen dialog?
The material design spec for full-screen dialogs says the following about full-screen dialogs:
Mobile only: Due to limited real estate on mobile devices, dialog content appearing in other form ...
3
votes
3
answers
474
views
Best wireframing breakpoints to work with new frontend developer
I've searched tons on this topic, e.g.:
https://medium.freecodecamp.org/the-100-correct-way-to-do-css-breakpoints-88d6a5ba1862
https://graphicdesign.stackexchange.com/questions/39433/what-are-best-...
0
votes
2
answers
138
views
Expectations around developing with responsive design
My company is currently looking at revamping a complex back-end financial operations application that is delivered through a browser. The user base is restricted to employees who are business ...
2
votes
1
answer
607
views
Responsive Design: How to balance content with uneven column width to arrange itself in horizontal layout
How can I arrange the data in a horizontal layout so that it manages increase in column widths. How can you manage such situations responsive design.
I want to make sure:
Something that is ...
2
votes
1
answer
3k
views
Best way to show tables on mobile and tablet common dimension
I have a visual problem that breaks usability in my opinion.
I'm using Twitter's Bootstrap V.3 and I have a web form.
I must show a table with this information:
City, Address, Latitude, Longitude,...
1
vote
2
answers
992
views
E-commerce product page thumbnails: Vertical vs Horizontal?
For an e-commerce product detail page, is it better to have the item picture thumbnails laid out vertically to the left side of the main picture, or laid out horizontally to the bottom of the main ...
1
vote
1
answer
236
views
Responsive design related to tiles
We have a screen which displays tiles and on each tile there is at least one field. Currently the tiles allow a maximum height of three rows of fields and an unlimited number of columns. The user is ...
4
votes
1
answer
4k
views
Pagination Vs. Infinite Scroll in Datagrids
Pavination Vs. Infinite Scroll in Datagrids
Are there any research findings or papers or usability testing findings on Pagination Vs. Infinite scroll in a datagrid. I am trying to define UX patterns ...
3
votes
1
answer
821
views
Improve line graphs on responsive mobile view
I have tried to looking for best practices on charts, especially line graphs viewed on mobile devices and seems like there isn't much information about it.
This is my first project involving charts ...
0
votes
1
answer
215
views
How can I make a mobile app responsive for desktop? [closed]
I am trying to make a desktop version of a mobile app. But not sure how to fill those full width cards to a desktop app.
4
votes
2
answers
201
views
Can we have tab bars in mobile browsers(Swipable)
I have a website which has tab bars in the desktop version.
So when i make it responsive should i retain tabs or should i replace it with som other elements.
Mobile users tend to swipe to change bars ...
0
votes
2
answers
410
views
Best way to present incredibly detailed table? [duplicate]
I'm trying to present a table on my site. The table is incredibly data heavy and can differ product to product.
The table needs to work in a responsive manner but still remain legible.
Can anybody ...
0
votes
1
answer
496
views
Visual designs for multiple screen sizes [duplicate]
We are designing a website for desktop and tablets, which needs to work for 1366x768, 1024x768, 1920x1080, 600x1024, 1600x900 - the most common resolutions as per Stat Counter Global stats in India. I ...