Сышышь ты, выходи сюда,
поговорим !

Простий спосіб оптимізації зображень для публікації в інтернеті

Швидкість завантаження веб-сторінок є одним з факторів «відносини» пошукових систем до вашого сайту. Чим швидше завантажуються сторінки, тим лояльніше до сайту і користувачі - нікому не подобається довго чекати і витрачати багато трафіку.

Широко відомий (схоже) закривається гугловський сервіс PageSpeed ​​Insights , Що дозволяє перевірити будь-який опублікований сайт на предмет швидкості завантаження і за підсумками перевірки видає оцінку за стобальною шкалою і рекомендації. Зазвичай серед рекомендацій значиться оптимізація і скорочення програмного коду, стиснення зображень, настройка серверного та браузерного кешування і т. Д.

Для середньостатистичного контентного ресурсу на недорогому хостингу і безкоштовної CMS типу WordPress (так, я говорю про своє і тисячах подібних сайтів) можливості оптимізації обмежуються установкою кешуючих плагінів і роботою з зображеннями. «Корячитися» тему і скорочувати HTML, CSS і JavaScript код може не кожен, та й такі дії, як правило, призводять до різних помилок і «випадання» функціоналу.

Для роботи із зображеннями під WordPress існує ряд плагінів, конвертують і стискають картинки з втратами або без втрат, на льоту або за запитом. Найкращий, на мій погляд, з таких плагінів - EWWW Image Optimizer .

В якості альтернативи можна підключити який-небудь CDN-сервіс, щоб статичний контент, а саме графіка віддавалася зі сторонніх серверів, трохи розвантаживши файловий сервер хостингу і за рахунок розподілу джерел прискоривши завантаження сторінок. У моєму випадку цим займається модуль Photon в складі надзвичайно популярного і періодично піддається запеклої критики плагіна JetPack .

Все це в різній мірі працює, але є універсальний спосіб оптимізації зображень для будь-яких сайтів, що працюють не тільки на WordPress - щоб почати роботу, вам знадобиться тільки Google-аккаунт.

Мова, як не дивно, йде про Google Photos - сервісі, який призначений для зберігання фотографій, зроблених на Android-смартфони, і бекапа зображень і відео встановили спеціальну утиліту користувачів комп'ютерів.

В довідці до PageSpeed ​​Insights рекомендований фахівцями Google процес оптимізації зображень описаний так:

Схоже, в останньому абзаці описані інструменти, за допомогою яких сервери Google автоматично оптимізують призначені для користувача зображення, завантажені в Photos. До слова, оптимізуються і потрапили в сервіс відеофайли, але це зовсім неважливо при Здрастуй YouTube.

Розглянемо приклад. Сьогодні я фотографував для наступної публікації складаний ніж і прогнав отримані фотографії через додаток FastStone Image Viewer ( «художня» обрізка + зміна розмірів до 1280 точок по ширині). Вийшла папка з вісьмома файлами вагою більше 3 (!) Мегабайт.

Судячи з усього, свіжовстановленому переглядач FastStone Image Viewer за замовчуванням зберігає відредаговані фотографії в близькому до максимального якості, що призводить до невиправдано великому «вазі» файлів. Але така настройка в нашому випадку цілком виправдана, тому що алгоритми Google стискають фотки без видимої втрати якості при 100% -ному мастабірованіі, а значить, хорошої якості зображення залишаться такими і після завантаження в Google Photos.

Для зручності краще помістити завантажені фотографії в новий альбом, який практично відразу після створення можна скачати цілком у вигляді ZIP-архіву:

Якщо порівняти стислі в Google Photos фотографії з вихідними, вийде неслаба економія.

816 Кб проти 3,27 Мб. При цьому якість фотографій, на мій погляд, не постраждала зовсім. Тим же Фейсбук і Вконтакте варто повчитися у Гугла оптимізувати фотографії. Більш того, GPhotos наділений непоганими інструментами редагування зображень - від накладення фільтрів до ручної настройки контрасту, яскравості, насиченості і т. Д.

Таким чином, Google Photos - не тільки відмінне хмара для зберігання і публікації фотографій, але і потужний інструмент оптимізації зображень для публікації в інтернеті. Тільки у випадку з WordPress не забудьте відключити оптимізують плагіни і той же джетпаковскій модуль Photon, інакше вже підготовлені до публікації фотографії піддадуться додатковому стиску, що призведе до помітної втрати якості (див. Для прикладу пройшли через Google Photos, а потім Photon скріншоти в цьому записі ).

Читайте також: