Модерният уебсайт трябва да бъде бърз, красив и ефективен както на етапа на разработване, така и при работа с клиента. Като правило, всяка компания, която създава интернет ресурси, иска да има собствено лице, привлича посетители с техния дизайн, стил, надеждност, скорост и други качества.

Полезни свойства на спрайтовете

CSS-спрайт позволява да се подобрят както качествените характеристики на сайта, така и имиджа на компанията. По същество той не е много сложен инструмент за разработчика, но наистина ускорява процеса на развитие на ресурсите и скоростта на тяхната работа.


Наред с други неща, кодът е опростен и в известен смисъл става поносим за други ресурси, които поради факта, че CSS спрайтът се използва, стават подобни на близки роднини, тъй като можете да използвате същите графични идеи, стил на дизайн елементи на диалога, структурата и съдържанието на етикетите. В нормалния процес на разработване на уеб сайт трябва да направите много снимки. Много често тези снимки заемат много малко място, но те винаги са отделен файл. За всяка операционна система на всеки сървър отварянето на даден файл отнема много време, но няма да се различава значително по времето, когато файлът се отвори 13 на 13 пиксела и когато се отвори файл с 16 изображения 5252 пиксела. В първия случай е необходимо да има 16 файла и 16 операции за отваряне /четене, във втория случай ще бъдат получени 16 изображения в резултат на отваряне само на един файл. Ако създавате набори от такива файловепо предмет (хоризонтално меню, диалогови форми, бутони на калкулатора, елементи от календара), тогава такива агрегати от изображения могат да се прехвърлят от сайта към мобилния.

Обратната страна на медала

Когато има фенове, твърде ярко препоръчваме използването на спрайт CSS, има непременно тези, които внимателно изучават въпроса и ясно показват, че винаги е по-практично да се работи по стар начин , Всъщност, ако вместо 16 картинки има един файл от 16 снимки, тогава вместо 16 операции, отварянето /четенето ще бъде едно. Но трикът е, че всеки има кеш на браузъра и той зарежда всичко в екстремни случаи. В допълнение, елементите на страниците обикновено се зареждат при първото посещение на страницата и след това се зареждат само промените. Друг аспект. Обикновено изображенията се изрязват, а не се залепват в един файл. По някакъв начин технологията се е развила и, по-добре, обичай. Дизайнерът създава оформление, оформлението използва парчета фино нарязани части от оформлението. Противниците на спрайтовете вярват, че събирането на множество изображения в един файл е време, което отнема много време, което увеличава общото време за развитие на страницата. Има и разработчици, които разглеждат и оптимизират броя на HTTP заявките, като се има предвид, че този урок е по-прагматичен от CSS спрайт. Всички тези въпроси, разбира се, имат значение, но много повече е идеята: всичко трябва да се приложи в разумни граници.

Автоматизация и CSS спрайт

Ако няма смисъл да се изпълнява CSS генераторът на спрайт и да се получи правилниятчаст от дизайна, тогава нищо не пречи да се направи тази част от обичайния начин. Ако обичайната технология води до необходимостта от намаляване на стотици изображения, по-добре е да се хвърли javascript-функция, която, ако е необходимо, избира региона от спрайт и го показва.
Трябва да се отбележи обаче, че един дух от два или три елемента или дузина други - където не е отишъл, но когато става дума за стотици чертежи, тогава с писането на javascript-функция проблеми, разбира се, няма да възникнат, но колко работа \ t В допълнение, залепване на снимки - този, CSS спрайт генератор прави желаното изображение, а CSS кодът е под него, то е абсолютно същото, колко ще са компонентите на спрайт. Проблеми ще възникнат при обработка на сайта, промяна на дизайна, изтриване и добавяне на нови елементи. При разработването на спрайт не трябва да мислите как да го използвате, а как да го промените по-късно.

Тематична полза от използването на спрайтове

За разлика от езиците за програмиране на CSS, това е относително статичен набор от правила, цялата му динамика се определя от правилата и тяхното функционално съдържание (според стандарта). Като се има предвид спрайт, HTML, CSS в комплекс, можете да създавате библиотеки за тематичен дизайн. Например, завършената опция в менюто: просто свързване на множество css-правила, js-функции и включване на няколко HTML-кода в кода, можете да получите резултата. Промяната на съдържанието на изображението на спрайт може да промени вида на това меню. След като прецизирате тялото на функцията, можете да регулирате функционалността. Това ще бъде един вид вариантОбектно-ориентирано програмиране (ООП). Без съмнение това ще бъде ярка идея, но тя няма да бъде прекалено ярко изпъквана на фона на други диалекти на ООП на реални езици. Едва в началото на 90-те, когато ООП се възроди и стана изключително бързо да завладее мястото под слънцето, тя представляваше конкретна идея и конкретна форма на неговото изразяване, а днес разработчиците са измислили толкова много диалекти, колкото много различни езици.

Играчките - златното дъно за спрайтове

Хазартът и програмирането са несъвместими концепции, но квалификацията на програмист, пише игри, е значително различна от общата (просто кодиране) и творческата (проектиране и разработване на нови технологии и идеи). Дизайнът на играта се харесва на векторната графика, така че комбинацията от SVG-спрайт + CSS-правила не е само търсене, но често се трансформира от обекта на разработчика (сайта) в обекта на реалната игра. По-специално, популярната игра Counter Strike се отнася за термините спрайт, спрей е напълно разбрано синоними: експлозия, кръв, поглед Фразата "инсталирай спрайт css v34" за посветен напълно нормален и разбираем. Sprite получи не само полезността на приложението по своята същност, но и създаде ниша, която стана напълно пълна, достъпна и разбираема за определен кръг потребители.

CSS спрайт: пример

Различни варианти се използват за превключване на страници на сайт на един или друг език, но ако селекторът на език се изпълнява като икона, тогава решението, което използва спрайт, може да изглежда така:

Очевидните недостатъци на спрайтовете

На първо място, това е труден и скрупулен процес. Едно нещо е да изрежете дизайна на малки парченца, а другият - да съберете една снимка от много малки. Прилагайте идеята за платно и поставете върху него всички изображения, които се използват на сайта, абсолютно безнадеждни. Дори и при използване на генератор на спрайт на CSS, трудностите не могат да бъдат избегнати, особено когато става въпрос за ре-проектиране на сайта. Сложете десетки снимки в случая - това не е набор от елементи, графиките са графики, обикновено просто извеждани на екрана, но не преглеждайте кода като масив в търсене на желания елемент. Стандартът и такива разработчици твърдят, че когато спрайт е свързан с фоновото правило, това е само фоново изображение, а не елемент на сайта. Графичният компонент на елементите на страницата трябва да се манипулира с img тагове. С това е трудно да се съгласим по простата причина, че фонът е малко, когато се възприема като общ фон. Това е само фон, без значение какво е миниатюрен елемент или цялата страница като цяло. Междувременно графичният компонент сам по себе си е сериозна пречка за използването на спрайтове.

Интелигентно използване

Въпреки факта, че термините „интернет технология“ и „високи технологии“ се считат за синоними, на практика това е трудоемка и понякога много нетехнологична работа. Спрайт не е особено уязвим по отношение на други пречки в чистото програмиране на javascript или PHP, както и в развитието на необходимата функционалност, настройката на процесите на попълване на сайтовете с информация или, например, фонасъздаване на архивни копия. Силата и обещанието на система за управление на съдържанието, използван понякога изравни нюансите на практическото им ръка прилагането и развитието ресурси обикновено води до необходимост от 1001-то време, за да пренапише конкретен Специален алгоритъм. В контекста на горепосоченото е важно просто да се използва в разумни граници всичко, което осигурява съвременният инструмент. Тя не трябва да бъде твърде трудно да се приложи един за сметка на друг, и златното правило в строителна площадка гласи следното: да се мисли не за това, как да се премине на работа възможно най-скоро, и как да го изпълни така, че в случай на непредвидено ситуация би могла да бързо решаване на всеки проблем.