People, who are working everyday on computers or mobile phones, doesn’t recognize the different kind of pixels existing. If you are zooming in or out, you can see many single pixels which are forming a picture or something else on your device.
But those pixels are different from each other. There are CSS pixels, device pixels and also density –independent pixels.
Different kind of pixels
CSS pixels are having a kind of layer and the size is variable. It is an abstract unit, and the manufacturer of devices determinate how many hardware pixels are CSS pixels. The second type of pixels are device pixels. This are fixed hardware pixels. The problem is that certain screens have a certain amount of pixels. If they changing, because the screen size is changing, this will be a problem, which is only solvable with a new pixel layer.
For that reason there is also a third type of pixels namely the density-independent pixels. This sort of pixels are between the CSS pixels and device pixels.
The density-independent pixels are more flexible on mobile devices. While the browser view on a desktop screen is nearly the same size as the screen itself – on a mobile device it is going to be a problem. With density –independent pixels the software is able to fit the browser view or the application view to the screen size. Because there are meanwhile so many different devices and sizes, developers split also the viewport.
Splitted viewports for responsiveness
Therefore there are two ports: the layout viewport and the visual viewport. In the layout viewport is the information for the CSS and in the visual viewport are the information, which the users are seeing.
Google Ranking and Mobile First
Years ago, no one cared about responsiveness and mobile devices. Nowadays it is definetely going to be a problem. The latest Google Update (Page Speed) is all about „Mobile First“. The crawler is indexing first the mobile sites and then the desktop version. If the view on a mobile device is not good and especially not responsive – user won’t continue to browse this website. Also the page speed is one oft he latest ranking factors by Google.
Big files are a big problem and the reason why a website or application is loading slowly.