Skip navigation
Currently Being Moderated

Optimum size of design layout

Dec 30, 2012 12:45 AM

Back in the Mesozoic era of the internet it was recommended to design you site to be 800 px wide max. However since then screen resolution has dramatically increased.

 

I also note that in my own reading habits that I seldom read a web page at maximum size because the Thunderbolt monitor (2560 X 1440) I use makes the page too big and I reduce it to half the size if I am going to spend any time on that site.

 

So taking into consideration that people may not read a web page at maximum size what would be a safe size to design for?

 

VL Branko

 
Replies
  • Currently Being Moderated
    Dec 30, 2012 9:03 AM   in reply to VL Branko

    I've been designing at 950 pixels wide for quite a while and that seems to work for everyone. It also seems consistent with other sites.

     

    I don't get complaints from clients about width, but I do on height. Because, like you, I work on monitors that are larger than most other people use, I can fit a lot of vertical real estate on my screen, but I've gotten complaints when important page elements drop below 400 pixels.

     
    |
    Mark as:
  • Currently Being Moderated
    Dec 30, 2012 9:51 AM   in reply to VL Branko

    Owing to the various types of devices that people are using to surf the internet, the trend now is Responsive Web Design:  targeting various device widths (mobile, tablet, desktop) with CSS Media Queries. 

     

     

     

     

     

    Nancy O.

     
    |
    Mark as:
  • Currently Being Moderated
    Dec 30, 2012 11:33 AM   in reply to Nancy O.

    Nancy, regardless of responsive design, the question is still relevant.

     
    |
    Mark as:
  • Currently Being Moderated
    Dec 30, 2012 11:45 AM   in reply to Rob Hecker2

    Hi Rob,

    I didn't say it wasn't a relevant question nor did I mean to imply it.  I just tossed out another point of view for anyone who might be interested.

     

    My site uses a semi-liquid approach:

    width: 90%;

    min-width: 760px;

    max-width: 1280px;

     

     

    N

     
    |
    Mark as:
  • Currently Being Moderated
    Jan 1, 2013 9:43 AM   in reply to VL Branko

    Well, not taking phones into account is ignoring a growing percentage of the web market.

     

    Look at the NYTimes on a phone, or Amazon.

     
    |
    Mark as:
  • Currently Being Moderated
    Jan 1, 2013 11:51 AM   in reply to VL Branko

    VL Branko wrote:

     

    I was specifically interested in desktop/notebook displays because I could not imagine doing any serious surfing on a phone.

     

    I used to think that way and I've proved myself wrong.  I do a whole lot of serious surfing on my iPhone.  Partly because more people make content available to me that way.  I do heaps of serious surfing on my tablet and the only serious surfing I do on my 26" monitor, dual screen set-up is when I'm working directly on a site and need to do some research.

     

    These days, I probably do far more surfing on a mobile device of some kind.

     

    Martin

     
    |
    Mark as:
  • Currently Being Moderated
    Jan 1, 2013 1:40 PM   in reply to VL Branko

    Although real estate is a big factor, Responsive Design encompasses much more than screen size.

     

    Ideally, the page displayed to mobiles should be a simplified version of your desktop page, mainly because there's a limit to how much content & bandwidth one can comfortably access on smaller devices.  Moreover, the mobile user is less likely to be doing deep research and is more inclined to be searching for quick basic information (i.e. phone, address, a game result, a product rating, etc..).

     

    Desktop menus invoked with mouse hover do not work the same way on touch screens. Thus mobile menus must be designed with finger access in mind: wider hotspots & onClick trigger events.

     

    The list goes on but I think you get the general idea that Responsive Design means creating an optimal experience for all device users.

     

     

    Nancy O.

     
    |
    Mark as:
  • Currently Being Moderated
    Jan 2, 2013 2:41 AM   in reply to VL Branko

    I really think that you should follow Nancy's advice, no matter how subtle she is. I'm afraid that looking at the sites that you have quoted, you are looking at ancient technology. In fact the latter even states

    This is for desktop and laptop computers; not mobile devices

     

    Over the Holiday period, we played host to a myriad of people from all over Australia and beyond. Their favourite way to communicate with the Internet was by using mobile devices. Mobile devices outnumbered laptops by 10 to 1 (there were no desktops).

     

    Have a look here http://jeffbridgforth.com/responsive-web-design/

     

    There is no need to extend yourself outside of what you are capable of doing. By the same token, you should not become an osterich, with due respect to this remarkably responsive (pun intended) bird.

     

    Please note what Nancy said:

    My site uses a semi-liquid approach:

    width: 90%;

    min-width: 760px;

    max-width: 1280px;

     
    |
    Mark as:
  • Currently Being Moderated
    Jan 2, 2013 1:20 PM   in reply to VL Branko

    Google does have a tool for those who are designing fixed-width websites that will give you a very good rule of thumb:

     

    It's their browser size application.

     

    I have been using that as a rule of thumb since I started doing websites. Presently, 90% of viewports (browsers) can see a 900 px layout. And there are good reasons to go wider.

     

    As the Google application shows, you can easily mess a site up by having an appeal "below the fold," or where one's website has few viewers. So if you are designing a website and you're trying to promote something, you want to use space close to the top, upper left hand side for anything that people will tend to need to see right away.

     
    |
    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points