VândPupăză

In ultima vreme am acordat o atentie deosebita pentru CSS Image Sprites incercand sa gasesc solutia optima pentru proiectul la care lucrez. Pe drum am descoperit niste resurse interesante:

• Am gasit pe blogul Mozilla Webdev un articol foarte bun referitor la pozitia si logica aranjarii imaginilor intr-un sprite – foarte informativ, il recomand.
• In libraria imagemagick exista functia montage care permite imbinarea automatizata de surse intr-o singura imagine; are multe moduri de customizare si o gasesc foarte utila atunci cand lucrezi cu multe spre foarte multe imagini de acelasi dimensiuni (icons) iar sprite-ul evolueaza des prin adaugarea sau eliminarea de imagini.
• Google e foarte nazist in materie de CSS Image Sprites in sensul ca optimizeaza la maxim spatiul utilizat dar foloseste niste metode “nu-prea-web-standards” pentru a afisa continutul imaginii: elemente <span> in scop decorativ, goale, fara continut:

  
  <span class="csb ch" style="background-position:-76px 0;
  margin-right:34px;width:66px"></span>
  

  Folosind aceasta metoda developer-ul nu isi mai face griji pentru imagini care apar din greseala ca background din cauza supradimensionarii elementului caruia ii este atasat sprite-ul. Asta se intampla fiindca are control fin asupra dimensiunilor acelui <span> decorativ.

  <flame> Nu sunt neaparat impotriva acestei metode dar cred ca trebuie sa echilibrezi performanta si usurinta in mentenanta a template-ului cu izbucnirile iubitorilor inflacarati ai standardelor web care vor spune ca trebuie sa scrii markup semantic, iar un span gol, cu scop pur decorativ, este o incalcare flagranta a tot ceea ce este sfant si pur in HTML. </flame>