powered by simpleCommunicator - 2.0.61     © 2026 Programmizd 02
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / CSS sprites (спрайты): pro et contra
10 сообщений из 10, страница 1 из 1
CSS sprites (спрайты): pro et contra
    #38134898
Фотография iConst
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Господа,
не стал делать в виде опроса - просто за и против... плыйз!

Перевернув мир - оглянись, может перевернулся ты сам?!
...
Рейтинг: 0 / 0
CSS sprites (спрайты): pro et contra
    #38134918
IDVsbruck
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Что-то на скорую руку не припомню случаев, когда кроме масштабирования и ресайза картинки есть провопоказания на использование спрайта.
...
Рейтинг: 0 / 0
CSS sprites (спрайты): pro et contra
    #38135091
st_st
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Лень их делать. Сидишь в фотошлёпе собираешь этот пазл, потом дизайнер чё-нить изменил по размерам и уже не заменишь старую картинку (если новая больше), приходится вставлять ниже/сбоку, чтобы весь css не переделывать, в итоге всё это разрастается и весит уже больше, чем было бы без спрайтов. И ещё один момент - приходится строить по сетке, с отступами в несколько пикселей от ближайших элементов, иначе при изменении масштаба в браузере, на элементах становится видна часть соседнего рисунка, что опять же увеличивает вес изображения.

По мне так проще выделить отдельный css, загнать туда рисунки в data-image, а на ie7... а на ie7 забить, ну или лепить mhtml/отдавать рисунки как есть. Или даже так - при деплое автоматом собирать все нужные css, выбирать из css бэкграунды, перегонять их в base64, отправлять на сервер минификации, полученый код записывать в результирующий style.min.css?v=2 и деплоить на сервер. Это всё относительно вёрстки, динамику - фото товаров и прочее в <img> оставляем как есть.

Код на C# приветствуется.

А спрайты - стало лень их делать, поэтому без них, хотя даже online-генераторы какие-то есть, но не пользовался.
...
Рейтинг: 0 / 0
CSS sprites (спрайты): pro et contra
    #38135184
ShSerge
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Никогда не пользовался. Даже, когда карточные игры писал. С картинками как-то проще. Чисто имхо.
...
Рейтинг: 0 / 0
CSS sprites (спрайты): pro et contra
    #38135304
IDVsbruck
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Так само собой! Лепить всегда и везде спрайты - это слишком расточительно.

Из собственного опыта варианты, когда обязательно делаю:
1. Есть список стран (location) и в выпадающем списке показывается флажок и название (еще есть приоритет - вначале идут популярные страны, а потом остальные). Изначально в базе было id (двухбуквенное название по ISO), дефолтное название на английском, нативное написание в UTF8 и флаг в base64 16x11 (еще таблица названий на языках интерфейса, но это неинтересно). И при запросе я отдавал список нужных значений, обычно связка id, title_interface, flag. И обьчно динамическим запросом, дабы не заморачиваться. Но так как страница компонуется динамически, то имело смысл аттачить массив к странице. Тут я офигел: добавлялось около 300 килобайт текста, причем, без кеширования, так как страница динамическая. Добавлять отдельным файлом - почти то же, иногда кешировалось, иногда - нет. Сделал спрайт 26х26 - сколько букв в английском алфавите и на пересечении первой и второй букв id ставлю флажок страны. Понятно, алгоритм получения простейший. Размер png-файла 60 кило (подпишусь на расширенный PunyPNG - обещают около 20 КБ). Понятно, он всегда кешируется.

2. Есть масса элементов, которые используют иконки - выпадающие списки, эдиты, чекбоксы, радиобаттоны, календари, социальные иконки и т.д. - все одинаковото маленького размера. Держать всю эту прорву в отдельных файликах - неудобно и расточительно. Понятно, все стянул в один png с фиксированной сеткой.

3. Анимация. Есть пару элементов, где юзаю анимацию. Удобнее, конечно, было бы гифами, но а) очень я их не люблю; б) нужна реальная прозрачность. Идеальным было бы использование анимационного png, но его почти никто не поддерживает. Спрайт - наиболее удобное хранилище.

... и когда категорически против:
1. Переключение языка интерфейса происходит путем изменения параметра сессии (с последующей записью в кукисы, но всем этим занимается Спринг). Соответственно, страница перегружается, спецтэги подтягивают нужный текст, а графические заголовки я меняю крайне просто и эффективно - ссылки на локализованные картинки выглядят примерно так: src="images/headers/${language}/someHeader.png", при изменении языка меняется параметр и соответственно меняется ссылка. А наполнение папок одинаковое. Логичным было бы делать спрайт для этого и менять смещение для картинки ... Но! Заголовки - не иконки - есть на 3 кило, а есть и за 20. Их много. А предположительно, один пользователь использует обычно один язык. Зачем ему скармливать в 3 раза больше (на данный момент) и до 8 раз (планируемое количество языков)? Из соображения экономии трафика против использования.

2. Реальные картинки - изображения, скрины, иллюстрации и т.д. Все то, что подпадает под контент, а не сопроводиловку.

3. Как и предыдущий пункт - об этом сказали выше. Всякого рода "требуха" - мини-стрелочки, точечки, кусочки разделителей, элементы для горизонтального или вертикального масштабирования, которые очень путались бы на едином полотне. Их удобно скормить в CSS в base64.

Хотя все это достаточно относительно. Если посмотреть на серьезные сайты гигантов, то они не просто используют спрайты, а фактически все, кроме контента, идет в спрайтах. Так легче поддерживать. Поэтому доводы доводами, а отношение к разработке, поддержке и сопровождению у всех разное. Как и пристрастия ...
...
Рейтинг: 0 / 0
CSS sprites (спрайты): pro et contra
    #38135432
Фотография iConst
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Промежуточный итог: спрайт призван только для одного - уменьшить число запросов.
Даже, если 304 , то большое количество запросов порождает существенный трафик - заголовки не сжимаются, плюс задержки на ответы.

Конкурентом является метод CSS в base64 , который позволяет достичь того же. Таким образом вопрос несколько изменяется: sprites vs base64 .

ПС: Мерзкий огрызок
подкинул проблем в виде Retina дисплея. Конкуренты кинулись вдогонку... туши свет...
...
Рейтинг: 0 / 0
CSS sprites (спрайты): pro et contra
    #38135477
IDVsbruck
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Да не меняется вопрос. Думать просто надо и все.
...
Рейтинг: 0 / 0
CSS sprites (спрайты): pro et contra
    #38136048
mage.lan
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
iConstПС: Мерзкий огрызок
подкинул проблем в виде Retina дисплея. Конкуренты кинулись вдогонку... туши свет...
Я че-та не заметил сколько нибудь серьезных проблем с ретиной. А андроид - не жалко, сами виноваты.
...
Рейтинг: 0 / 0
CSS sprites (спрайты): pro et contra
    #38136182
Фотография Antonariy
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
mage.lanЯ че-та не заметил сколько нибудь серьезных проблем с ретиной.UPgradeПервые немногочисленные пользователи ноутбуков [с ретиной] сообщают, что часто после закрытия той или иной программы после нее на экране остается "оттиск", особенно хорошо заметный на светлом фоне. Это происходит и при выходе компьютера из режима сна. При этом "призрачное" изображение пропадает само собой минут через 5-6. Компания Apple пока официально никак не прокомментировало эту информацию.
...
Рейтинг: 0 / 0
CSS sprites (спрайты): pro et contra
    #38136257
Фотография iConst
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
mage.lan,

Проблема, если только хочется угодить "ретивым" владельцам - подготовка изображений бОльшего размера - т.е. адаптация страницы под сумасшедшее разрешение...
...
Рейтинг: 0 / 0
10 сообщений из 10, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / CSS sprites (спрайты): pro et contra
Найденые пользователи ...
Разблокировать пользователей ...
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]