Overview

You may want to add an image to a page of your site by using different modules (carousel, image, ..) and would like to know what are the recommended image dimensions and aspect ratio to avoid having blurry images.

Information

Generally speaking, an image should be at least as wide as the region where it will appear. Images stretched to fit the available space, may appear grainy. Also, note that there's no benefit to uploading super-sized images.

The following table lists specific minimum widths. The required image height depends on the aspect ratio.

SLS2 supports several different aspect ratios, so it is important to consider how your images will look with the various options.

For example, the 3 x 1 and 4 x 1 options are wide but not tall, so a good portion of the image cannot be displayed. On the other hand, the 1 x 1 option will offer a square shape that is the best fit for square modules.

In the examples below, the yellow region shows what portion of a standard 4 x 3 image could be displayed in a carousel with 16 x 9 and 3 x 1 aspect ratios. An aspect ratio of 4 x 1 would be an even thinner slice of the original image.

You can view this website for more info. To change the scale of the image you can use the  Adobe Express image resize tool.