Оптимизация изображений на Drupal-сайтах для повышения скорости — блог Drudesk
050 640 98 44
support@drudesk.com

Оптимизация изображений на Drupal-сайтах как рецепт повышения скорости

На первый взгляд, интересные и качественные изображения — лучшие друзья сайта. Часто именно они решают, подарит ли вечно занятый пользователь вашему сайту хотя бы второй взгляд. Картинки привлекают, картинки убеждают, картинки помогают передать идею. Однако, есть и другая сторона медали — картинки могут существенно снизить скорость сайта, что не понравится ни пользователям, ни поисковикам. Неужели это значит, что вы должны пожертвовать картинками и остаться без их магнетической силы? Вовсе нет! Вам нужна только хорошая оптимизация изображений. Тогда обе стороны медали будут счастливыми для вас!

Услуги по оптимизации изображений для Drupal-сайтов

Определяя, чего же не хватает конкретным сайтам, чтобы они «расправили крылья» и набрали хорошую скорость, мы часто находим причины в неоптимизированных изображениях. Мы наталкиваемся на них во время аудита быстродействия сайтов (наряду с проблемами кеширования, лишних модулей и т.д.). Кроме того, мы можем делать и отдельный анализ изображений и определять, что именно нужно для их оптимизации.

Ну и, конечно, мы воплощаем все эти рекомендации в жизнь. Обычно услуги по оптимизации изображений касаются постоянных картинок на Drupal-сайтах (то есть не тех, которые загружают пользователи). Это могут быть логотипы, элементы дизайна и так далее. Цена оптимизации зависит от количества изображений и их размера.

В Drupal есть много методов оптимизации картинок, которые касаются способов загрузки изображений и собственно оптимизации их размеров. А для их воплощения есть масса полезных и уже готовых Drupal-модулей, но иногда лучше подходят и кастомные решения. Начнем знакомиться с некоторыми методами? Поехали!

Некоторые методы оптимизации изображений на Drupal-сайтах

CSS-спрайты

Можно подавать много изображений всего лишь в одном HTTP-запросе, если организовать их в CSS-спрайты. Меньше запросов — выше скорость сайта! Интересный факт, что эту идею разработчики почерпнули из видеоигр. В создании спрайтов на Drupal-сайтах могут очень помочь модули вроде CSS Sprite Generator и Spritesheets.

Base64

Продолжая тему уменьшения количества запросов к серверу, стоит упомянуть и технику перевода картинок в формат Base64 и встраивания их прямо в CSS. По сравнению с всего лишь одним дополнительным запросом в случае CSS-спрайтов, Base64 требует... ноль запросов! Однако, стоит отметить, что файлы получаются немного больше по размеру, но на помощь приходит сжатие методом GZIP.

«Ленивые» изображения

Интересная техника, позволяющая сохранять «энергию» сайта — это «ленивые» изображения. Они подгружаются только тогда, когда появляются в первом экране пользователя. Мы описали это на примере модуля Image Lazyloader. Кроме того, есть похожие модули, такие как Lazyload, Lazy Image Loader, Block Lazyloader, Node Lazyloader, Jail и т.д.

Респонсивние изображения

Важно позаботиться о том, как картинки отображаются на маленьких экранах мобильных устройств с разным расширением. Мобильные пользователи будут вам весьма благодарны! Один из путей к этому в Drupal — использование модуля Picture для Drupal 7. Что касается Drupal 8, соответствующий функционал уже включен в ядро.

Размер изображений

Для Drupal-сайтов есть много способов оптимизировать собственно размер изображений. Среди них — комплект инструментов для ImageAPI под названием ImageAPI Optimize, вместе с целой экосистемой полезных модулей вокруг него. Он позволяет оптимизировать изображения без потерь, и тем самым повысить скорость сайта.

Напоследок

Не существует двух одинаковых сайтов, поэтому не существует единого решения для оптимизации изображений. Но эксперты службы поддержки сайтов Drudesk подберут то, что подойдет именно вам, чтобы сделать изображения лучшими друзьями вашего сайта навсегда!

Похожие материалы