Does the note cost points?

The score stays the same. The note is listed in the audit file under the observations, so that you can deal with it when you revise the images.

Does upscaling with a program help?

An image enlarged afterwards keeps the details of the small original: the check then counts enough pixels, but the sharpness stays the same. Programs with AI upscaling add invented details. For photos of people and products, a genuine larger original shows what is really there.

Which pixel density does the check assume?

The check measures in a desktop window 1,280 pixels wide with a pixel density of 1. This finds images that have too few pixels even on a standard screen. A phone with double density needs double the width; offer this version in the srcset.

This translation has not been editorially reviewed yet. The German version is authoritative. Deutsche Fassung

CO₂ & EmpCo

Why does an image look blurry, and how does the check detect it?

A file 300 pixels wide that is stretched to 600 pixels looks soft and washed out, especially on high-resolution screens. The check reports such images as a note. The score stays the same, because a small image transfers few bytes; this is about image quality.

The calculation

The check measures in a desktop window with a pixel density of 1. The display width is what is needed there; if the file is narrower than 90 % of it, it counts as blurry. The rule applies to content images in raster format from a display width of 100 pixels. Excluded are decorative images (alt="", role="presentation" or aria-hidden) and SVG graphics, which are sharp at any size.

Why the note stands next to the image size

The image table looks at every image in both directions: delivered too wide and too narrow for the display. That is why the note on sharpness stands next to the findings on image size. When you shrink oversized images, you keep the required width in view this way.

Examples

Team photo

Not met

<img src="/bilder/team-300.jpg" style="width:600px">
<!-- 300 px für 600 px Anzeige -->

Passes

<img src="/bilder/team-600.webp"
     srcset="/bilder/team-600.webp 600w, /bilder/team-1200.webp 1200w"
     sizes="600px" width="600" height="400"
     alt="Das Team vor der Werkstatt">

Read the example address with natural and required width in the note.
Upload the image at least at the display width and offer double the width as a second version in the srcset. Standard screens then load the smaller file.
If only the small version exists, choose another image or show it at its original width.
After the replacement, order a re-measurement; the image table then shows the new width.

Deutsche Fassung dieser Seite