Комплексна оптимізація
Люди часто не читають текст сприймаючи інформацію візуально. Пошукові системи підлаштувалися під це, отримавши критерії з аналізу зображень в інтернеті.
Ці критерії зводяться до поліпшення якості контенту в результаті пошуку задоволення запитів користувача.
Мало мати зображення або ілюстрації на сайті, важливо щоб вони були корисними, інформативними, якісними, відповідали опису і результатів пошуку.
Картинки – це ефективний інструмент SEO-просування. Релевантні, оптимізовані зображення стають джерелом додаткового трафіку з Google і Яндекса, збільшують інтерес відвідувачів до контенту, покращують поведінкові фактори й рейтинг сайту в пошукових системах. Просто проілюструвати статтю недостатньо.
Слід виконати комплексну оптимізацію зображень:
- Вони повинні бути високої якості,
- Відповідного формату, розміру і дозволу,
- Однаково добре відображатися на будь-яких пристроях і не сповільнювати швидкість сторінок.
Роботи по оптимізації картинок багато, але результат того вартий!
Що таке оптимізація зображення?
Оптимізація зображень в загальному зводиться до зменшення розміру зображень без шкоди для якості. Допомагає скоротити час завантаження сторінки. Оптимізація зображень в наші дні також націлена на ранжування в Google й інших пошукових системах. Щоб бути більш точним, оптимізація зображення – це процес збереження та обслуговування зображень в файлах найменшого розміру без зниження загальної якості.
Оптимізація зображення – це і мистецтво, і наука: мистецтво, тому що немає єдиної відповіді про те, якнайкраще стиснути окреме зображення, і наука, бо є багато розроблених методів і алгоритмів, які можуть значно зменшити розмір зображення.
Як перевірити швидкість завантаження сайту?
На жаль, неправильна оптимізація цих зображень може бути тягарем і збільшити час завантаження вашого сайту. Швидкість завантаження вашого сайту багато в чому залежить від того, як ви обробляєте зображення. Оскільки Google любить швидке завантаження вебсторінка, оптимізація зображень для Інтернету стає пріоритетом для всіх вебсайт.
Починаючи зі статичного блогу і закінчуючи високофункціональним сайтом електронної комерції, всі вони мають зображення відповідно до їх типів. Чим більше у вас зображень і інших медіаоб’єктів, тим важче завантажується сайт. Але є способи оптимізувати ці зображення, щоб забезпечити їх правильну роботу в інтернеті й скоротити час завантаження сторінок.
Швидкість завантаження вашого сайту можна перевірити, наприклад, за допомогою спеціального сервісу компанії Google. Введіть URL сторінки, завантаження якої вас цікавить і дочекайтеся результатів.
PageSpeed Insights аналізує різні параметри, після чого видає рекомендації й прогнозує можливу економію часу завантаження.
Також варто проаналізувати три речі:
- Формат зображень
Стандартного, універсального формату зображень не існує: все залежить від виду і призначення картинки. При виборі типу файлу важливо дотримати баланс між розміром і якістю. JPG / JPEG – використовується для великих, деталізованих фото, скріншотів, градієнтних ілюстрацій; PNG – оптимальний для невеликих зображень, де важливо зберегти прозорість фону: логотипів, значків та інших дизайнерських елементів; SVG – підходить для векторних зображень: кнопок, іконок, діаграм; GIF – формат анімованих картинок і динамічних рекламних банерів. Існують і альтернативні формати – WebP і JPEG-XR. Вони важать менше, але підходять не для усіх браузерів. - Якість зображень
Яскраві, чіткі, візуально привабливі оптимізовані картинки позитивно впливають і на соціальні, і на поведінкові фактори: формують хороше враження про сайт, продукт або послугу, роблять матеріали більш «вірусними». Важливим фактором якості зображень є релевантність – відповідність темі статті та розміщення поруч з текстом, який вони ілюструють. - Розмір та вага зображень
Розмір та вага картинок впливають на швидкість завантаження сторінки, а це – ключовий фактор ранжування. Оптимізація зображень дозволить знизити їх вагу і підвищити швидкість. Стиснути ілюстрації вручну можна практично в будь-якому графічному редакторі. Важливо відстежити, щоб на виході не зіпсувалася графіка, а картинка вийшла не розмитою та чіткою. Або скористатися одним з онлайн-інструментів для автоматичної оптимізації зображень – після обробки вони стають «легшими» і не втрачають якість.
За якими критеріями оптимізувати зображення?
Характеристики екранів обмежують візуальну якість зображень, тому немає ніякого сенсу використовувати на сайтах картинки з такою ж високою деталізацією, як, наприклад, в зображеннях для поліграфії. Доцільно зменшувати дозвіл картинки до рівня, достатнього для моніторів:
- Розмір зображення по довгій стороні скоротити до ширини тематичної області сайту, яка найчастіше приймається рівною 960 px;
- Використовувати обмежену кількість колірних відтінків – палітра для WEB нараховує 216 квітів;
- Вибирати для зображень формати файлів, що допускають високий стиск, наприклад, JPEG (для анімованих картинок GIF, для картинок на прозорому тлі PNG);
- Метадані (відомості про фотоапарат, яким зроблений знімок, про програму, в якій він оброблявся, значення витримки, діафрагми та ін.).
Важливо не забувати, що один з головних критеріїв оптимізації – баланс між зменшенням розміру файлу і збереженням деталізації зображення.
Якщо, наприклад, ви оптимізуєте скріншот, на якому користувач повинен щось прочитати, текст на оптимізованому зображенні повинен залишитися добре помітним. В ілюстрації, яку неможливо прочитати, немає ніякої користі.
Інші приклади, коли висока деталізація зображення необхідна: фото ювелірних прикрас, в’язаних виробів, репродукції гравюр і т. п.
Однак перед оптимізацією варто оцінити вихідну якість картинки й поліпшити її настільки, наскільки це можливо.
Онлайн інструменти для стиснення зображення.
Є багато інструментів для цього в онлайн версії. Нижче наведено список деяких з них. До речі, вони безплатні.
- TinyPNG
- TinyJPG
- Compressior.io
Напишіть описовий тег ALT
Атрибути Alt – це текстова альтернатива зображень. Коли браузер не може правильно відображати зображення з якої-небудь причини. Атрибути ALT також використовуються для вебдоступності. Навіть коли зображення відображається, при наведенні курсору на нього ви побачите текст атрибута alt.
Атрибут alt також додає цінність SEO вашому сайту. Додавання відповідних атрибутів alt, що включають релевантні ключові слова, до зображень на вашому вебсайт може допомогти вам підвищити рейтинг в пошукових системах. Насправді використання атрибутів alt, ймовірно, є найкращим способом зображення ваших продуктів електронної комерції в пошуку картинок Google і в Інтернеті.
Оптимізація зображення є однією з найменш обтяжливих, але найбільш ефективних із завдань щодо оптимізації. Оптимізація зображень означає оптимізацію вебсайт. Оскільки зображення складають великий відсоток від ваги вашого сайту, й можете зробити свій сайт легшим і прискорити завантаження сторінок, оптимізувавши їх. Як і зображення, інші медіадані, такі як відео, також повинні бути оптимізовані. Виберіть правильний формат і розмір для ваших медіаданих та переконайтеся, що ви оптимізуєте їх належним чином.
У JustSEO вам допоможуть оптимізувати основні вимоги до створення картинок як:
- Формат зображень
- Якість зображення
- Розмір і вага зображень
- Написання ALTів
- Оптимізація URL
