How to read the labels

Webbplatsen skickar varje bild i den storlek som skärmen behöver. För liten och bilden ser suddig ut; för stor och sidan laddar långsammare. Den här sidan visar hur väl varje bild passar.

Varje bild får en etikett:

  • Sharp: bilden passar skärmen exakt.
  • Within range: bilden är lite större eller mindre än det behövs. Ingen märker det.
  • Blurry: bilden är för liten, så den ser mjuk ut. Det behöver åtgärdas.
  • Too large: bilden är mycket större än det behövs, så sidan laddar långsammare. Det behöver åtgärdas.
  • Larger by design: bilden är större än det behövs på den här skärmen, men anpassad för en bredare skärm av samma typ av enhet. Det är väntat.

Etiketten visar också bredden som skärmen behöver och bredden som webbplatsen skickade, i pixlar.

Så använder du sidan

  1. Välj en skärmbredd, en bild och en layout.
  2. Läs etiketten på varje bild. Summan visas ovanför ramen.
  3. Slå på Image sizes på ett annat blocks referenssida för att kontrollera det blocket.

Try it

Viewport width

Viewport preview