С Вашей графикой все в порядке?

Попробуйте угадать, что является основной причиной медленной работы вашего сайта? Мы уже упустим тот вопрос, что скорость работы вашего сайта напрямую влияет на его посещаемость (так, в англоязычном сегменте поиска Google и в мобильной его версии "быстрые сайты" хорошо ранжируются, также "скорость" уменьшает число отказов). Распространенными ответами на этот вопрос будут приблизительно такие версии:

• движок моего сайта (они все неоптимизированы и грузятся очень долго);
• тарифный план на моем хостинге (сейчас у меня нет денег на хороший тарифный план, а на дешевом тарифе какая может быть скорость загрузки сайта?);
• большое число js и css файлов (я стараюсь создать для пользователей удобный и красочный сайт, приходится использовать богатый функционал и множество стилей)...

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

Об этом заявили и акцентировали на этом внимание вебмастеров сотрудники команды разработки поискового сервиса Google на недавней видеоконференции. Впрочем, помешанные на скорости в Google уже давно всем советуют бороться с весом графики и даже, в свое время, продвигали собственный формат картинок под названием WebP, предполагавший еще большее сжатие в отличие JPEG, что существенно увеличило бы скорость загрузки сайтов, как и скорость интернета в целом, где вес картинок - основной объем трафика.

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

Между тем, под оптимизацией изображения под web-сайты подразумевается удаление ненужных байт из файлов изображений, конвертация изображения в оптимальный сжатый формат. Все это происходит практически без потери качества и не меняет внешний вид. То есть, пользователь на вашем сайте видит картинку такого качества как и раньше, но грузится она в его браузер на порядок быстрее. И так со всеми графическими файлами, которых на странице десятки, сотни, а порой и тысячи!

Выслушав очередные нотации от Google, задаемся вопросом: где и как оптимизировать свою графику для своего сайта? Поскольку теперь очевидно, что для Google это принципиально важно и он каждый раз напоминает об этом вебмастерам.

Онлайн сервисы для оптимизации изображений

Самый быстрый и простой способов уменьшить время отклика страниц на вашем сайте - оптимизация изображений онлайн с помощью сервисов оптимизации изображений. Некоторые такие сервисы поддерживают пакетную работу, умеют конвертировать из одного формата в другой, обрезать и кадрировать изображения и т.д. Все это весьма практично, так как нет нужды устанавливать специализированное ПО на компьютер или быть гуру в фотошопе.

Кто готов бесплатно оптимизировать графику вашего сайта онлайн инструментами?

TOP-5 продвинутых инструментов оптимизации графики

Watermarkly - позволяет уменьшить фото до желаемого размера в килобайтах. Также можно указать степень компрессии. С выбранной опцией "Высокое качество" файл будет больше, но визуально не изменится. Позволяет обработать до 10 фото без ограничения размера. Платная версия без ограничений стоит 990 рублей (единовременный платёж).

TinyPNG - работает в первую очередь с форматом PNG (не брезгует и jpg), поддерживает drag’n’drop, загрузку нескольких файлов одновременно. Работает довольно быстро!

Shrink Pictures - если нужны собственные настойки оптимизации изображения,  возможность изменить соотношение сторон и размеры картинки или специальные эффекты.

Web Resizer - помимо оптимизации изображения умеет применять к ним некоторые опции: изменить размер картинки, повернуть ее, задать свой уровень качества.

Online Image Optimizer - оптимизирует JPG, GIF и PNG, умеет загружать картинки по URL изображения, конвертировать из одного формата в другой.

 PageSpeed Insights: оптимизация от Google

Кстати, инструмент измерения скорости от Google, известный как PageSpeed Insights умеет автоматически (помимо измерения показаний основных параметров загрузки сайта) оптимизировать сайт на лету. Достаточно пролистать страницу вниз и увидите там ссылку - "Скачать оптимизированные изображения, ресурсы JavaScript и CSS для этой страницы" (в архиве будут как раз указанные сжатые файлы проверяемой в инструменте страницы).

Разумеется, сильно уповать на автоматику не стоит, после загрузки обязательно проверить корректность предложенных улучшений и не только применительно к инструменту PageSpeed Insights, но и любому онлайн оптимизатору!