![]() ![]() However, higher resolution images weigh more bytes and take more time to deliver, so you should avoid delivering double resolution images to standard devices of DPR 1.0. Your website or mobile site is probably accessed by many users with HiDPI devices, or laptops with DPR higher than 1.0, so you should deliver high-resolution images to match the high visual quality your users expect. Some Android devices have non-round DPR values as well: 1.3, 1.5 and even 0.75. For example, Samsung Galaxy S III has a DPR of 2.0, while the Samsung Galaxy S4 and LG G2 have a DPR of 3.0 (triple physical resolution). Android smartphones and tablets followed this trend, but there is a large variety of Android devices with different Device Pixel Ratios. Since then, most of Apple’s devices support this Device Pixel Ratio (DPR) of 2.0 (double physical resolution compared to logical resolution), including iPhone, iPad and Macbook Pro laptops. This means that if, for example, you embed an image tag in your HTML page with width of 200 pixels and height of 300 pixels, and you display a double-size image of 400×600 pixels, the Retina display shows all pixels of the larger image, resulting in a much clearer visual result and without performing browser-side down-scaling. In order to simplify things for developers, the logical screen resolution remained the same as previous iPhone models (640×960) while the physical screen resolution was exactly doubled (1280×1920). In 2010, Apple introduced the iPhone 4 with Retina display. ![]() If for example, you aimed at a standard 1024×768 screen, you knew these were exactly the number of pixels available for displaying HTML elements and images. Web development was much simpler only a few years ago, when we were building HTML pages that included images and photos, and all elements shared the same resolution units. ![]()
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |