Understanding Screen resolution.

Hello and welcome everyone.

So, straight to the topic. Today we are going to decode the science behind the screen resolution and would also see, how it is calculated?

There is no rocket science in this, yet it could be a bit complex for some readers, hence pay attention.

Why is it a big deal?

screen size is important because there are lots of different screen sizes. Whether you’re deciding to build for windows or MacBook, both platforms have tons of different devices.

Resolution is also important. That’s because the resolution of different screens can affect how designers build their sites. Based on this information, there are certain things that a designer or developer needs to know.

So as you can see, both screen size and resolution size are important, but for different reasons.

As a website owner or web designer or developer, you have to take into consideration what are the most common screen resolutions for the intended target audience of the website to determine what web page width is suitable for the website.

These days we have many different screens sizes all with different resolutions – TV’s, desktop monitors, laptops, tablets, mobile phones, and even smart watches.

What is screen resolution?

To understand resolution you need to understand how a screen works. Screens are made up of thousands of tiny dots all bunched together called pixels, each one has the ability to change color and when you zoom out all the dots joined together to make up an image.

Screen resolution is the measure of the number of pixels a screen can display. This would be measured by width and height. For example, a screen that has 1,024 pixels horizontally, and 768 vertically would have a resolution of 1,024 x 768.

How is it calculated?

Resolution is the maximum number of pixels that can be displayed on a monitor, expressed as (number of horizontal pixels) x (number of vertical pixels), i.e., 1024×768.

The higher the screen resolution the more information can fit on the screen.

Screen size is usually measured in inches and is the actual size of the device’s screen measured diagonally. Anyone with a tape can measure the screen size. Screen resolution is measured by the number of pixels displayed in each dimension. In order to calculate the pixels per inch, you need to know the screen size as well as the resolution.

The formula to calculate PPI is a bit complicated. You need to take both the digits in screen resolution. Add a square of both these digits and take a square root of the result. The final number should be divided by the size of the screen.

For example – if the screen size is 5.8 inches and screen resolution is 1138 X 680, then PPI can be calculated as –1138X 1138 + 680 X 680 = 1757444.  A square root of 1757444 is 1325.69. Now, divide the number 5.8 i.e. 1325.69/5.8 = 228.5.

Final Words.

The idea behind considering screen resolution and screen size is to build an app that is visually compatible with any android and iOS device. If you are building an app with one screen in mind, it will spoil the user experience. Poor user experience will hurt the quality of your mobile app, which is something every developer should avoid.

If you have any question in mind, feel free to ask in the comments.

Thank You.