Beginner’s Guide to WordPress Image Sizes (+ Best Practices)

Vill du lära dig mer om storleken på images i WordPress?

Ofta frågar Beginner oss om vilka bildstorlekar de bör använda på sin WordPress site och hur WordPress hanterar images i olika areas.

I den här guiden för nybörjare förklarar vi vanliga storlekar på bilder i WordPress och delar med oss av bästa praxis för hur du vet vilka storlekar du ska använda på din website.

Vad är en image-storlek?

Med storleken på en image avses vanligtvis bredden och höjden på en image mätt i pixlar. Exempelvis innebär 1600×900 pixlar att en image är 1600 pixlar bred och 900 pixlar hög.

Dessa dimensioner anropas också som image-dimensioner. Imagely, en image med större dimensioner har fler pixlar, vilket gör att bildfilens storlek ökar.

Filstorleken på en image är det utrymme som en image-fil tar upp på en dator och mäts i bytes. Till exempel 100 KB (kilobyte).

Om en image har en stor filstorlek tar det längre tid för användarna att downloada den och det kan påverka hastigheten och prestandan på din website. Därför är det viktigt att hålla bildfilstorleken så liten som möjligt och samtidigt hålla images i rätt dimensioner.

Det är här som formaten för image-filerna kommer in i bilden.

Format för image-filer är komprimeringstekniker för att saved image-filer. De vanligaste formaten som används på webben är JPEG och PNG.

Images som fotografier som innehåller fler färger kan komprimeras bättre genom att använda JPEG-filformat. Å andra sidan kan images som gillar illustrationer med färre färgdetaljer använda PNG för bästa resultat.

För mer detaljer om format för bildfiler kan du kontrollera vår artikel om hur du optimerar images i WordPress.

Med detta i åtanke kommer här en snabb översikt över de saker vi kommer att täcka i den här artikeln:

Är du redo? Låt oss komma igång.

Vilken storlek ska mina images ha för min site i WordPress?

För en genomsnittlig WordPress-webbplats kommer du att använda images i flera area på din website. Du behöver bilder för dina blogginlägg, thumbnails, page headers, cover images och mycket mer.

WordPress hanterar automatiskt några av filstorlekarna för images som standard. När du uppladdar en image kommer WordPress automatiskt att göra flera kopior i olika storlekar.

Du kan se och till och med justera standard WordPress image storlekar genom att besöka Settings ” Media page i WordPress admin area.

Här ser du tre storlekar på images: thumbnail, medium och large.

Ditt WordPress theme kan dock skapa sina egna ytterligare storlekar på images och använda dem för olika sections på din site.

Dessa storlekar kommer ej att vara synliga på skärmen ”Media”, och det enda sättet att view dessa ytterligare storlekar är genom att gå till ”File Manager” på ditt WordPress webbhotell konto.

Sedan vill du navigera till /wp-content/uploads/ folder och välja valfri årsmapp där för att browsa. Detta hjälper dig att se alla olika storlekar på images som din WordPress site genererar.

Låt oss nu ta en titt på olika områden på din website och vilka image-storlekar du bör använda i dessa områden.

Vilka storlekar på Images ska du använda i blogginlägg

Du bör välja storleken på imagen för dina blogginlägg baserat på ditt WordPress theme.

Some WordPress themes come with a single-column layout, which allows you to use wider images.

Vissa andra WordPress teman använder multi-column layouts, som vanligtvis består av ett content area och en sidebar.

Om du använder den här typen av theme innebär det att du måste justera bredden på image i enlighet med detta.

För de flesta bloggar kan du använda följande storlekar på images:

• Layout med en enda column: 1200×675 pixlar
• Layout med två kolumner: 680×382 pixlar

You might notice that many popular WordPress websites use the same image width for all their images inside an article. Vänligen observera att detta inte är en strikt regel.

Om du till exempel behöver add to ett block med ”Media och text” kan du justera storleken på imagen i enlighet med detta. I exemplet under använder vi en stående image bredvid lite text.

På samma sätt kanske du vill använda kvadratiska images i vissa situationer.

Till exempel, här är ett exempel på kvadratiska images som används i en layout med flera columner.

När du använder kvadratiska images behöver du bara se till att image-dimensionerna har samma bredd och höjd, till exempel 300 x 300 pixlar.

Vilka bildstorlekar ska användas för Featured Images

Featured images, även anropade inläggsminiatyrer, är en WordPress temafunktion. Det innebär att ditt theme bestämmer vilken storlek på images som ska visas.

Till exempel kan vissa WordPress themes använda ett standardbildförhållande 16:9 för storlekar på featured images, såsom 680×382 pixlar.

Vissa WordPress themes kan också använda den featured image som header image. Om så är fallet kan de behöva större images, som 1200×675 pixlar.

Featured images är viktiga eftersom ditt WordPress-tema kan använda dem i olika area på din website. De är ofta det första dina besökare ser, så du vill göra ett bra första intryck.

Vi rekommenderar att du använder större images, som kan se beautiful ut om de skalas ner eller används i bredare lägen.

På samma sätt, om ditt WordPress-tema använder Square-bilder för featured images, rekommenderar vi att du använder images som är minst 600×600 pixlar.

• För themes som använder rektangulära featured images: 1200×687 pixlar
• För themes som använder square featured images: 600×600 pixlar

Ditt WordPress-tema genererar ytterligare storlekar för featured images som kan användas i olika areas, t.ex. homepage, blogg page eller archive pages.

Vilka storlekar på images ska du använda för Social Media

Om ditt WordPress-tema använder featured images som har bildförhållandet 16:9 kan du också använda dem som bilder för sociala media för Twitter och Facebook.

Du måste dock uttryckligen berätta för dessa plattformar vilken image du vill visa när någon delar en artikel från din webbplats.

För att göra det behöver du pluginet All in One SEO för WordPress. Det är det bästa pluginet för sökmotorsoptimering för WordPress på marknaden och används av över 3 miljoner websites. Detta tillägg kan hjälpa dig att optimera din website för search engines och social media-plattformar.

Note: Med en stram budget? Det finns också en begränsad gratis version av All in One SEO som du kan prova.

För att komma igång måste du installera och aktivera pluginet All in One SEO. För mer detaljer kan du se vår Step-by-Step guide om hur du installerar ett plugin för WordPress.

Vid aktivering kommer pluginet att starta installationsguiden. Följ helt enkelt instruktionerna på skärmen för att slutföra processen. Du kan också se vår guide om hur du ställer in All in One SEO för mer detaljerade instruktioner.

Efter det måste du besöka All in One SEO ” Social Networks page och byta till Facebook tabs. Härifrån kan du ställa in ”Featured Image” som din standard Open Graph-bildkälla.

Du kan sedan byta till tabben Twitter och göra samma sak.

Glöm inte att klicka på knappen ”Save Changes” för att spara dina inställningar.

Om ditt WordPress-tema använder bilder i en annan storlek kan det hända att Facebook och Twitter inte kan displayed dessa images korrekt.

I så fall kan du förse plattformar för sociala medier med en customize image.

Skapa helt enkelt en image med ett bildförhållande på 16:9, som kan vara 1200×675 pixlar eller 680×382 pixlar. Edit sedan posten eller page och rulla ner till ”AIOSEO Settings” section under editorn.

Härifrån måste du byta till tabben ”Social” och rulla ner till fältet ”Image Source”. Från rullgardinsmenyn väljer du ”Custom Image” och laddar sedan upp din Facebook image.

När du är klar kan du upprepa processen på ”Twitter” tabben också.

Obs/observera att du måste göra detta för alla artiklar du publicerar för att säkerställa att social media använder den image du vill att de ska använda. För fler storlekar på bilder för sociala medier, se vår WordPress Social Media Cheat Sheet för Beginner.

Vilken storlek på image ska man använda för loggan på en website i WordPress

Många WordPress teman kommer att låta dig veta vilken image storlek du ska använda för din website logga.

Till exempel visar vårt demo theme detta message när vi försöker uploada en logga.

Men om du använder ett nyare WordPress-tema med en fullständig funktion för redigering av webbplatsen kanske du ej får någon rekommendation om storleken på logotypens image.

I så fall rekommenderar vi att du uppladdar olika stilar och storlekar för att se vad som passar ditt varumärke bäst. En storlek på en image för logotypen på 300×200 pixlar kan vara en bra utgångspunkt.

Edit Images för din website i WordPress

Vi förstår att de flesta användare av WordPress ej är grafiska formgivare till yrket. Men att lära sig att använda bildredigeringsprogram för att skala storleken på images för din WordPress website är en bra färdighet att ha. Dessutom är det mycket enkelt att göra det.

WordPress har några grundläggande tools för att redigera images. För att använda dem går du bara till sidan Media ” Bibliotek och klickar på en image.

Detta öppnar bilden i en popup, där du ser en knapp för att editera bilden.

När du har gjort det bör du se alternativen för redigering.

Bland tools för edit finns grundläggande funktioner för att resize, croppa, rotera och flippa images.

Denna grundläggande bildredigering är praktisk om du snabbt behöver fixa en image issue. Det är dock ej det bästa sättet att editera dina images dagligen.

Lyckligtvis finns det flera gratis och billiga alternativ som du kan använda:

• Canva – gratis webbaserad programvara för redigering av images. Det innehåller även färdiga templates för images på websites, loggor, bilder på social media med mera.
• Pixlr – En freemium webbaserad programvara för redigering av images. Det kan användas för att enkelt resize images för dina blogginlägg.
• Gimp – Programvara för redigering av images med gratis och open source. Detta tool fungerar som en native desktop app på Windows, Mac och Linux. Det kan användas för att resize images, add to textlager, edit photos och mycket mer.

Vi hoppas att den här artikeln hjälpte dig att lära dig mer om bildstorlekar i WordPress och vilka bildstorlekar du ska använda på din website. Du kanske också vill se vår guide om hur man lägger till captions till featured images och hur man fixar featured image som ej visas i WordPress.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.