CSS-Duhovi: opis osnovnih tehnika i korisnih savjeta

Moderna stranice biti brz, lijep i učinkovit kako u fazi razvoja, a kada se radi s klijentom. U pravilu, svaka tvrtka koja stvara online resursa, traži da imaju svoje lice, privući posjetitelje svojim dizajnom, stilom, pouzdanost, brzina i drugih atributa.

Korisna svojstva sprites

CSS-duhovi mogu poboljšati oba kvalitativna obilježja na mjestu i image tvrtke. U svojoj srži, to nije previše komplicirano razvojni alat, ali zapravo ubrzava razvoj procesa i resursa, a brzina njihovog rada.

Između ostalog, pojednostavljuje kod i, u izvjesnom smislu, to je prenosiv na druge resurse koji, s obzirom na činjenicu da su korišteni CSS-duhovi su slični kao i bliskih srodnika, jer možete koristiti dijalog iste grafičke ideje, stil dizajn elemenata, struktura i sadržaj oznake.

U normalnom tijeku razvoja mjestu napraviti mnogo slika. Vrlo često, ove slike zauzimaju vrlo malo prostora, ali su uvijek zasebna datoteka. Za bilo koji operativni sustav bilo kojeg poslužitelja otvorite datoteku - Ovaj postupak je dugotrajan, međutim, neće značajno razlikuju s obzirom na vrijeme kada je datoteka otvorena na 13 po 13 piksela, a kad je datoteka otvorena od 16 slika 52 po 52 piksela. U prvom slučaju, imate 16 datoteke i 16 otvorenih / čitati operacija, u drugom slučaju 16 slika će se dobiti kao rezultat otvaranja samo jedne datoteke.

Ako stvorite skup datoteka na temu (vodoravnom izborniku, oblika dijaloga, elementi dizajna kalkulator tipke kalendar ...) da se takve slike mogu se kombinirati fleksibilno seli od mjesta do mjesta.

Loša strana

Kada su navijači, previše nestašan preporučuje korištenje CSS sprites su nužno oni koji su pažljivo proučavanje problema i jasno pokazuje da je uvijek praktično raditi na starinski način.

Doista, ako umjesto 16 slika slika jedna datoteka od 16 slika, 16 operacija, umjesto otvaranja / čitanja će biti jedan. Ali trik je da svaki browser ima cache, i to učitava nešto samo kao posljednji izbor. Osim toga, najčešće elemente stranice se učitavaju kada prvi put posjetite stranicu, a zatim učitava samo promijenila.

Drugi aspekt. Tipično, slika se reže, nije zalijepljen na jednu datoteku. Nekako je razvio tehnologiju, bolje je reći, običaj. Dizajner stvara izgled i raspored koristi svoja djela: sitno narezane komadiće izgledu. Protivnici duhovi vjeruju da je branje gore nekoliko slika u jednoj datoteci - konzumiranje aktivnosti, što povećava ukupni dizajn stranice.

Tu su oni programeri koji vjeruju i optimizirati broj HTTP zahtjeva, smatrajući da je to zanimanje je pragmatičan nego CSS-sprites.

Sva vremena navedene su nesumnjivo važni, ali mnogo važnije je pogled: ona bi trebala biti primijenjena u razumnim granicama.

Automatizacija i CSS-Duhovi

Ako nema smisla za rad u CSS generator i dobiti pravi dio dizajna, onda ništa jednostavno sprječava čine ovaj dio normalan način. Ako konvencionalna tehnologija čini da je potrebno smanjiti stotine slika, to je poželjno da se skicira JavaScript-funkciju, koja nužno će izabrati željeno područje sprite i prikazati ga.

Valja napomenuti, međutim, da je duh od dva ili tri elementa, ili drugih desetak - U redu, ali kada se u sprite stotina crteža, neke s pisanjem probleme JavaScript-funkcija, naravno, neće dogoditi, ali koliko posla će trajati do stvaranja tako veliki duh ... Osim toga, ljepilo slike - ovo CSS Sprite generator i čini željenu sliku i CSS koda za to, nije ga bilo briga koliko će konstitutivni elementi duh. Problemi nastaju kada preoblikovanje u web dizajn promjene, uklanjanje i dodavanje novih elemenata. Razvijanje sprite, trebali razmišljati ne o tome kako ga koristiti, i kako se to onda mijenjati.

Predmet korist koristeći sprites

Za razliku od CSS programskih jezika, to je relativno statična skup pravila svi njegovi dinamika određuje se prema pravilima i njihovoj funkcionalnoj sadržaja (standard). S obzirom na sprites u kompleksu, HTML, CSS može stvoriti tematske-funkcionalni dizajn knjižnice.

Na primjer, završio verzija izborniku: jednostavno spajanje više CSS-pravila, JS-funkcije i uključuju šifru HTML-divova, možete dobiti rezultat. Promjenom sadržaj slici sprite, možete promijeniti izgled izbornika. Određivanje tijelo funkcije, možete podesiti funkcionalnost.

Dobili svojstven varijantu na objektno orijentiranog programiranja (OOP). Naravno, to će biti sjajna ideja, ali to neće biti previše pametan da ističu na pozadini drugih OOP jezika, dijalekata pravi. To je samo u ranim 90-ih, kada je PLO je oživio i postao neobično brzo dobiti mjesto pod suncem, to je specifična ideja i konkretan oblik njezinog izražaja, ali sada programeri su došli do što više dijalekata kao što je raznolik ruski.

Igračke - A bogatstva za sprites

Uzbuđenje i programiranje - nekompatibilni koncepti, ali programiranje vještine, pisanje igre, osjetno se razlikuje od obschebytovoy (jednostavno šifriranje) i kreativnog (dizajn i razvoj novih tehnologija, ideja).

Igra dizajn žalbe na vektorske grafike, jer kombinacija SVG-sprites + CSS-pravila ne samo potražnje, ali često postaje predmet developer (stranice) za predmet stvarne igre. Konkretno, popularna igra Counter Strike primjenjuju se uvjetima u sprites, sprejevi sasvim smisleno Sinonimi: Eksplozija, krv, pogled ...

Fraza „postaviti Sprite CSS v34” za pokretanje je sasvim normalno i razumljivo. Duhovi se nalaze ne samo u korištenju komunalnih, u suštini, ali i formira niša, što je sasvim potpuno opremljena, pristupačne i lako razumjeti određeni krug potrošača.

CSS-sprites: Primjer

koriste se razne mogućnosti za određeni jezik za prebacivanje stranice na stranicu, ali ako je selektor jezik obavljati kao ikonu, rješenje pomoću sprite može izgledati ovako:

Očite nedostataka Duhovi

Prije svega, to je dugotrajan i pedantan proces. To je jedna stvar - za rezanje dizajna u male komadiće, a drugi - za prikupljanje sliku mnogo malih. Nanesite ideju platnu i stavite ga na sve slike se koriste na web-stranicama posve uzaludno.

Čak koristeći generator Duhovi CSS, poteškoće se ne može izbjeći, pogotovo kada je potrebno mijenjati dizajn stranice. Dodajte u nekoliko desetaka Sprite slika - to nije niz elemenata, grafika ima grafiku, to je obično samo prikazana na zaslonu, umjesto sortiranje kod kao polje pronaći pravu stavku.

Standard i nakon njega programere tvrde da je od Duhovi povezani s pozadinom politike koristi, to je samo pozadinska slika, a ne element stranice. Grafički sastavni elementi stranice treba manipulirati tag img.

Teško da se dogovore o jednostavnim kazni zbog toga, kada dovoljno pozadina je percipirana kao zajedničku pozadinu. To je samo pozadina, bez obzira što - minijaturna element ili čitava stranica.

U međuvremenu, grafički komponenta predstavljao ozbiljnu prepreku za korištenje sprites.

razumno korištenje

Unatoč činjenici da su pojmovi „Internet tehnologija” i „visoke tehnologije” se smatra sinonimom, u stvari, to je dugotrajan i ponekad vrlo low-tech posao. Duhovi nisu posebno obučeni u odnosu na druge uskih grla u čistom programiranje u JavaScriptu ili PHP, kao i na razvoj potrebne funkcionalnosti, procese punjenja stranica ili informacija, kao što su pozadine stvaranja arhivske kopije postavljanje.

Snaga i izgledi za korištenje sustava za upravljanje sadržajem često izravnati nijanse njihove praktične primjene i razvoja priručnik resursa, u pravilu, dovodi do potrebe za 1001. Vrijeme prepisati jedno ili drugo vlastiti algoritam.

U tom kontekstu, važno je samo razumno koristiti sve što nudi moderna alat. Nemojte biti previše nestrpljiv da koristite jedan nad drugim, a zlatno pravilo u položaj zgrade glasi: morate razmišljati ne o tome kako proći posao što je prije moguće, i kako ga izvršiti tako da se u slučaju bilo kakve nepredviđene situacije može biti brzo riješen bilo koji problem.