Welcome to WebmasterWorld Guest from

Forum Moderators: phranque

Message Too Old, No Replies

Different versions of a website for different screen sizes?



12:06 pm on Feb 25, 2012 (gmt 0)

I have a website, thats 900px in width, and I am sure it would loog good on a laptop, but I have a lot of space on both sides, when I look at it on a widescreen monitor. I was generally reading that it recommended etc, but is it not a little 2005 way of thinking etc? I think that websites at about 980px width (I am talking here about websites that are centered, margin: 0 auto; etc).

My question would be, do people generally create different versions for different screen sizes, do detection (probably JavaScript) and load specific site based on the screen size etc, or is it generally too much work and people dont do that etc. What is the best way to go about that?

I am mostly gonna be working on Wordpress blogs for now, so the question would be mostly related to this.

Thank you.


12:20 pm on Feb 25, 2012 (gmt 0)

WebmasterWorld Senior Member g1smd is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month

create different versions

That's way too much work.

However, if it is a database driven website with a small number of templates it is possible to create a small range of different templates.

You're still stuck with the problem that people on the mobile site are being fed large images unless you have prepared images at several different scales.


3:16 pm on Feb 25, 2012 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member


Designs have some what come full circle. Use to be everyone was concerned about fitting into a 800x600 space. Then, as screen got wider, designs did, either though screen detectors or simply fluid designs. Now, with the increase in mobile devices, smaller is vogue again.

My personal opinion is do not worry about uncommonly wide screens. Fill the empty space with an interesting background image to break up the monotony of a large solid color. If anything, concern yourself with fitting mobile devices comfortably. That is not to say make a mobile friendly site, but at least a site that a user does not have to scroll a lot left-right to see the critical content.



3:52 pm on Feb 25, 2012 (gmt 0)

WebmasterWorld Senior Member g1smd is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month

With a very large screen, I run the browser in just part of it and have other windows open.

It's important to measure window size not screen size. :)


6:09 pm on Feb 25, 2012 (gmt 0)

WebmasterWorld Administrator 5+ Year Member Top Contributors Of The Month

I've always been a fan of liquid layouts that can look good at any width. My favorite current layout goes from 680 to 1080 without a horizontal scroll. All the content is in a central column with a max-width and min-width setting in css and it is designed to resize gracefully with floating divs. On phone screens it's hard to read details so usually they end up scanning a page to an interesting area and then enlarging that area. I would not think of multiple versions, but the suggestion to set up various templates for WP makes sense. It depends on the theme and its layout how much customizing you would need to do. I use some browser resize shortcuts that allows viewing of various common window sizes. It can't show what an Android viewer would see, but it shows you how your content fits in different window sizes.


10:29 pm on Mar 4, 2012 (gmt 0)

5+ Year Member

joliett89, do a search for responsive design and you'll find that it's surprisingly easy to adapt your page to various formats and common widths with css.

Featured Threads

Hot Threads This Week

Hot Threads This Month