Оптимизация: автогенератор css-спрайтов

Главные вкладки

Аватар пользователя Химический Али Химический Али 13 марта 2009 в 11:10

На общеизвестном Webo.in в тестовом режиме заработал автогенератор css-спрайтов.

CSS-спрайт — это изображение, состоящее из нескольких других изображений и используемое в веб-дизайне для оформления, создания анимаций и других целей. С помощью специальным образом заданных параметров css в том или ином случае используется лишь часть изображения (спрайт или фрейм). Например, если у вас в меню используется набор иконок, вы можете объединить их в одно изображение, а для отображения просто указывать смещение:

Css спрайты, иллюстрация

За счет того, что иконки объединены в 1 файл, вы снижаете нагрузку на сервер, сокращая число запросов и трафик.

Так вот автогенератор css-спрайтов анализирует ваш css-файл и по возможности генерирует css-спрайты.

Посмотреть на это чудо можно тут: http://sprites.webo.in/

Подробнее о css-спрайтах тут: http://higher.com.ua/article/102/css-sprites-i-ikh-ispolzovanie
Или тут: http://webo.in/articles/habrahabr/08-all-about-css-sprites/

ВложениеРазмер
Иконка изображения css-sprites-illustration.jpg25.95 КБ

Комментарии

Аватар пользователя sunnybear sunnybear 13 марта 2009 в 13:45

Химический Али wrote:
Как я понял, он подбирает картинки одинакового размера и создает несколько спрайтов.

Алгоритм намного сложнее. Объединяются файлы произвольных размеров и произвольной цветовой гаммы. После этого видоизменяется исходный CSS-файл.

Аватар пользователя EllECTRONC EllECTRONC 13 марта 2009 в 16:26

я под пятерку модуль для друпала юзала давно, делает почти тоже самое, так напрочь забыла как модуль называется. Может кто тоже видел — напонмит?

Аватар пользователя sunnybear sunnybear 14 марта 2009 в 10:44

EllECTRONC wrote:
я под пятерку модуль для друпала юзала давно, делает почти тоже самое, так напрочь забыла как модуль называется. Может кто тоже видел — напонмит?

Может, этот?
http://drupal.org/project/sprites