Vill du publicera skalade bilder på din WordPress-webbplats?
Nybörjare saktar ofta ner sina webbplatser genom att ladda upp bilder utan att uppmärksamma deras storlek. Att visa bilder som har rätt dimensioner kommer att förbättra WordPress-prestandan utan att försämra kvaliteten.
I den här artikeln visar vi hur du enkelt publicerar skalade bilder i WordPress.
Varför erbjuda skalade bilder i WordPress?
På din WordPress-webbplats behöver du bilder för dina blogginlägg, miniatyrer, sidhuvuden, omslagsbilder och mer.
Beroende på ditt tema kommer dessa bilder att ta upp ett visst antal pixlar. Till exempel kan din utvalda bild vara 680×382 pixlar och en miniatyrbild 100×100 pixlar.
Det är viktigt att använda bilder som har skalats för att passa de rätta måtten som behövs för din webbplats. Till exempel, om dina utvalda bilder är 680×382 pixlar, bör du spara dem exakt den storleken.
Annars kan din webbplats sakta ner eller minska kvaliteten på användarupplevelsen. Här är några vanliga orsaker till detta:
- Dina besökare måste ladda ner större filer än nödvändigt, vilket ökar laddningstiderna.
- Om du använder bilder med färre pixlar än det tillåtna utrymmet kommer de att se suddiga ut när de visas i större storlek.
- Din webbplats kommer att behöva ändra bildstorlekar i farten, vilket innebär att den måste köra fler processer innan du kan visa innehållet för användarna.
Hur som helst kommer det att ge dina användare en dålig upplevelse och kan även ha en negativ inverkan på din bilds SEO.
Det är därför om du testar din webbplats prestanda med GTMetrix-skanning, kommer det ofta att rekommendera att du tillhandahåller skalade bilder för att påskynda din webbplats.
Med det sagt, låt oss ta en titt på hur man enkelt publicerar skalade bilder i WordPress. Vi kommer att täcka två metoder:
Metod 1: Erbjud skalade bilder med en plugin
Det enklaste sättet att erbjuda skalade bilder är att använda ett plugin som automatiskt visar dina webbplatsbilder i rätt storlek. Denna metod är den enklaste men tillåter inte lika mycket flexibilitet som den andra metoden.
det fria optimal Plugin-programmet är ett av de bästa WordPress-bildkomprimeringspluginerna och kommer automatiskt att skala dina bilder. Men om du får fler än 5 000 besökare per månad behöver du premiumversionen.
Först måste du installera och aktivera Optimole-plugin. För mer information, se vår steg-för-steg-guide om hur du installerar ett WordPress-plugin.
Vid aktivering tas du automatiskt till Media » Optimole sida och du kommer att bli ombedd att registrera dig för en API-nyckel eller ange din befintliga API-nyckel. Det här är väldigt enkelt.
Se bara till att din e-postadress är korrekt och klicka sedan på knappen “Skapa och anslut ditt konto”. Anslutningen till Optimole kommer att göras automatiskt. Du behöver inte ens besöka en annan webbplats eller klistra in nyckeln manuellt.
Optimole kommer nu att börja optimera dina bilder i bakgrunden. Den kommer automatiskt att välja rätt bildstorlek för varje besökares enhet och webbläsare, och bilder kommer att levereras från den snabba Optimole molntjänst CDN.
När du klickar på fliken Inställningar ser du att bilderna på dina inlägg och sidor automatiskt kommer att ersättas med de som är optimerade och skalade av Optimole.
Detta görs inte direkt eftersom det görs via ett CDN, vilket innebär att din webbplats inte kommer att se prestandapåverkan.
Dessutom har plugin-programmet aktiverat lazy loading, vilket innebär att bilder på sidan som för närvarande inte är synliga inte kommer att laddas förrän de behövs. Detta är ett annat effektivt sätt att minska sidladdningstiden och förbättra webbplatsens prestanda.
Dessa inställningar fungerar bra för de flesta webbplatser. Du kan dock anpassa Optimole ytterligare med hjälp av “Avancerade” menyinställningar för att se vad som fungerar bäst för din webbplats.
Om du gör några ändringar i inställningarna, glöm inte att klicka på knappen “Spara ändringar” längst ner på sidan.
Metod 2: Publicera manuellt skalade bilder
Du kan även skala bilder utan ett plugin. Det finns tre sätt att göra detta: du kan använda bildredigeringsprogram, bildredigeringsfunktionen i WordPress Media Library eller genom att ändra värdena i WordPress Media Settings.
Skala bilder med bildredigeringsprogram
Du kan skala dina bilder till rätt mått innan du laddar upp dem till din webbplats med hjälp av fotoredigeringsprogram på din dator, som Adobe Photoshop eller Affinity Photo.
Programvaran låter dig välja rätt antal pixlar för din bild och spara den med en liten filstorlek och det filformat du föredrar.
Till exempel, här är en skärmdump som visar Affinity Photos beskärningsverktyg.
Förutom att justera bildstorleken från början finns det andra saker du kan göra innan du laddar upp bilder för att se till att de inte gör din webbplats långsammare.
För mer information, se vår guide om hur du optimerar bilder för webbprestanda.
Skala bilder i WordPress Media Library
Visste du att du kan göra grundläggande bildredigering i WordPress? WordPresss redigeringsfunktion för bild låter dig beskära, rotera, vända och skala bilder.
När du redigerar ett inlägg eller sida måste du klicka på bilden du vill redigera. Därefter måste du klicka på knappen “Ersätt” och sedan välja “Öppna mediebibliotek” från menyn.
Detta öppnar WordPress mediebibliotek med den valda bilden.
Till höger finns ett område där du kan lägga till alt-text, en titel, en titel och en beskrivning för din bild. Du hittar också länken “Redigera bild”.
Klicka bara på den länken för att gå till sidan “Redigera bild”.
Här hittar du en förhandsvisning av bilden, redigeringsknappar och flera andra alternativ som är användbara när du skalar eller beskär bilden.
För att skala bilden, ändra helt enkelt ett av värdena för ‘Nya dimensioner’ i Skala bild till höger.
Till exempel har den här bilden en mycket stor upplösning på 2560×1637 pixlar. Vi kan minska den till en bredd av 1200 pixlar genom att skriva i det första fältet ‘Skala bild’.
Allt du behöver ändra är bredden eftersom bildens höjdvärde ändras automatiskt för att hålla bilden i proportion.
Därefter klickar du helt enkelt på knappen “Skala” för att ändra bildens upplösning.
Observera att du bara kan skala ner en bild i WordPress. Du kan inte förstora bilder genom att öka bildens mått.
För detaljerade instruktioner, se våra guider om hur du utför grundläggande bildredigering i WordPress och hur du beskär och redigerar WordPress-inläggsminiatyrer.
Justera bildstorleken i mediainställningar
När du laddar upp bilder till din webbplats skapar WordPress automatiskt flera kopior i olika storlekar. Du kan anpassa dessa storlekar genom att besöka Inställningar » Media sida i ditt WordPress-administratörsområde.
Här kan du enkelt ändra mått på miniatyrbilder, medium och stora bildstorlekar.
På vissa webbplatser kan du behöva fler bildstorlekar än bara miniatyrbild, medium och stor. Du kan lära dig hur du skapar dessa storlekar genom att följa vår guide om hur du skapar ytterligare bildstorlekar i WordPress.
Om du ändrar standardbildstorlekarna eller skapar ytterligare bildstorlekar kommer endast nya bilder att påverkas. Du måste återskapa bildstorlekar för befintliga bilder.
När du lägger till en bild i ett inlägg eller en sida kan du välja en bildstorlek i inställningsblocket till vänster på sidan.
Vi hoppas att den här handledningen hjälpte dig att lära dig hur du publicerar skalade bilder i WordPress. Du kanske också vill lära dig hur du skapar en målsida eller kolla in vår lista med plugins för sociala medier för WordPress.
