Stack Exchange Network

Stack Exchange network consists of 174 Q&A communities including Stack Overflow, the largest, most trusted online community for developers to learn, share their knowledge, and build their careers.

Visit Stack Exchange

A design approach that delivers elegant user interfaces regardless of the size of the user's display or the limitations of the device.

1
vote
3answers
166 views

In Responsive Design, how do you trigger Tooltips? mouse hover isn't there anymore

A tiny disclaimer, not looking for tooltip alternative for mobile as in another UI Pattern, i'm looking for a different interaction that could trigger the tooltip, i hope this makes it clear. The ...
0
votes
0answers
51 views

Sidebar suitable for menu or quick links? [on hold]

what is the best way to use side bar is it suitable for menu of a site which navigates to the whole website or should give the other links like quick links. the website is like combination of ...
-1
votes
0answers
23 views

box width view or full width view? [closed]

which is the most suitable and standard way to design a website out of it? For personal websites which design is best suitable box width or full width . i need suggestions please answer.
1
vote
2answers
41 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 ...
0
votes
2answers
82 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
2answers
64 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 ...
0
votes
1answer
45 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
2answers
65 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
2answers
93 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
4answers
148 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 ...
0
votes
1answer
83 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 ...
0
votes
1answer
252 views

Best way to handle multiple navbars for a products site?

I'm designing a responsive website which has different software products (apps) and one main homepage. Desktop Homepage navbar menu has: Website name (right side) | Apps | About-us |...
1
vote
2answers
555 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
1answer
181 views

Best solution for alert boxes positioning in SPA's (single page applications)

I'm designing my first single page application which is for users to manage their USB dongle for a desktop application and also to create teams and request tech support. This is the wireframe of the ...
0
votes
3answers
116 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
2answers
128 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 ...
1
vote
2answers
727 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 ...
3
votes
1answer
122 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
1answer
85 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 ...
0
votes
1answer
192 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?
5
votes
2answers
545 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
1answer
72 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 ...
3
votes
1answer
61 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 ...
1
vote
0answers
109 views

How to display a two column table with limited data on a wide page?

I am trying to create a table with three columns but there isn't much data to display. There will be a select button, the item name, and the item's detail (which will be very short) What's the best ...
0
votes
1answer
163 views

Forms vs Inline Edition Tables

Before I explain my problem let me give you some background. The way our web application is being built I don't have control at all on the distribution of the inputs of our forms, they are being built ...
1
vote
3answers
207 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
0answers
70 views

Unique Responsive Calendar

I'm working on a project that has a bit of unique calendar need. I've designed a mock-up but need some advice on how to make this responsive and display nicely without cutting off text when at ...
0
votes
1answer
151 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
2answers
78 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 ...
13
votes
5answers
6k views

Font-sizes smaller on mobile, yes or no?

I always have the same question when I am working on a new project and I have to start thinking about responsive design. What do you think about reducing the font-size of the website content from ...
1
vote
1answer
305 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 ...
3
votes
3answers
217 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-...
2
votes
1answer
326 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 ...
1
vote
2answers
261 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
1answer
126 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 ...
1
vote
2answers
165 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 ...
0
votes
1answer
115 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.
0
votes
2answers
409 views

Displaying multiple Sections/Subsections in one page to avoid scrolling

I want to create a layout for web application where the user enters a large amount of information for review in the company. Multiple users can access the same review of company. The user can select ...
0
votes
0answers
190 views

Best practices of displaying multiple sections/subsections on web application for good user experience

I am building layouts for a web application that requires the user to fill in multiple pages of information for review in the company. Same user or combination of different users can be part of an ...
1
vote
1answer
926 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,...
0
votes
2answers
178 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 ...
1
vote
3answers
107 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
1answer
293 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 ...
1
vote
1answer
74 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 ...
2
votes
1answer
453 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 ...
3
votes
3answers
291 views

What is the best way to display user company role and application role when logged in to the application

An application having two roles i.e Company Role and Application Role based on which different sections of the application are accessible to the person. Company Role describes either Admin or Users ...
1
vote
3answers
685 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
1answer
115 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 ...
0
votes
1answer
113 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 ...
5
votes
1answer
305 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 ...