Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

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/

share|improve this question
    
It is all about compromises. You need to redesign it, even if it looks less appealing on your 17 inch monitor. –  Emil Oct 24 '11 at 8:55
add comment

4 Answers

up vote 5 down vote accepted

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

share|improve this answer
    
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 Oct 24 '11 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. –  Monica Cellio Oct 24 '11 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 Oct 24 '11 at 18:29
    
@melee Sure nothing is perfect and thats why I posted critical links too. –  FrankL Oct 24 '11 at 18:31
add comment

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:

http://www.alistapart.com/articles/responsive-web-design/

http://coding.smashingmagazine.com/2011/01/12/guidelines-for-responsive-web-design/

share|improve this answer
add comment

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.

share|improve this answer
add comment

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.

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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