Стоит ли внедрять css-спрайты на сайте?

Если переведете - пригласите посмотреть, как вы такое реализуете! :)

Т.е. на какой-то странице, где нужно будет грузить 1-2 изображения, вы будете грузить спрайт с 10-20-30 в одном большом?

Вопрос нагрузки тут не стоит. Это статика и скорее всего её отдает nginx. Спрайты делаются для ускорения загрузки сайта, т.к. одновременно браузер грузит только 4 (6?) файлов по-очереди с одного домена.

По опыту, толку от быстродействия в плане раскрутки нет. С фанатизмом подходил к этому делу, сайт открывался за секунду и по оценке гугла качество 99 из 100. Другое дело, что вы можете задержать посетителя за счет того, что ему понравится скорость. Но одними спрайтами не обойдешься, это комплекс работ.

---------- Добавлено 23.05.2014 в 01:44 ----------

Закажите у меня аудит, много полезных рекомендаций получите.

спрайты используют для ускорения загрузки страниц, обычно в спрайты вставляют все элементы сайта - фоновые картинки, иконки, кнопочки и тд, это избавит в дальнейшем от подгрузки фоновой картинки при ховере, к примеру.

Переводить основной контент в спрайты - странно и не понятно, зачем?

Займитесь оптимизацией картинок, их сжатием, сжатием css файлов, js, оптимизацией верстки, смените сервер на более быстрый, купите сервера более мощные. Но ждать пока загрузятся фотографии используемые в спрайте - НЕ НУЖНО!

Плюс у Вас не будут индексироваться картинки поисковыми сетями, ибо нет наличия тега <img> на странице.

Я конечно могу и ошибаться, но по мне, верстка фотографий спрайтами - это глупо и не разумно

Посмотрите анализ: http://developers.google.com/speed/pagespeed/insights/?url=www.lightplit.ru

самой бы посмотреть такое где-нить сперва ))

у нас нет страниц с 1-2 картинками, кроме статей/новостей, но для них спрайты я не рассматриваю.

я хотела объединить декоры в спрайты по линейкам, т.е. не все 20-30 картинок в один спрайт, а разбив на категории. Это позволило бы с наименьшими затратами времени вносить коррекции в декоры в случае их изменения.

---------- Добавлено 23.05.2014 в 10:55 ----------

Отличная подсказка, займусь, спасибо!

---------- Добавлено 23.05.2014 в 11:03 ----------

Из того, что читала про спрайты сделала для себя вывод, что это не только ускорение загрузки (несомненный плюс для клиентов), но и сокращение http запросов к серверу (техническая оптимизация сайта), что значительно уменьшает нагрузку на него. Получается не так?

ps занялась темой спрайтов после того, как от хостинг пришла пара писем, что как раз создаем сильную нагрузку. Это происходило в периоды запуска директа, т.е. когда на сайте увеличивался поток клиентов, которые, пробежав по страницам продукции, подгрузив все декоры на них, в разы увеличивали количество http-запросов (информация от службы поддержки хостинга).

по поводу http запросов все правильно.

про какие именно декоры Вы говорите? я вижу на сайте каталог в котором есть фото, они не могут вешать сервер хостинга, если у Вас конечно не 1 млн посетителей был. Нужно разбираться в движке либо уже у Вас вирус, который вешает сервер

У вас 36 css файлов 🤪 и 15 мелких картинок, которые можно свернуть в одну.

Думаю, что лучше будет всё же начать с уменьшения количества css файлов ;)

декоры - это картинки (img) с изображением цвета продукции.

вот тут http://www.lightplit.ru/products-and-prices/stenovye-egger -их около 60.

http://www.lightplit.ru/products-and-prices/negorychie-stenovye - 22 шт.

http://www.lightplit.ru/products-and-prices/tss-panels - 25 шт

http://www.lightplit.ru/products-and-prices/mdf-vysokoglyanetz - тут должно было быть порядка 90 шт..., но когда я их залила на сайт в этот раздел (общий их вес был 7 МБ), сайт вообще повис, и мы получили очередное письмо о чрезмерной нагрузке на сервер... пришлось пока обойтись одной общей картинкой...

а на подходе еще несколько страниц с продукцией...

но пока тут я не услышала ни одного мнения "за перевод в спрайты", поэтому наверное придется отказаться от этой идеи ((

а такими логичными они сперва казались (спрайты)

Annaiva, у меня дохлый интернет, но все ваши странички грузятся довольно шустро.

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

Например, я не понял, зачем на странице http://www.lightplit.ru/products-and-prices/stenovye-egger сделаны кликабельными картинки "Монтажный профиль. Стоимость.", если они все равно такие же маленькие, как и превьюшки.

Оптимизировать сами картинки - я загрузил у вас какой-то образец "дерева", так картинка тяжелее, чем картинка в два раза больше по пикселям и с кучей мелких деталей.

Тупо пересохранил картинку в ACDSee - она стала в 2,5 раза легче.

И лучше смените хостинг на впс, что б неполучать таких писем и самому следить за нагрузкой.