Recommended image sizes
In this article, you will learn how to upload the right images in order to create a responsive design in the slideshow, banner, product images.
Image sizing tends to be one of the most difficult aspects of modern web design to deal with.
We will recommended images on the homepage banners, product images and slider images with the following image sizes.
1. Slideshow Images
- Desktop- The recommended width for your slideshow images is 1920px (since the images are full-width slider images) in order to fit well on all the devices and for good quality as well. You can choose the height of your liking with the Slide height setting in the theme editor>Sections>Slideshow.
- Mobile- you can use an image size of about 1200px for mobile display. The height can vary as mentioned above.
2. Product Images
- Product features: The recommended image size is similar to the product image sizes I would suggest using square images of about 1024px *1024px or smaller images of about 600*600px.
- Icon rows: There's no recommended image size for this size the icons are fetched from Iconminds.
3. Banner Images
- The banner section, we recommend an image size of about 1400*600px.
4. Featured Images
- For the "Featured Image" sections, I'd suggest using an image size of about 1600*700px. As for the product images, I would suggest using square images of about 1024*1024px.