Så blir er webbsida snabbare för besökaren

I dagarna släpptes WordPress 4.4 “Clifford”!
Som vanligt är det en hel del småbuggar som har åtgärdats, men den största förändringen denna gången är, som så många har väntat på, stödet för responsiva bilder!

Detta låter kanske inte som en stor sak för de flesta, då många webbsidor sedan långt tillbaka redan är responsiva. MEN det är skillnad på responsiv och responsiv…

Det nya responsiva stödet innebär att man från och med version 4.4 av WordPress inte längre behöver installera specifika plugins och externa javascript för att få till riktigt hantering av responsiva bilder.

Stora bilder blir små

Många webbsidor har stöd för att innehållet på sidan automatiskt anpassar sig i storlek beroende på enhetens skärmstorlek (exempelvis ser vår webbsida annorlunda ut på en smartphone jämfört med en vanlig datorskärm). Sidorna är responsiva MEN, oftast är det fortfarande en och samma stora bildfil som används och som laddas in av webbläsaren.

Just nu ligger snittet på storleken för en webbsida på över 2MB. Av dessa 2MB är det hela  1.4MB som består av bilder!
Källa: https://httparchive.org/interesting.php?a=All&l=Dec%201%202015

Detta betyder att en bild som ska se bra ut på en stor skärm exempelvis måste ha ett mått på 1200*800 pixlar. Det som sker på en mindre skärm är att samma bild används men visas i en mindre storlek. Samma datamängd (filstorleken på bilden) laddas dock in, även om bilden ser mindre ut! Kort och gott man man säga att man laddar in en onödigt stor bild och därmed även onödigt mycket data förbrukas på ditt mobila bredband :-/

Fler storlekar ger snabbare laddningstid

Med det nya responsiva stödet i WordPress skapas det automatiskt flera versioner av en och samma bild; En för varje storlek (som är fördefinierat i systemet) som ska visas för respektive skärmstorlek (smartphone, padda eller desktop).

responsiva-bilder

Vanlig kod:

<img class="alignnone size-large wp-image-9907" src="//skapa.se/wp-content/uploads/2015/12/sunglasses-computer-smartphone-desk-1024x683.jpg" alt="Dator på bord - webb för land vs språk" width="1000" height="667">

Automatiskt inlagd från och med version 4.4:

<img class="alignnone size-large wp-image-9907" src="//skapa.se/wp-content/uploads/2015/12/sunglasses-computer-smartphone-desk-1024x683.jpg" alt="Dator på bord - webb för land vs språk" width="1000" height="667" srcset="//skapa.se/wp-content/uploads/2015/12/sunglasses-computer-smartphone-desk-300x200.jpg 300w, //skapa.se/wp-content/uploads/2015/12/sunglasses-computer-smartphone-desk-1024x683.jpg 1024w, //skapa.se/wp-content/uploads/2015/12/sunglasses-computer-smartphone-desk-150x100.jpg 150w, //skapa.se/wp-content/uploads/2015/12/sunglasses-computer-smartphone-desk-225x150.jpg 225w" sizes="(max-width: 1000px) 100vw, 1000px">

 

Med tanke på att WordPress idag står för 25% av alla webbsidor på nätet kan man ju förstå att det nya stödet för responsiva bilder på sikt dramatiskt kommer att förändra hela mängden data / bandbredden som används.
Källa: https://w3techs.com/technologies/overview/content_management/all

Miljontals webbsidor kommer att leverera sjukt mycket mindre data till besökarens webbläsare. Med andra ord,  webben kommer att bli snabbare! Speciellt för mobilanvändarna.

Hur får man igång responsiva bilder på sin webbsida?

Enkelt, version 4.4 av WordPress gör jobbet åt dig! Dina gamla bilder och inlägg kommer automatiskt att anpassas med den kod som krävs för att visa rätt bild vid rätt tillfälle.

Det bör noteras att för att WordPress överhuvudtaget ska kunna skapa fler storlekar av en uppladdad bild, så måste originalet givetvis vara större än de mindre versionerna som ska skapas.

Fler uppdateringar i WordPress 4.4

Förutom stödet för responsiva bilder fanns bland annat även dessa uppdateringar med i den senaste utgåvan:

  • Bättre stöd för taxonomies. Det går enkelt att lägga till färger och ikoner för respektive “kategori”.
  • REST API börjar ta form. Vilket betyder att man kan använda WordPress som grunden för ett helt annat system och på så vis hantera datalagringen via WordPress, men exempelvis presentera informationen i ett helt annat system, på en helt annan server. Detta medför dessutom att det kommer att bli enklare för andra CMS att prata med WordPress.

Alla uppdateringar i nya WordPress 4.4 finner ni här 

Viktigt: Innan ni uppdaterar WordPress bör ni först säkerställa att era befintliga plugins och att temat har stöd för den senaste versionen.

Vi har lång erfarenhet av WordPress och har genom åren hjälpt många företag med att ta fram nya webbsidor som är baserade på WordPress.

Behöver ni hjälp med att ta fram en ny webbsida eller behöver ni support med er befintliga? Kontakta oss gärna så berättar vi mer.
  • Art Director

Jag är Art Director med total fokus på online media vilket i sig innebär stor fokus på interaktion och gränssnitt. Ett intuitivt, interaktivt och snyggt gränssnitt på ett system, en applikation eller en webbsida är ofta helt avgörande för dess framgång. Oavsett vad ditt företag sysslar med så värderas det utifrån hur det presenteras, idag mer än någonsin kanske. Om inte formen ger rätt intryck eller lockar till vidare läsning letar besökare på webben vidare efter någon annan som levererar just detta.

Lämna en kommentar

Din e-postadress kommer inte publiceras. Obligatoriska fält är märkta *