140
votes
Accepted
Why do many sites leave half of each webpage empty?
There are many reasons, but the main ones are visual cluttering and hierarchy of information on one side, and structural consistency on the UI side.
Visual Cluttering
Clutter is an important ...
- 38.3k
86
votes
Why do many sites leave half of each webpage empty?
The optimal line length for your body text is considered to be 50-60 characters per line, including spaces (“Typographie”, E. Ruder). Other sources suggest that up to 75 characters is acceptable.
...
- 9,414
78
votes
Why do many sites leave half of each webpage empty?
There is a reasonable limit in the amount of information the user should see at once.
If the view is filled with more information than the user can assimilate/understand it becomes overwhelming. This ...
- 16.9k
18
votes
Why do many sites leave half of each webpage empty?
Academic studies on white space
Yes, white space is used to increase readability and reduce visual clutter [1], [2].
The more objects are on the screen the more the eye and the brain has to process [...
- 11.6k
18
votes
Why do many sites leave half of each webpage empty?
As a web developer speaking for the sites I've made: we didn't design for large width display. And white space is what defaults when you scale the browser width up (or whatever the CSS background ...
- 288
18
votes
Accepted
How do I handle white space in cards with varying amounts of information?
In these cases, although the excess white area exists, the perceiver tends to place the vision in the center of those framed empty spaces, which further accentuates the lack of content:
To counteract ...
- 20.4k
9
votes
Accepted
Is there a valid reason to allow leading or trailing spaces in user input?
Depends on the type of form input:
Usernames/Emails
Trim away. Especially if you accept mobile input, as some auto-complete keyboards insert a trailing space after emails.
Passwords
As mentioned ...
- 3,858
7
votes
What's the recommended max width for the main container and for the main column, for large screens?
Historically there was some research that indicated content that was too wide became hard to read and thus a standard of 960px was adopted.
However there's a strong emphasis on "reading" width there.....
- 3,722
6
votes
What's the recommended max width for the main container and for the main column, for large screens?
Depending on the kind of content and the way you present it you can show a certain amount of information.
For text there is a certain limit in the width of the container depending on the font size. ...
- 16.9k
6
votes
Why do many sites leave half of each webpage empty?
Because some people browse like me, with the monitor turned 90°.
Other people are on tablets, phones, and Win 3.11 with 640*480 resolution and 8 bit colour. The best websites are generally designed ...
- 1,179
6
votes
Accepted
iPad walkthrough screens have too much whitespace
The problem I'm seeing is that your CTA button is so far away from the icon and headline that they don't seem related. Move the "Get Started" button close to the "Scan bar code" and you should ...
- 467
4
votes
Why do many sites leave half of each webpage empty?
If the content is naturally that wide, then by all means make the page wider. So for example, a large table, would be much more usable if it used as much width as it needed, than by being cramped in a ...
- 1,074
4
votes
Accepted
How to make mobile "list" design does not look crowded?
Maybe this is my personal opinion, but most of the time when I doing very dry content / wall of text content, I'll consider some of this point in my design:
Give them a white space for them to breath ...
4
votes
Is there a valid reason to allow leading or trailing spaces in user input?
I wouldn't blame the user with a validation error if he types a space as the last (or first) character of an input field: if you trim the input once submitted, there won't be any problem.
I cannot ...
- 871
4
votes
What's the recommended max width for the main container and for the main column, for large screens?
The width of a line of type is called a measure. Some typographers consider 65 characters to be the perfect length for a measure, plus or minus 15. Anything shorter and your eyes bounce around too ...
- 71
3
votes
Ad placement - In its own column or content wrapped around it?
From a user perspective, content and non-content should be as distinct as possible. In the mockup on the right I can see some potential for an ad to appear as though it were part of the content rather ...
- 571
3
votes
Why do many sites leave half of each webpage empty?
That design is easily found and changed using bootstrap, the example is here: http://getbootstrap.com/css/#grid-example-fluid
Simple answer for the UI is that paragraph width is comparable to the ...
- 31
3
votes
Start Screen Issue *To much White Space*
Without more context it is difficult to tell, but I will try to give some ideas in case they help.
Take a look at how the timer in Android approaches something similar:
As you can see in the image ...
- 16.9k
3
votes
Design suggestion for a page with two links
In general, I like PhillipW's idea of providing two buttons on the log-in page, but due to the name "Dashboard", I would recommend always taking users there first as a landing page (that's what's ...
- 3,878
3
votes
Accepted
How to utilise empty space in card list design?
White space should be valued highly. In addition to reducing visual clutter; whitespace makes it easier for the eye/brain to focus on the task at hand.
If the entire screen doesn't look as visually ...
- 6,641
3
votes
Dealing with too much white space
If the problem is where to align the container, why using a container?
The containers are used to arrange the information by putting a limit frame, but sometimes they are visual noise, among other ...
- 20.4k
3
votes
Why has extreme padding become so common in web/UI design since 2019?
This question may not be asked in good faith ("just looks ugly and childish"), nor is it particularly accurate, but the answer is probably interesting nonetheless.
Reason 1: Optimal line ...
- 2,598
2
votes
Design suggestion for a page with two links
I think you should use a background image that makes the buttons more visible or you can try something more creative like split the screen into two sections, each with a screenshot of the page ...
- 4,521
2
votes
Design suggestion for a page with two links
I think if you want this page works like this, you only make them more obvious to the users such and more appealing, maybe you could add some icons and a small description.
download bmml source &...
- 1,799
2
votes
Are there any guiding principles for using the Gutter space in web products (websites, mobile sites, mobile apps)?
Gutter space are a part of white space. It can be seen as a tool for designers to bring clarity, guide the users and has other benefits. It is a relevant solution for any device you are designing for.
...
- 1,165
2
votes
Why do many sites leave half of each webpage empty?
I would say field of vision plays a role. You can easily read a piece of paper and the width of the website is about the same size. This way you don't have to move your head as much in the horizontal ...
- 121
2
votes
Why do many sites leave half of each webpage empty?
I was really surprised to see this question and the interest for the subject. This seems to me to be part of the old debate around the question "Is white space wasted space?"
I think this is ...
- 4,521
2
votes
How to make a screen with tons of whitespace not look awkward
Firstly, I do not recommend placing a save button just to be consistent. You will confuse your users - functionality over aesthetics. You can keep consistency without having a save button on each page....
- 7,423
2
votes
Whitespace versus content
You should try to avoid these discussions, they will not result in anything valuable. Instead, either make it a user choice by providing a switch, or test it with real users.
As with most such ...
- 610
2
votes
Whitespace versus content
It sounds like each row holds "a few buttons" and you're going to need the right amount of space to make sure that the user doesn't accidentally click the wrong button by mistake, especially if they'...
- 12.9k
Only top scored, non community-wiki answers of a minimum length are eligible