9 replies to this topic

[EGOL]

A decade ago lots of people were making their websites to fit a 640-pixel-wide monitor, then an 800 monitor, then a 1024....

 

.... and now with mobile we are being squeezed down to the microformat of 300 wide.

 

They call that progress???

 

Lots of people are accomplishing this with designs that automatically resize to fit the device they are being viewed upon.

 

How are you handling this?   If you have not redesigned your site in the past couple of years you probably have lots of people looking at your site with devices that are smaller than you expected.

 

And, with lots of people using enormously wide monitors... what is the upper width that you are assuming?     And, is that important?

 

I don't know the answers to this stuff... but it sure looks like a briar patch.  

[iamlost]

My page templates are and have been for years 1200-1500px page max-width. And adjust via media queries (responsive design) to accommodate smaller screen sizes.
Note: there is also some (still testing) adjustment to accommodate device resolution differences within similar screen sizes.

I don't worry about 'huge' desktop monitor size as (1) not all maximise browser windows, (2) many browser viewports are filled with top and sidebars, and (3) I don't want the text width to become a poor reading experience by being too wide.

Edited by iamlost, 18 February 2013 - 01:34 PM.

[glyn]

1366x768 for consumer, but I make it all liquid

[joedolson]

I never do anything wider than 1000 pix, because I personally find anything wider than that to be clumsy and aesthetically unappealing; everything smaller handled via media queries.

[bobbb]

I never do anything wider than 1000 pix

Hmmm That's not going to be popular. Mea Culpa. Neither do I.

[DonnaFontenot]

I'm in the 1000 club.

[EGOL]

I've been at 960 to 980..  thanks for all of the replies.  Just curious to see what others are doing.

 

Still interested in hearing from more members if you want to share your target width or design philosophy.

[TheAlex]

970 usually, so the average of yours! I'm thinking about responsive design but I'm not sure about the negative UX in some cases - for example when a page is slow to load you may start reading the content only for the page to reflow, so you lose your position.

[iamlost]

To expand a bit about why I exceed your 1000px limit...

* I build from content width.

* that width is calculated by:

---site font size: I use 16px = 1em.

---the optimal reading width derived from testing: 50 to 60em.

This means that at the low end content width is 800px (50*16), at the top end 960px (60*16)

Then I add one or more sidebars/columns whose widths vary by their content requirements, plus margins/padding.

 

Note, also that 1200-1500px is the max-width allowed. If the desktop viewport is constrained it sizes down. Plus of course once media queries are invoked things change quite a bit, gotta love the power of CSS.

[tommr]

My new site is 960ish to fit the aspect ratio of the wider laptops and wider monitors. 
I make sure everything important appears above the fold and to the left for those with smaller monitors.

The people with narrow monitors are probably used to scrolling as more and more sites edge toward 1000 but I hope that the mere 200px difference will not cause the site to be hard to use.

 

One of the main reason I am currently re-designing my most important site using WordPress is to take advantage of plugins that offer a better version to those who need it.  As a matter of fact I have a smart phone on the way just for checking the site.

 

One thing though, I have noticed that a few plugins offer the visitor a menu first with no visual appeal   If I am going mobile to say ebay, I am accustomed to the site and I already know where I want to go.  I only need the navigation at first look.  But my products are visual and that is the biggest part of the appeal.  The product probably should be one of the first things the visitors see so II may have to look further and work on this.

 

There is no doubt that many people access the web using mobile devices and I want to be sure to make a best first impression, otherwise they may be lost forever.