Results 1 to 4 of 4

Thread: How to optimize images in Magento 2?

  1. #1
    Join Date
    Sep 2019

    How to optimize images in Magento 2?

    I've got a website built on Magento 2. It performs not so fast as I want, but still, it's okay.
    I have problems with images. They look blurry, some of them a smaller than they should be.
    Do you have any tips?

  2. #2
    Join Date
    May 2019
    Hello Jacky! The problems you have with images go from their poor integration into your website. Here you should think of image optimization. What do I mean?

    - #1 Optimize the size of Magento 2 images
    Keep the aspect ratio of the original Image
    The widespread problem of e-commerce development is that the uploaded photos of the products and product images on the web page have different aspect ratios. Let’s consider the example: you’ve taken a picture of the product. Its size is 1920 pixels high and 1080 pixels wide, thus its aspect ratio is 16:9. The dimensions of the product images on your website are limited by CSS, and it stands at, for instance, 600×600, so its aspect ratio is 1:1. As you can see, the aspect ratio of the original picture and product image are not equal. This is why the uploaded photo will be distorted in order to be fitted to the aspect ratio of the product image.
    As a result, the image is distorted, which can be reflected by blurring, or a grainy or pixelated appearance. Will your visitors like such pictures? We don’t think so. Besides being unclear and looking weird, they don’t give a great impression of the product that you are selling, which is critical to your conversion rate. The best solution here is to keep the aspect ratio of the output product image the same as the aspect ratio of the original image.

    Compress Images
    You need to compress images in the most delicate way, without any deterioration, while providing significant size reduction.
    SEO for the images.
    You need to specify alt tags for product images. They provide a better understanding of the web page for search engine crawlers.

    #2 Use WebP to speed up Magento 2
    Google recommends turning to the main rockstar among the image formats – WebP – an image format which was rolled out in 2010 by Google. Designed specifically for the web, it provides superior lossless and lossy compression for images.

    #4 Tune the image SEO for Magento optimization

  3. #3
    Join Date
    Jul 2019
    You need to enable the fastly IO. For installing fastly image optimization you have to go to the admin panel VCL snippet. It helps in providing security configuration to help us for image optimization.
    For configuring Fastly IO you can even use Fastly IO for more granular images features such as:-
    Force lossy conversion.
    Deep optimization of images
    Pixel ratio that is adaptable

  4. #4
    Join Date
    Sep 2019
    Fastly image optimization (Fastly IO) provides real-time image manipulation and optimization to speed up image delivery and simplify maintenance of image source sets for responsive web applications. Once configured Fastly IO provides the following image optimization features:
    Following Features provide Fast IO in Magento
    Force lossy conversion
    Deep image optimization
    Adaptive pixel ratios
    Support for common image formats: PNG, JPEG, and GIF.

Thread Information

Users Browsing this Thread

There are currently 2 users browsing this thread. (0 members and 2 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts