Non-scientific poll: Layouts - Left, Center, Right

April 07, 2004 | View Comments (47) | Category: Design

Summary: What the title says.

In the planning stages of the mega-ultra-uber-crazy-awesome redesign the thought of site positioning came up. Most layouts are centered nowadays with a couple going the left route. I have only come across 3-4 right aligned sites. I do not really like the right-aligned that much because it always throws me off. Now I am being drawn towards left-aligned (for no apparent reason). I used to dislike the left-aligned bit because I despised the space that filled the whole right half of my screen. Now it's not that bad.

What do you like and why?

Trackback URL: http://9rules.com/cgi-bin/mt/mt-tb.cgi/200

Comments

#1

Depends on the type of site. And more importantly, where the navigation's at.

If the nav's on the left, I want it left aligned. If it's on the top, center is OK. If it's on the right, it's probably a blog... centered or right aligned or full width is all ok by me.

I tend to design with a left aligned weighting, though I've done a couple of centered things, mostly when playing with CSS stuff.

As for the whitespace filling up half your screen... I'd guess the reason you don't mind anymore is that bigass monitor... you're *used* to seeing lots of empty space on webpages now, so the space from it being left aligned doesn't seem as extreme. :-)

JC (http://thelionsweb.com/weblog)

#2

I guess I have just gotten used to all of this lovely space on my extra big monitor.

Your logic is interesting about how the alignment effects navigation. Never thought about that.

Scrivs (http://www.9rules.com/whitespace/)

#3

You stated you were going to really step over the line of craziness by incorporating photos - oohhhh..., do you dare? ;)

I think some sites which incorporate photos, (like in the banner for example), work better visually left-aligned - but that really depends on the general layout.

It would be an easier call if you provided a mock-up of your design.

Mark Fusco (http://www.lightpierce.com/ltshdw)

#4

I just read this article linked to by eric, and while I guess it's not really right aligned (it's not a fixed-width layout), the content of the article was on the right. This in itself didn't bother me too much, but the total lack of margin did! I kept thinking the content was extending past the right end of the page (it wasn't), and trying to find a scrollbar.

Ok, so maybe that example wasn't terribly relevant to this discussion. :)

Anyway, I almost never browse with a maximized browser (unless I'm working on a monitor with a low resolution), so the only time I really notice the alignment very much is when the content is in a very narrow column or when there's not enough margin between the content and the side of the window (in which case it feels like the content is being crowded up against the side).

So I guess maybe my earlier example was somewhat relevant. Any alignment is ok, so long as the content isn't really narrow and there's enough of a margin.

Jennifer Grucza (http://jennifergrucza.com)

#5

Mark: This is just a basic discussion that really has nothing to do with the mega-ultra-uber-crazy-awesome redesign of death!!!!! Just curious as to what people like.

Scrivs (http://www.9rules.com/whitespace/)

#6

Jennifer: Yes, the padding is definitely lacking there. Couldn't even attempt to read it.

Scrivs (http://www.9rules.com/whitespace/)

#7

I'm planning a re-design too and I've noticed a lot of designers weblogs are centred and fixed width (including your own). Can you (or one of your readers) give give us some specific examples of left-aligned layouts? I'd be interested in comparing them with the better centred ones (eg Asterisk, Simple Bits, Whatdoiknow, yours).

To end this comment, check out Paul Ford's new design for a radical use of horizontal space:
http://www.ftrain.com/

Interesting 'cause it's so different.

Richard MacManus (http://www.readwriteweb.com)

#8

I prefer centered, I think, but only because I have a thing for symmetry :)

theresa (http://www.dandelionwine.org)

#9

I like centered sites for heavy reading. For short clips of text I don't mind left aligned.

I don't remember seeing many right-aligned sites except that one you posted in the Vault (the name escapes me now).

Todd (http://www.monkeyhouselounge.com/loungeact/)

#10

Ok. Then I would say that I think blog type sites that have typically long posts and certain types of photos or graphics work better left aligned - generally.

It's a tough question to answer, it really depends on the design / content as to which works better.

Mark Fusco (http://www.lightpierce.com/ltshdw)

#11

If you look at this site, for example (since we're talking in general terms) when you get down here to the comments below your google ads it's left leaning anyway. Why not push it all the way to the left, increase the horizontal spacing for posts / comments and push the navigation to the right. There would still be the same screen space taken horizontally, but less vertically.

Mark Fusco (http://www.lightpierce.com/ltshdw)

#12

I just switched from centred to left-aligned. I wish I knew why. I think left-aligned is possibly better for 'busier' sites... centred for minimal designs...

Gordon (http://www.snowgoon.co.uk)

#13

Web-Graphics is a right-aligned site.

Scrivs (http://www.9rules.com/whitespace/)

#14

Centered seems to be preferred because a lot of people browse full screen and a balance of white space is more pleasing to the eye than an offset block.

Left designs are natural because english is read from left to right, so our eyes are used to starting out at the top-left of a "page". Go look at sites in arabic or hebrew - they usually align right.

Fluid design, if well executed, can solve the browser window size dilemma. Executing it well means keeping the lines of text a reasonable length and ensuring the layout doesn't get funky at very large or very small sizes.

A mix of fluid and center/left/right alignment is also possible, adjusting the margins accordingly. Min/max width in your CSS is useful for this, except for IE users.

I tend to design fluid with a layout that is weighted on the top left.

I do not browse full screen and I hate horizontal scrolling.

Jon

#15

I also prefer fluid designs but when not fluid I gravitate towards centered layouts and always like the nav bar (if any) to be on the right. It strikes me that if there is to be a vertical navigation system, it should be on the right as that is most likely where the users cursor will be anyway due to the scroll bar. In the end the content is king and anything is good (except the example posted by Jennifer!) if the content is worth hanging around for.

Adrian Rinehart-Balfe (http://www.boogenstein.com/)

#16

The only reason my web site is left aligned is to allow people to resize the browser window to whatever width they prefer, and in doing so, not really move anything. With centered designs, there can sometimes be this weird re-adjustment while resizing the window and having the content move to its new centered location.

Also, I tend to keep most of my windows on the left side of my screen, so I can keep aspects of my desktop visible with icons and stuff to work with on one side of the screen. Left aligned always felt more natural to me in this configuration.

I kind of hope the trend doesn't return to left-aligned web sites. I kind of like the fact the DxF looks visually different from most blogs out there, mostly becuase it is left aligned with three primary colors as the background. Too many blogs are starting to all look much too similar.

Andrei Herasimchuk (http://www.designbyfire.com)

#17

Left alignment has one big thing going for it... the navigation (if on the left) is always in the exact same place in relation to the upper left corner of the browser window. People who've been online for a while know to expect the upper left corner of most websites to contain a logo or something which when clicked takes them to the homepage, and that if they see a bar down the left side, it's probably the site navigation.

Even on sites that are centered, it's not really centering... it's just a lot of extra left and right padding... you're still working on a left or right or full alignment, just within the confines of a box.

JC (http://thelionsweb.com/weblog)

#18

uh, in other words, what the right honorable Andrei just said, for the most part. He beat me to it by a minute. :-)

JC (http://thelionsweb.com/weblog)

#19

Browsing with a smallish window, the webgraphics site looks fine. But with a maximized window, I find it a bit disorienting.

Jennifer Grucza (http://jennifergrucza.com)

#20

You're not changing your site name are you? You are still going to be called White Space? To me, white space is not what's on one side or the other, it's the area around text: margins and padding and the like.

A centered layout such as what you have here epitomizes your name.

Jason (http://izzywizzy.org)

#21

Left and center for me. Right seems fun for personal sites, but real-world applications seem minimal.

Lea (http://xox.lealea.net/)

#22

"Web-Graphics is a right-aligned site."

Are you sure you know your right from your left, Scrivs? It will help you a lot if you do :-)

I have a right-aligned site. Used to be centred, but I fancied a change. I don't think it make a lot of difference so long as the lines are not too long to read. As someone said, it all depends on the rest of your page design as to which fits best.

Going slightly off-topic, I use % widths instead of pixels, so it always fits on the screen. I don't see anybody else doing that. Has anyone got a good reason not to? I also hate scrolling horizontally.

Peter (http://www.mouldingname.info/home.html)

#23

I cant cope with right aligned sites. It really knocks me off balance. And that is a usabiliy issue if I have ever known one.

Left and Centered help with the natural flowing of English reading. So I think they are the best for now.

Full width is ok, but with a high res (1600x1200) it can become too much some times, and I will only end up resizing my window till it looks nice.

Phil Baines (http://www.wubbleyew.com/blog)

#24

Erm, Peter, Web-Graphics IS a right-aligned site!

If not, then what browser are you using?

Phil Baines (http://www.wubbleyew.com/blog)

#25

Here's a great right-aligned site, or would you call it centred?

Peter (http://www.mouldingname.info/home.html)

#26

"Erm, Peter, Web-Graphics IS a right-aligned site!

If not, then what browser are you using?"

It's left aligned for me in Opera 7.23

Peter (http://www.mouldingname.info/home.html)

#27

Peter, perhaps you're confusing right aligned text with having the content of the site riding the right edge of the screen instead of the left or being centered. Scrivs' site would be right aligned if he moved the central box to the right instead of the center.

JC (http://thelionsweb.com/weblog)

#28

For reading, I'd say the main text somewhere near the center... if it's aligned somewhere it's not so much the space on the other side that's the problem but the having to turn your head and not looking forward while reading thing is.

So the navigation can be anywhere, as long as the interesting stuff is somewhere near the middle. I'm lazy in that..

Jadwigo

#29

Are we all talking about the same thing here?

By right-aligned, I mean the main content is towards the right of the page.
By left-aligned, I mean the main content is towards the left.
Centred, means the main block of text is in the centre.

Almost all text should be left-aligned in the sense that the right side is jagged and the left is straight. If both sides are jagged or if the left is jagged and the right is straight, I find it very difficult to read.

Peter (http://www.mouldingname.info/home.html)

#30

Hmmm...it's right-aligned in Opera 7.11.

I also noticed those b***ards at Opera took your interface design for Forever Geek to use for their "about" page under the help section - can you believe that?

Mark Fusco (http://www.lightpierce.com/ltshdw)

#31

Peter -

Imagine a block on a page. There's left aligned text in the block. If the block is to the left, it's left aligned. To the right, right aligned. centered, centered, 100%, full. That's what we mean. I'm not sure what you're seeing. The content area/box of the web-graphics page is clearly right aligned. The link you presented above as an example of right aligning is clearly centered, though some of the text in it is right aligned, which is why I thought perhaps you were confusing the context.

JC (http://thelionsweb.com/weblog)

#32

heh. that's funny, Mark. Maybe we found out where Scrivs got his inspiration from? it's a lighter blue than forever geek, but they definitely have a similar feel.

JC (http://thelionsweb.com/weblog)

#33

What page on the Opera site are you guys talking about? I never even visited the opera site this year. Hell I don't even use that browser.

Forever Geek was probably the only site where I didn't use inspiration from anybody. The simple design was easy enough coming up with on my own :)

Peter: Fluid sites aren't left-aligned or right-aligned. Fixed widths sites (700px for example) where the whole site is on the right side of the screen is considered right-aligned by me.

Scrivs (http://www.9rules.com/whitespace/)

#34

It's not on the opera site, it's in the opera browser. If you open opera (7, at least) up and choose "about" it takes you to a page that feels familiar.

JC (http://thelionsweb.com/weblog)

#35

My preference (best to worst):

  • center
  • left
  • full width
  • right

  • I don't know why, that's just how I prefer it to look at web pages.

    Joseph Lindsay (http://www.josephlindsay.com)

    #36

    Wow. No really. Wow.

    Scrivs (http://www.9rules.com/whitespace/)

    #37

    If you have Opera or other browser at 1024x768 and have the bookmarks sidebar open on the left, then go to Web Graphics website, it looks like the main content is left-aligned, but if you get rid of the sidebar, then, yes, I see what you mean, the two blocks are right-aligned but with the wide bit in the middle.

    Perhaps having the history or bookmarks sidebar open makes a bigger difference than we think? I usually have it that way, perhaps you guys don't?

    Peter (http://www.mouldingname.info/home.html)

    #38

    Why must it be all or none? My poor site www.drusellers.com is floated off center to the left. I liked it as a change of pace and still do. Now if I can just get off my butt and make the site look pretty.

    dru (http://www.drusellers.com)

    #39

    It depends on how I feel at the moment. However, the idea of a right-aligned site has intrigued me as of late, and I use it in a coming project.

    Chris Vincent (http://dris.dyndns.org:8080/)

    #40

    It doesnt need to be, Dru. Actually, sites that are off center a bit usually look good... and you have to have at least some padding on either side

    JC (http://thelionsweb.com/weblog)

    #41

    Personally, I can't say I care that much.

    I don't struggle with right aligned at all!

    Jenni (http://www.pixelscripts.net/)

    #42

    If Filmmakers Were Web Designers II

    Dear Mr Antonioni:
    I recently screened your classic film, The Red Desert, starring Monica Vitti and Richard Harris. I have a problem with the way you used screen space. My theater’s screen is big and wide. It is capable of handling many actors at the same time. For instance, crowd scenes and battle scenes work well. But in your movie there are only a few actors — and many times they are pictured in one corner of the screen or another, against a stark minimalist background. This is a terrible waste of screen space. For instance, there is one scene where Ms Vitti is filmed on the left side of the screen and there is a white forest behind her. The white forest is not much to look at. Sure, I can look to the left and watch Ms Vitti’s performance, but what do I see when I squint my eyes and look only at the right side of the screen? Not much! I urge you to add extra characters and situations to your movie so every inch of my screen bursts with action at all times.
    Sincerely,
    Howard Gumpf

    Radley Smith (http://yayforgecko.net/)

    #43

    Never left-aligned. Looks too much like you didn't bother to think about alignment and invariably looks silly for fixed-width sites. Centre-aligned for corporate sites. I'd like to see right-aligned here. It adds character & quirkiness and makes your site stand out in a good way, if you can pull it off.

    Bruce

    #44

    right alignment could benefit from the fact that the content is really close to the scrollbar (though this may not be that important anymore due to the scroll-wheel on the mouse) - so it doesn't force you to move your mouse a lot.
    however, as the western culture is used to reading form left to right, we are expecting the content to be on the left side (or at least centered - for symetrical reasons). I would like to see an opinion from a person who's used to reading from right to left.

    in the end, though, i guess it mostly comes up to the design of the site.

    Lucian S.

    #45

    I don't like right-alignment... it just feels weird, since we're a society that reads left-to-right.

    I almost always use center-aligned, navigation-at-top layouts. Sidebar navigation always feels awkward to me.

    Sage

    #46

    Right alignment is so unique. It probably does have disadvantages, but I just love the layouts of web-graphics and left hand side.

    For practical use, though, left-aligned is best. Or centered. It takes all kinds I guess. ;)

    thomas (http://gendes.elivy.com)

    #47

    I can see Right alignment for sites that use a lote of Japanese or Asian writing. That type of writing is read from right to left, so using the right alignment adds tradition.

    Geoff

    Geoff

    Keep track of comments to all entries with the Comments Feed

    Post a comment










    Remember personal info?