Design resolutions

Print
03 Dec 12
Written by Alexandra Coroian
Hits: 9051

At starting your website's design ( redesigning your website), there are some important screen resolution issues that you may have to solve. With all the different options available on the market ( retina display devices, tablets, mobile phones, televisions, etc), how can you choose the perfect resolution for designing your site?

If your website's design doesn't match the resolution of the display it is seen on, there are two things that can happen :

------>your site can appear cut-off, too small for the display's capabilities; this would happen for a small resolution site shown on a large resolution display

------>if your site has a bigger resolution then that of your display, your images on screen can appear too small or unreadable for your viewers

So, now, that we've agreed that your site's resolution has to match that of your display, let's see how you can achieve this goal, in 3 easy steps:

 

1.Find your customer's displays

This is the most important part. Knowing what display the majority of your site viewers is using, is crucial. That is if you want to meet their requirements with your website's design. Find what display your prospects are using by reviewing your web log files. Can also put up a site poll or a script to find the answer to this question. Track your readers using a browser size script, as described on About.com.

 

2.Test your design

The easiest way to see how will it look on different resolutions. Depending on what type of content you choose to display, your site may look better smaller than larger or vice-verse. It may also happen that, even though the resolutions don't match, your content will still look good on a mismatched display. There are a multitude of online tools, but you can always use Firefox add-ons and Chrome extensions to check how your website looks in different resolutions. Here are some of the most dependable ones: ResizeMyBrowser, Screenfly, TestSize, Firesizer, Resolution Test.

 

3.Redesign for the right reasons

Meaning : have your clients interest in mind, even if, sometimes, it may go against the general trends of web designing. When you're thinking about improving your site's appearance, think about your customers firstly and secondly if your decision fits the overall trends. For example, the latest Web Statistics show that, in January 2012, more then 85% Internet users use resolutions higher than 1024*768, with only 1 % using 800*600. But, like I said before, it all depends on your user's choices, their economical status, the region they come from, etc.

There are still a lot of web designers who use small resolutions, if their website viewers are using the corresponding displays.

This table from telestream.net shows how resolution and screen size are linked:

 

 

14”

15”

17”

19”

21”

640×480

BEST

GOOD

TOO
BIG

HUGE

TERRIBLE

800×600

GOOD

BEST

GOOD

TOO
BIG

HUGE

1024×768

TOO
SMALL

GOOD

BEST

GOOD

STILL
GOOD

1280×1024

TINY

TOO
SMALL

GOOD

BEST

GOOD

1600×1200

TERRIBLE

TINY

TOO
SMALL

GOOD

BEST

And which is the most advisable combination to be used in order to deliver best quality.

 

For your knowledge:

-the iPad display has a screen resolution of 1024×768 pixels

-the iPhone 5 is 1136/649

-standard resolution for DVD format is 720 x 486

-wide screen DVD format is 864 x 486

-online video (like YouTube) displays well at 1280×720 resolution

Retina display: a name used for several Apple products referring to have crystal liquid displays with a claimed extremely high pixel density, unrecognizable by the human eye from a specific distance.