Ich habe das bei einigen Bildern in meinem Blog ausprobiert, bei denen Google Page Speed ein Sprite vorgeschlagen hat. Im Großen und Ganzen finde ich das Teil sehr vielversprechend, vor allem wenn die kleinen Kinderkrankheiten beseitigt werden.
Folgende Dinge sollten aus meiner Sicht verbessert werden:
1. Eine von mir nicht hochgeladene max.png taucht auf:
/* image: max.png */
#image0 {
background: url(/web/tmp/63fe6/f6098.png) no-repeat;
background-position: -652px -284px;
width: px;
height: px;
}
2. Das Skalieren der Box ist recht kompliziert. Eine Option "Fit to size" wäre cool.
3. Relative statt absolute Pfade, also url(f6098.png)
4. background-position in den background Ausdruck integrieren
5. Eine minimierte CSS-Datei (optional) zum Download anbieten.
Folgendes CSS wurde bei mir im Gesamten erzeugt:
/* image: max.png */
#image0 {
background: url(/web/tmp/f42b5/402c9.png) no-repeat;
background-position: -113px -6px;
width: px;
height: px;
}
/* image: border.png */
#image1 {
background: url(/web/tmp/f42b5/402c9.png) no-repeat;
background-position: 0px 0px;
width: 1px;
height: 2px;
}
/* image: delicious.png */
#image2 {
background: url(/web/tmp/f42b5/402c9.png) no-repeat;
background-position: -1px 0px;
width: 18px;
height: 18px;
}
/* image: diggman.png */
#image3 {
background: url(/web/tmp/f42b5/402c9.png) no-repeat;
background-position: -19px 0px;
width: 16px;
height: 14px;
}
/* image: email_link.png */
#image4 {
background: url(/web/tmp/f42b5/402c9.png) no-repeat;
background-position: -35px 0px;
width: 16px;
height: 16px;
}
/* image: facebook.png */
#image5 {
background: url(/web/tmp/f42b5/402c9.png) no-repeat;
background-position: -51px 0px;
width: 16px;
height: 16px;
}
/* image: googlebookmark.png */
#image6 {
background: url(/web/tmp/f42b5/402c9.png) no-repeat;
background-position: -67px 0px;
width: 16px;
height: 16px;
}
/* image: printfriendly.png */
#image7 {
background: url(/web/tmp/f42b5/402c9.png) no-repeat;
background-position: -83px 0px;
width: 16px;
height: 16px;
}
/* image: reddit.png */
#image8 {
background: url(/web/tmp/f42b5/402c9.png) no-repeat;
background-position: -99px 0px;
width: 18px;
height: 18px;
}
/* image: twitter.png */
#image9 {
background: url(/web/tmp/f42b5/402c9.png) no-repeat;
background-position: -117px 0px;
width: 16px;
height: 16px;
}
/* image: xml.gif */
#image10 {
background: url(/web/tmp/f42b5/402c9.png) no-repeat;
background-position: -133px 0px;
width: 12px;
height: 12px;
}

Hilfe
Neues Thema
Antworten


Nach oben

