We know that not all people have the same screen resolution in their computer monitor. Some people prefer widescreen display in 15'', when other uses 17'' and more for their computer experience.

I am designing a web page that in my monitor (17'' 1280w x 1024h ) looks great.

When I tested it in a laptop, ( less height resolution than my monitor ) it does not look good because it kind of splits the page and you have to scroll to get the feeling. You don't get all the good part at once. This means it looses from it's design.

My question is if this is a game of my mind because I am used to my monitor, and if it is not, how should I deal with it ?

I prefer not to show my page, but I found an example of what I mean in template monster here http://livedemo00.template-help.com/joomla_35840/

  • It is all about compromises. You need to redesign it, even if it looks less appealing on your 17 inch monitor.
    – Emil
    Commented Oct 24, 2011 at 8:55

4 Answers 4


For that reason and furthermore for mobile screensize as well, there is new technique called Responsive Webdesign. Its about adapting its content and layout according to screensize by using CSS mediaqueries and additional serverside techniques. Haven't digg too deep into it, but I think its based on HTML5 and CSS3.

But, I'm afraid it needs a whole new layout approach for your current site.

Links: Responsive Web Design Introduction, Responsive Web Design: What It Is and How To Use It Pragmatic responsive design, Adaptation: Why responsive design actually begins on the server, Golden Grit System

And critical links: 11 reasons why Responsive Design isn’t that cool!, Responsive Web Design or Separate Mobile Site? Eh. It Depends., CSS Media Query for Mobile is Fool’s Gold

  • There's situations where responsive just makes sense - or example, a newsletter or something of that nature. There's still a big question mark for having user generated content conform to responsive techniques.
    – Nic
    Commented Oct 24, 2011 at 12:34
  • +1 but with a caution: screen size does not tell you everything you need to know. People can't be assumed to use a browser in full-screen mode, for one thing, and for another, I am currently viewing this page on a 20" monitor in portrait mode, so even full-screen it wouldn't work. Commented Oct 24, 2011 at 16:00
  • 1
    @monica Thats why its recommended to check for windowsize instead screensize using javascript. See [a showcase] (browser.nokia.com) from {Yiibu] (yiibu.com) for the effect.
    – FrankL
    Commented Oct 24, 2011 at 18:29
  • @melee Sure nothing is perfect and thats why I posted critical links too.
    – FrankL
    Commented Oct 24, 2011 at 18:31

Have to agree with FrankL here. The current trend is towards responsive web design using HTML5 and CSS3 (in particular media queries). Be aware though that a lot of this functionality will only work on newer browsers. If you have some stats about who currently visits the site (what browsers they use) this may show whether HTML5/CSS3 is the way to go or you need to look at other ways of creating similar effects that work on older browsers.

Some links on response web design:




I have to say (to my shame)n that I haven't checked recently what is the majority resolution used by screens in 2011. However, I stick to the idea that you should at least cater for 1024 x 768. In your design, if you aren't catering for the vast majority of your potential audience, then all you are creating is a vanity project.

My advice is...find out what the majority (i.e. over 90%) of your visitors resolutions are and cater for at least an acceptable appearance the lowest common denominator. i know it is a pain but it is your users you should be addressing.


If its really ALL about design, than try to design it fluid so it can adjust to different screen sizes. There are lots of examples of similar websites.

Google did a really good thing with a semi-fluid interface (i used the term semi because it has couple of steps that it reduces to, it does not reduce smoothly with every size of browser) - open up your google docs, and than start reducing the size of the browser window and see what happens.

There are even frameworks for this kind of work that you can use.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.