Prestandatips #2: Sprite Maps

Sprite maps är ett sätt att effektivisera hanteringen av grafik. Principen går ut på att man samlar alla grafiska objekt som gör upp designen på en webbplats i en enda bild. För att sedan visa de rätta grafiska objekten på sin plats använder css och ställer background-position tillsammans med höjd och bredd beroende på var i bilden det grafiska objektet finns.

Fördelen med denna teknik är att man minskar när de http-anrop som en webbläsare när den laddar in en sida och således snabbas inläsningen upp.

Det kan vara lite bökigt att sitta och mäta ut i en bild var de olika grafisk elementen hamnar. Turligt nog finns det bra verktyg för att skapa både bilderna och den css-kod som behövs. Website Performance har ett sådant verktyg.

Annonser

Kommentera

Fyll i dina uppgifter nedan eller klicka på en ikon för att logga in:

WordPress.com Logo

Du kommenterar med ditt WordPress.com-konto. Logga ut / Ändra )

Twitter-bild

Du kommenterar med ditt Twitter-konto. Logga ut / Ändra )

Facebook-foto

Du kommenterar med ditt Facebook-konto. Logga ut / Ändra )

Google+ photo

Du kommenterar med ditt Google+-konto. Logga ut / Ändra )

Ansluter till %s

%d bloggare gillar detta: