Скорость загрузки — один из самых важных показателей любого сайта. Каждая секунда ожидания — это посетители и клиенты, потерянные для вас навсегда. Правильная работа с изображениями позволит значительно ускорить загрузку страниц и обогнать конкурентов.
Новые форматы — новые возможности
Главный тренд 2020 года в сфере изображений — повсеместное использование новых форматов: JPEG 2000, JPEG XR и WebP. Тот же Google уже давно советует эту меру разработчикам для увеличения скорости загрузки. Вот только есть одна проблема: JPEG XR и JPEG 2000 поддерживает не так много браузеров. Куда проще обстоят дела с WebP.
Этот формат поддерживают все браузеры на основе Chromium: Яндекс.Браузер, Сhrome, новые версии Microsoft Edge и другие. При этом степень оптимизации WebP действительно поражает: фотография размером почти в 3 Мб может «уменьшиться» до 165 Кб!
Вы можете воспользоваться специальными сервисами для ручной оптимизации, если изображений совсем немного. Например, squoosh. Однако этот способ удобен только для маленьких сайтов или пары-тройки посадочных страниц.
Для серьезных проектов куда разумнее воспользоваться плагинами Imagemin для Gulp, Webpack или Grunt.
Иногда лень — это полезно
Другой способ увеличить скорость загрузки — использование технологии lazy-load.
«Ленивая загрузка» — это подход, позволяющий загружать ресурсы и изображения только в случае необходимости. Достаточно загрузить изображения только для главного экрана, встречающего пользователя. Остальное — по мере скролла.
Однако стоит использовать данную стратегию в большой осторожностью: без специального файла .xml поисковые системы проигнорируют «скрытые» изображения, что может негативно сказаться на SEO.
Использование ресайзера
2020 год — это окончательная победа мобильного трафика. Адаптивные сайты требуют разного качества и размера изображений в зависимости от используемого устройства.
Для этого можно предварительно обработать изображения ресайзером и использовать теги <picture> и <source>.
Кроме того, вы всегда можете обратиться в Дока IT. Мы разработаем для вас быстрый и удобный сайт с нуля, доработаем нынешний проект или возьмем на себя наполнение контентом. А чтобы сайт приносил настоящую прибыль — настроим и запустим интернет-рекламу.