Devices and their capabilities are changing and evolving quickly. Building and maintaining such a system is very complicated. As a result, it is best to automate both the device detection and the ensuing image optimization. The device detection needs to instantly identify the requesting device and supply the relevant image parameters to the image optimization system.Īdding these additional parameters increases both the effectiveness and the complexity when your optimize image for web. The key here is having a device detection solution that automatically feeds the image optimizer these parameters. By fine tuning and using additional capabilities like device model, operating system version, screen size, pixels per inch, browser version, and ability to support specific next-gen image file formats, you can optimize image for web much more effectively. But effective optimization requires much more than setting breakpoints for the screen size. For example, they may use Adobe Photoshop to create multiple image variants with different image dimensions. Typically, when front end designers want to optimize image for web, they think of the size of the screen. To achieve the most optimized image for web or inside your app, you need to match the image to the capabilities and size of the device. But a device-aware image CDN like ImageEngine can increase the image payload reduction up to 80%.
Without device detection and just using screen size breakpoints, you can reduce image size by 40%. The improvement you gain when you optimize image for web by adding device detection is dramatic.
0 kommentar(er)
