Cum sa creezi imagini sprite automat

Spriteme.org

 Recent am gasit un sit ce ofera un serviciu util, cred, tuturor webmasterilor si creatorilor de situri web. Serviciul este gratuit, cel putin deocamdata, si consta in crearea de imagini sprite automat, din imaginile folosite de sit (in codul paginii sau in fisierele CSS).

 Pentru cei care nu stiu despre ce e vorba, am sa explic pe scurt. Cu cat sunt mai multe imagini inserate intr-o pagina web (site), sau orice alte elemente (javascript, flash, media, css, etc), cu atat pagina se va incarca mai greu. Apare deseori conflictul dintre dorinta de a crea un sit frumos, "colorat", si cea de a crea un sit simplu, rapid, insa mai putin atractiv ca si design. Din fericire, aceste elemente ce constituie pagina web se pot combina reducand, astfel, numarul de conexiuni dintre vizitatorul sitului si serverul ce gazduieste pagina web. Astfel creste viteza de navigare si de incarcare a paginilor web in browser (navigator). Fisierele javascript (js) se pot combina intre ele, CSS-urile de asemenea, iar imaginile des folosite (ca de exemplu imagini fundal pentru meniuri, butoane, chenare s.a.m.d.) se combina, deasemenea, in sprite-uri.

  Astfel, sprite-ul este o singura imagine ce contine toate celelalte imagini pe care le continea/folosea pagina web. O singura imagine inseamna o singura conexiune cu serverul si o viteza mult mai mare de incarcare a paginii in navigator.

 Situl ce ofera acest serviciu gratuit este spriteme.org. Pentru a crea sprite-uri din imaginile sitului dvs mergeti intai la spriteme.org si trageti bookmark-ul de pe pagina lor in meniul navigatorului. Vizitati apoi pagina sitului dvs si faceti click pe bookmark-ul spriteme.org din bara de link-uri favorite a navigatorului. Unealta este destul de inteligenta si va deschide o fereastra in care va recomanda numai anumite imagini; puteti sterge dintre ele ori adauga altele. In aceasta fereastra popup, odata ce ati decis ce imagini vor fi combinate, faceti click pe butonul Make Sprite; imaginile alese vor fi combinate. Dupa aceasta operatie faceti un click pe butonul export CSS - se va deschide o alta fereastra de unde puteti descarca imaginea sprite si vedea schimbarile ce trebuiesc facute in fisierul CSS.

Atat!

Atentie: imaginea sprite nu va fi gazduita pentru totdeauna de catre situl gazda, va trebui s-o descarcati in calculatorul dvs si s-o incarcati pe situl dvs. Bineinteles, puteti folosi alte servicii de gazduire imagini, precum Flickr, insa nu uitati sa modificaticodul CSS pentru a reflecta schimbarile facute.

Deasemenea, odata ce faceti click pe Make Sprite, unealta celor de la spriteme.org va afisa modificarile pe pagina dvs web a.i. puteti vedea daca totul functioneaza (va functiona) corect dupa ce veti face modificarile.