Questions tagged [page-layout]

Page layout is the part of graphic design that deals with the arrangement of visual elements on a page.

Filter by
Sorted by
Tagged with
0 votes
2 answers
118 views

What's the name of this element?

Consider the part in black right above the navigation header. I always knew it as "supra-header," but every time I mention it, nobody seems to know what I'm talking about, so I guess there's ...
Devin's user avatar
  • 37.9k
1 vote
1 answer
110 views

Improving readability and optimize space

I develop simple web applications for my hardware projects but I'm neither a web designer nor a graphic guy. Hence my pages are often awful and not useful. Let's see an example. Here my page to ...
Mark's user avatar
  • 113
0 votes
0 answers
55 views

Complex table design based on diagram selection

enter image description hereI am building a web based tool to manage car repairs. The user would select an area of the car and a part from a list of supplied parts. They would then select what they ...
Ryan's user avatar
  • 1
1 vote
1 answer
32 views

How to cater to 2 different audiences in1 page

I'm working on 1 site page that is for both Enterprise customers and Communications Service Providers. We sell the same offers and solutions to both but we need to use a different language for each. ...
lofish72's user avatar
0 votes
2 answers
52 views

Should options like "privacy policy" and "terms of conditions" be part of the sidebar menu options?

I currently am redesigning a sidebar that appears when the user clicks the top right corner. Currently, it displays user profile information along with some menu options. Personally, I feel that "...
Gene's user avatar
  • 1,315
1 vote
4 answers
213 views

Arranging digital form answer options: Side by side or stacked?

I am currently working on digitalizing a form which throughout has a lot of questions where the answer is either "Yes" or "No". My main question is which one is the better UX ...
mxds's user avatar
  • 31
1 vote
1 answer
170 views

Why does Amazon NOT fill the entire page width with products [duplicate]

Amazon seems to try show you as many options as possible, each being an attempt to get you to click on something to buy. However I was surpised to see they limit the page width, in the image below you ...
run_the_race's user avatar
0 votes
1 answer
701 views

What are the most common screen and browser width/height sizes to handle in order to cover common devices and browsers (i.e. both web and native)?

Question I have a library that I implemented to use in my frontend projects. (Details are not much relevant, but just in case you may wonder, they are provided below in the Background Info section. I'...
Mehmet Kaplan's user avatar
1 vote
2 answers
91 views

Course page with multiple registration options

I'm designing a website where people register for courses (online or physical/in-class). The difference with other websites is that every course may have multiple registration options (multiple sign-...
Shahriar's user avatar
  • 318
2 votes
1 answer
110 views

How do I solve the two column layout challenge for question and answer sections?

Overview We have a platform where students can take an online assessment anytime and anywhere. We offer this online assessment mainly for English, Science, and Math subjects. The students need to ...
Constantino's user avatar
0 votes
2 answers
77 views

Smooth transition of site divider [closed]

On the https://gif.com.ai/ splash page there is a site divider on the left half of the page that when scrolled abruptly disappears and reveals a full-page navigation. To me and others this feels ...
Chamilyan's user avatar
  • 146
0 votes
1 answer
578 views

UX solutions for data tables and alignment on large screens

I see a lot of excellent advice here regarding how to build mobile-responsive data tables. However, when it comes to large viewports, I'm not finding much. In general, I'm lost about what could be the ...
struensee's user avatar
2 votes
2 answers
2k views

Is Cumulative Layout Shift a consideration while the page is still visibly loading?

Cumulative Layout Shift (CLS) refers to unexpected change in the position of content on a page, and usually happens because resources are loaded asynchronously or DOM elements get added to the page ...
hb20007's user avatar
  • 175
0 votes
1 answer
377 views

Which is the best way to edit a row in a data table? [closed]

I need to design a mockup that consists of a data table featuring crud operations. I want to know the best way to design this: Using inline editing? Using a pop-up? Using another page?
nelida murataj's user avatar
1 vote
2 answers
141 views

What layout for a nearly empty web app? [closed]

Context I am designing an ad hoc enterprise web app that is very simple: given two parameters (year, month), click a button that generates and let you download a file (an Excel spreadsheet). Users ...
ebosi's user avatar
  • 121
2 votes
1 answer
158 views

Handling long text in width-constrained layouts

I'm working on an application in which there are occasionally single-word strings that need to be represented in a box that isn't wide enough to contain the word unbroken: The example above is in ...
duhaime's user avatar
  • 247
-2 votes
1 answer
384 views

Portrait vs Landscape Mode [closed]

Portrait & Landscape layouts - What is the UX guidelines for making two distinct layouts i.e. where the layouts will be significantly different from each other.
SDB's user avatar
  • 1
2 votes
1 answer
210 views

Guidelines for layout of component that can have variable sub components

I've been asked to design a component that lists objects on a page. The component needs to be able to display between 3 and 6 numbers of objects in the list. Here's what I have for 6 objects in a list:...
colmcq's user avatar
  • 8,240
0 votes
1 answer
121 views

Where to access archived items/lists given this layout

I have an application layout with no side navigation. It just has a horizontal navigation with 5 tabs (some are greyed out). Each tab is really it's own module. I have a todos module where a user can ...
A.com's user avatar
  • 151
1 vote
2 answers
387 views

Best Practice for Vertical scrolling through long collapsible submenus

We're redesigning some of our landing pages. In this case each landing page has 6-8 course categories each of which contain 3-4 courses by date, time and price. Each course has a CTA button and is ...
T0urist's user avatar
  • 13
3 votes
2 answers
361 views

What is the best way to design a 'debt' screen

So I've been searching for this, but I think Google thinks I want to know about 'UX debt'. The thing is, I've been assigned to design a new screen for when our customer hasn't paid for the service. ...
CH4B's user avatar
  • 133
-1 votes
2 answers
114 views

Making pages without images interesting [closed]

I am currently designing a web application which, long story short, takes extracts data from an existing system and transforms it into posts which are sent out to employees. Basically, the existing ...
Niwith's user avatar
  • 1
0 votes
1 answer
145 views

How much space should filters take on left side of page [closed]

I am designing a web interface where we have filters on left side and search results on remaining page. How much page's space should left filters take? Any percentage?
ammu's user avatar
  • 113
1 vote
2 answers
251 views

Focus style accessibility - Is colored underline enough of a change?

I am currently assessing styles for accessibility for a project onto which I am working. Overall, the layout has a black background (#050000) and text and components are either beige (#FEF0D6) or ...
jansensan's user avatar
  • 121
7 votes
1 answer
1k views

How to best improve information density for long, complex forms?

How to layout long, complex forms such that the largest possible number of fields is visible on the page, but legibility is maintained? I am re-designing an enterprise web app where there are a total ...
Lukas_T's user avatar
  • 307
3 votes
2 answers
3k views

Displaying multiple tables with varying numbers of columns

I am trying to design an enterprise application and I have a situation where I have multiple (More than 20) tables to be displayed in the page as a result of user interaction. I cannot limit the ...
Vikhyath Maiya's user avatar
-2 votes
1 answer
120 views

Design/development frameworks equally suitable for both desktop and mobile views

I am quite a new to (or way too old for) a modern HTML, and i had to develop simple UI. I need to support 2 types of screen in it: So UI consists of a menu, and content, for instance, a text with a ...
xakepp35's user avatar
3 votes
2 answers
602 views

Design settings page for wide layout?

My web app has a settings page. It's pretty normal: some broad categories on the left, then pairs of option-name - option-value settings on the main right-hand section. Works OK. However, on a full-...
mappu's user avatar
  • 39
2 votes
1 answer
70 views

How could I make this sheet more intuitive?

I recently wrote an open-source application that lets you practice Chinese writing and the decisions I made about its inner workings were related to my theories of how human memory works. I'm not sure ...
d33tah's user avatar
  • 345
0 votes
1 answer
1k views

Why YouTube looks different on Safari [closed]

I am a Mac user and Chrome is my default browser. I think to give Safari a try and after using for some time I realise that YouTube looks different on safari compare to Chrome. Here is a small ...
CRDave's user avatar
  • 103
256 votes
16 answers
104k views

Why do people not notice our enormous, prominent, clear and contrasting purple banner?

I'm part of a MediaWiki site called D&D Wiki. Among others, one of our longstanding issues in the public eye was our failure to label clearly enough that certain pages are categorised 'Homebrew', ...
user avatar
2 votes
1 answer
138 views

Perception of progress - number of pages

I'm at the very beginning of redesigning a checkout/bag page and had a thought about how people perceive their progress through a form based on the amount/lack of pages. Currently we have a bag page ...
sclarke's user avatar
  • 1,885
0 votes
1 answer
41 views

Mobile view layout ordering

I'm confused about one of my eCommerce project product details page ! I couldn't understand am I keep right sidebar on top in mobile ? Now its after logo. Moreover I want to keep social media and ...
Momin's user avatar
  • 129
0 votes
1 answer
57 views

Is it useful to have navigation/location labels and the page title duplicating information?

Navigation already tells you where you are. Do we need a title? Is it useful or is the title information just increasing interaction cost? Example:
richard's user avatar
  • 3,234
0 votes
1 answer
99 views

Solution to layout of a large productivity app

In planning the design of an enterprise web app with a large number of pages, I am trying hard to keep the layout clean with a lot of white space and as little clutter as possible. With this, I would ...
dthree's user avatar
  • 305
2 votes
2 answers
888 views

Main navbar and sub-navbar

I have a website that has a main navbar (shown as the top/white navbar in the image). Of the top navigation links, one of them takes you to another page that is much more customizable and offers many ...
sej's user avatar
  • 23
16 votes
1 answer
5k views

What is the name of this practice when a page loads?

It seems that some basic elements take their position quite quickly: and then others follow to form the final page: update (Apr 2018) I've noticed that youtube is also doing this...
tgogos's user avatar
  • 263
2 votes
2 answers
2k views

Placement of anchor link buttons in a page with a lot of scrollable content

I am building a profile page (http://giga.brandvertisor.com) containing a lot of of information, visually organized in horizontal sections. For the sake of easier navigation, I have put anchor link ...
drabsv's user avatar
  • 391
1 vote
2 answers
141 views

Why do designers draw graphic layouts without device resolution constraints? [closed]

I am front-end web developer based in Europe. I just begun working remotely with team from USA. I am not a graphics designer. So far when I was cutting and embedding graphical layout into HTML and CSS ...
Marecky's user avatar
  • 113
0 votes
3 answers
958 views

Options for card layout on website

I am creating a screen which displays courses. Currently, I am using card layout. Here each card displays a course name, and a button .on click of that button, a form will open in a modal window where ...
Angiras Joshi's user avatar
1 vote
1 answer
439 views

Documentation in one page or different pages?

What way should the documentation of a site be, all in one page or split into different pages? Since I think it is relevant, this is my project documentation right now, a library for Node.js ...
Francisco Presencia's user avatar
3 votes
3 answers
295 views

Best way to organize items by use frequency

My site contains a page with boxes, of varying sizes, that can be rendered in any order on a grid. Overflow goes to the next row. I have been instructed to design a system wherein the order the boxes ...
Simon's user avatar
  • 133
2 votes
1 answer
100 views

Side to side comparison in mobile

Amazon has this feature to compare most helpful positive and most helpful critical reviews side by side when viewed on a pc (not from mobiles). I assume for mobiles this is impractical because the ...
TMOTTM's user avatar
  • 123
9 votes
3 answers
1k views

Should I keep my website logo always visible?

I'm building a website for a new company and right at the homepage there is a main action where users need to select wich city they are located in order to show specific results, which depends on the ...
CelsomTrindade's user avatar
2 votes
2 answers
133 views

How to display a label-field with multiple pieces of data

Let's say I have a details page that lists various pieces of information taken from a form. This works fine when I have a single attachment (link) per field. However, let's say the user can attach ...
Monica S's user avatar
11 votes
5 answers
26k views

What's the recommended max width for the main container and for the main column, for large screens?

Based on this question, "Why do many sites leave half of each webpage empty?" and its comments and answers, I did some research, but I didn't find a complete answer. For me it is obvious that it is ...
Madalina Taina's user avatar
2 votes
1 answer
58 views

Users are not scrolling below full page image, but clicking on nav links

I have a typical page layout with a header across the top of the pages containing a logo on the left and nav on the right. The homepage starts with some intro text (which takes up most, but not all ...
Markeee's user avatar
  • 121
1 vote
1 answer
198 views

What are these "badges" called?

They're usually used to tell the user that a list is empty, or a resource could not be found, or that a resource may be unavailable. SoundCloud has one here for tracks without any comments: Or if ...
Sebastian Olsen's user avatar
4 votes
2 answers
113 views

Is it a bad idea to move the content on the right of the page?

I recently discovered a blog which has an original layout: The left half of the page contains by the name, two menus, the social buttons and the copyright. Most of the space is not used, and is ...
Arseni Mourzenko's user avatar
1 vote
2 answers
115 views

Best way to approach statistics pages

In general what is the best way to approach a statistics page. Not a dashboard, but a page showing a number of numerical stats with labels. Say for example, there are around 10 numerical stats that we ...
David Saunders's user avatar