Skip to main content

Monitor Resolution And Its Impact On Your Website

Monitor Resolution and Your Site

Occasionally we have a client that asks the question, why does my website look different here than at home? The answer actually lies in the displays themselves — different monitors have different resolutions.

Resolution is a set number of pixels on a monitor’s screen. Some older monitors may have a resolution of 1024×768. A newer monitor might display 1920×1080. Websites are designed with a fixed pixel width, with most at around 960. Therefore, if you have a larger monitor that is capable of displaying 1920 pixels, the website will only take up 960 of those pixels. If your monitor has 1024 pixels, it will take up 960 of the 1024 (most of what is available) and appear larger.

Another wrinkle is that some older computers only are capable of generating certain resolutions. So even if you buy a monitor capable of larger resolutions, the computer will only give it the maximum of which it is capable. What that means in the real world is that you will get a slightly blurry image on your new high-resolution monitor. One of two solutions is available to you at this point. You can either upgrade your graphics card, or you can get a new computer. Either way, you have to make sure that your computer and monitor are capable of the same resolutions.

Fortunately, a more universal display solution is gaining popularity — website designers are creating responsive websites. This means the website will automatically detect what device it is being view by and adjust accordingly. This is neat because the site content can be tailored for an optimal viewing experience on nearly any display device. It is a fairly new development; the term Responsive Web Design (RWD) was only coined in 2010. But as more people are using phones and other smaller devices, it is a consideration that cannot be ignored.