> For the complete documentation index, see [llms.txt](https://docs.norrnext.com/norrcompetition/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.norrnext.com/norrcompetition/best-practices/recommendations-on-image-sizes.md).

# Recommendations on image sizes

NorrCompetition processes and generates multiple image sizes for contest entries to deliver optimal presentation across different viewports and page layouts:

* **Small image** – Used in the list of contest entries and grid modules.
* **Medium image** – Used on the individual entry details page.
* **Big image** – Used in the lightbox / full-screen zoom view.
* **Preview image** – Used during the interactive client-side crop mode upon photo upload. It should not be smaller than the small image size (we recommend matching the medium image dimensions).

By configuring appropriate image sizes and aspect ratios, you can tailor the presentation to your website design and template layout.

You can also override image dimensions and cropping rules on a per-contest basis in the **Contest > Images** settings.

### Image Settings

For detailed parameter definitions, refer to the [Images Configuration](/norrcompetition/configuration/images.md) guide.

#### Crop Mode Ratio

First, decide on the appropriate aspect ratio for thumbnail presentation. The **Small Image Ratio** parameter defines the crop box proportion displayed when users submit or edit photos. The cropped area is then resized according to the configured small image dimensions.

Supported ratios include: **1:1**, **2:3**, **3:2**, **3:4**, **4:3**, and **16:9** (default is **4:3**).

#### Image Sizes & Orientation

When contestants upload photos from smartphones or digital cameras, source images can have diverse aspect ratios and orientations (landscape vs. portrait).

Because the lightbox modal is fully responsive, we recommend setting dimensions for the **Big image** that provide crisp detail on high-resolution displays (e.g., width up to 1920px).

<figure><img src="https://norrnext.com/images/docs/norrcompetition/best-practices/nc-image2.jpg" alt="Big image view on the wide display"><figcaption><p>Big image view on a wide display</p></figcaption></figure>

For medium and big images, consider your contest's content type:

* If all entries share identical dimensions (e.g., standard banner designs, album covers), fixed dimensions can be used.
* In general photography contests with mixed portrait and landscape submissions, avoid forcing rigid non-proportional scaling for medium and big images. Specify maximum bounding box constraints (e.g., maximum width and maximum height) so the aspect ratio remains intact.

<figure><img src="https://norrnext.com/images/docs/norrcompetition/best-practices/nc-image3.jpg" alt="Orientation examples"><figcaption><p>Two different orientations: landscape and portrait</p></figcaption></figure>

* **Landscape image:** e.g., 1200×800 px
* **Portrait image:** e.g., 683×1024 px

For the **Small image** (grid thumbnail), a consistent crop ratio is critical for maintaining an aligned, clean grid on contest pages and modules (e.g. 3 or 4 entries per row).

<figure><img src="https://norrnext.com/images/docs/norrcompetition/best-practices/nc-image1.jpg" alt="Creation of small image after entry photo upload"><figcaption><p>Interactive crop and thumbnail generation upon photo upload</p></figcaption></figure>

### Supported Image Formats

NorrCompetition processes standard web image formats: **JPEG**, **PNG**, and **GIF**. Uploaded images are processed and converted into optimized JPEG/PNG files according to the configured quality settings.

### Watermark Recommendations

If you enable watermarking on uploaded photos:

1. Prepare a transparent PNG watermark (e.g. site logo, trademark, or domain).
2. Choose a clean, high-contrast design (e.g., white outline/fill with subtle drop shadow) so it remains legible over both dark and bright photography.
3. Test your watermark positioning and opacity across several test photos before launching the contest to public submissions.
