Så optimerar du bilder för WordPress

För en WordPress-artikel förbereder du en passande kopia, laddar upp den till mediebiblioteket och väljer den i ett Bild-block. Välj upplösning, lägg till alt-text och granska sidan på mobilen. Full storlek väljer mediebilagans fullstora version, som WordPress redan kan ha skalat ned. Valet ändrar inte bara blockets bredd. WordPress-referensen förklarar skillnaden mot den oförändrade uppladdningen.

Förbered före uppladdning

Spara originalfotot separat från kopiorna som ska publiceras. Bestäm om det ska bli brett omslag, artikelillustration eller litet kort: de behöver oftast olika bildstorlekar. Beskär onödigt utrymme och dimensionera för största planerade visning.

En illustration som visas 600 pixlar bred kan få en 1200-pixelsvariant för skärmar med hög pixeltäthet. Det är ett startvärde för platsen, inget WordPress-krav. Granska resultatet och jämför filstorleken med en mindre version.

Använd beskärningsverktyget för komposition och storleksverktyget för slutmåtten. Bevara proportionerna när du anger bredd och höjd om formen inte avsiktligt ska ändras.

Välj ett format din webbplats stöder

Prova WebP för webbplatsens foton. Behåll PNG vid krav på exakt förlustfri grafik och JPG när andra system kräver det. Transparens kräver inte PNG; WebP stöder den också.

Testa en bild genom hela WordPress-installationen innan biblioteket konverteras. Serverns bildbehandlingsprogram, tillägg och teman påverkar bearbetningen. Se WordPress om bildstorlek och kvalitet. Undvik upprepad komprimering genom flera tillägg utan kontroll.

Kontrollera bilden på sidan

Infoga bilden i rätt inlägg eller på rätt sida och granska upplösningsvalen. Välj inte full storlek bara för att det låter bättre. Välj en version med tillräckliga detaljer för placeringen och kontrollera filen som faktiskt levereras. Den officiella guiden för Bild-blocket beskriver inställningarna.

Skriv alternativtext efter bildens funktion. En produktdetalj behöver andra ord än en dekoration. Undvik sökordslistor och upprepning av stycket intill.

Verifiera den publicerade sidan

1. Öppna adressen utloggad, även på smal skärm.
2. Kontrollera beskärning, skärpa och mellanrum.
3. Öppna den visade bilden separat om du behöver kontrollera vilken version sidan använder.
4. Kontrollera mått och filstorlek i nedladdningen. Använd Network-panelen först när du behöver undersöka laddning eller begäran närmare.
5. Om gammal fil kvarstår, kontrollera sidans, tilläggets eller CDN:s cache och testa igen.

Skapa en upprepbar rutin

Anteckna vanliga omslags-, artikel- och miniatyrmått för temat. Använd beskrivande filnamn och kontrollera mobil förhandsvisning före publicering. Ompröva inställningar vid temabyte: en smal artikelbild passar kanske inte en ny fullbreddslayout.

Exempel: från original till publicerad artikelbild

För en spalt på 720 pixlar och ett original på 3600 × 2400 kan du skapa kopior på 720 × 480 och 1440 × 960 med samma beskärning. Det är exempel, inte WordPress-standarder. Jämför i visningsstorlek och välj större bara om detaljerna motiverar det. Spara originalet och ge exporten ett beskrivande namn före uppladdning.

Infoga kopian i ett utkast med bildblocket. Kontrollera upplösning och synlig bredd var för sig: ett smalare block garanterar ingen mindre nedladdning. Granska också den utvalda bilden, som temat kan beskära annorlunda. Kontrollera den publicerade bildförfrågan på mobil och dator när du är utloggad.

Om den nya bilden fortfarande ser fel ut

Jämför vid oskärpa först levererade bildmått med visningsstorleken. Syns den gamla bilden, kontrollera adressen: en annan kan tyda på en gammal hänvisning, samma på cache. Om bara en miniatyr är fel, undersök just den genererade varianten.

Säkerhetskopiera medier och databas före massändringar och testa ett inlägg. Bestäm vilket system som komprimerar och kontrollera vad tillägg eller CDN ändrar. Spara original, vald export och slutlig adress tillsammans så att du kan återgå utan upprepade förlustkomprimeringar.