Оптимізація зображень для сайту – це не тільки правильний формат, розміри та роздільна здатність, як думають багато власників сайтів і новачків у SEO. Так, це важливі моменти, але це тільки мала частина того, що потрібно зробити, щоб отримати максимальний ефект.
SEO-оптимізація картинок має також включати атрибути alt і title, правильні підписи і метадані, враховувати унікальність зображення і відповідність запиту, їхню кількість і розподіл по тексту, правильність url-адрес та інші аспекти. Розглянемо їх. Але спершу кілька слів про те, для чого взагалі так заморочуватися.
Навіщо оптимізувати зображення
Якщо коротко:
- картинки можуть давати трафік;
- допомагають поліпшити внутрішню оптимізацію;
- підвищують привабливість контенту;
- впливають на швидкість завантаження;
- збільшують рівень довіри до сайту.
А тепер трохи докладніше…
Картинки можуть давати трафік
SEO-зображення дійсно можуть залучати додатковий трафік на сайт. Але якщо ми говоримо не про поодинокі переходи, а про сотні відвідувачів на добу, тоді їхня підготовка вимагатиме достатньо серйозного опрацювання та бюджету.
І найбільша проблема навіть не в оптимізації, а в створенні зображень. Потрібно знайти пошукові запити, відповіді на які зручніше дати у вигляді графіки, замовити у дизайнера її відтворення і вже потім оптимізувати. Це працює. Але через трудомісткість і дорожнечу мало хто цим займається.
Хоча результат можна отримати вражаючий. Для деяких молодих сайтів – це один з небагатьох способів почати отримувати трафік у висококонкурентних нішах, в яких у звичайний ТОП вони не зможуть потрапити ще довго. Тому, якщо готові на такі витрати – пробуйте. Але спершу прорахуйте все і не розраховуйте, що таких зображень потрібно десятки, орієнтуйтеся відразу хоча б на 100-200 штук. Так, не за один місяць, але все ж…
Допомагають поліпшити внутрішню оптимізацію
Щоб оптимізувати картинку, потрібно, крім іншого, прописати атрибут alt – а це додаткова можливість вписати ключову фразу і не дратувати відвідувачів великою кількістю ключів на самій сторінці. Url-адреса зображення – ще одне місце для вписування ключа. А є ще й підпис, який не завжди потрібен, але при необхідності можна задіяти.
Якщо у вас багато пошукових запитів для просування сторінки, а тексту на ній вкрай мало і збільшити його не виходить – потрібно правильно оптимізувати картинки і ви значно поліпшите оптимізацію сторінки, на якій вони знаходяться. Що дасть поліпшення позицій.
Підвищують привабливість контенту
Ви пробували читати статтю, скажімо, на 20 000 знаків, де немає ніякої графіки? Такі портянки зазвичай викликають тільки одне бажання – закрити сторінку та знайти нормальний сайт. Тому і є у багатьох SEO-шників рекомендації вставляти в тексти зображення кожні 1-2 тис. знаків.
В результаті, якщо текст розбавлений картинками, їх не занадто багато і не занадто мало, та вони його доповнюють, це може збільшувати час перебування користувачів на сторінці і зменшити кількість відмов. Тобто, поведінкові фактори будуть поліпшуватися. Що в свою чергу позитивно впливає на позиції.
Впливають на швидкість завантаження
Чим менша вага зображень, тим вища швидкість завантаження. А швидкість завантаження – це теж фактор ранжування. Звичайно, якщо вона і так висока, то незначне збільшення нічого не дасть. Але практично всі проекти, що приходять до нас на просування, вимагають прискорення.
Збільшують рівень довіри до сайту
Якщо мова йде про товарні сторінки і розділи інтернет-магазинів – там все однотипно і часто ми бачимо фото від виробників. Але якщо мова йде про статті блогів цих магазинів або інформаційні сайти – якісно промальована графіка може значно підвищити рівень довіри до сайту. А це може збільшувати відсоток повернень. Наприклад, користувач гуглить якийсь запит, бачить у видачі сайт, який йому сподобався раніше, і переходить на нього, навіть якщо його позиція нижче ТОП 3. І це теж може позитивно впливати на позиції.
Де брати картинки для сайту
Перш ніж щось оптимізувати, потрібно це «щось» знайти. І ось з цим у більшості власників сайтів величезні проблеми. Всі розуміють, що зображення повинні бути унікальними та відповідати контенту, в якому будуть розміщені, але практично ніхто не хоче за них платити. І якщо років 10-15 тому можна було просто завантажити те, що сподобалося, з пошуку Google по картинках і не особливо переживати, то зараз отримати претензії, штраф або навіть блокування сайту цілком реально. Тому…
Якщо мета – трафік
Якщо вам потрібно просування картинок і трафіку, тоді варіант один – підбираєте під кожен пошуковий запит, робите ТЗ та віддаєте дизайнеру на промальовування. Зображення повинно не просто відповідати запиту, а давати на нього відповідь. Довго, дорого, але результати при грамотному підході можуть дуже порадувати.
Приклад. Ви підбираєте ключові слова для статті і бачите запит «приклад структури сайту». Результати пошуку по ньому виглядають так:
Як бачите, блок із зображеннями розташований вище сайту на першій позиції і є великі шанси, що користувач зацікавиться одним із них і відразу перейде за відповідним посиланням. А інші результати пошуку навіть дивитися не буде. Це один із прикладів, як можна обійти сильніших конкурентів. І плюс не забуваємо, що є категорія користувачів, які будуть шукати саме в Google Images.
Ложка дьогтю – це тільки на словах все просто і лідери ніші вже розступаються, щоб дати вам місце вище них. На практиці отримати результати складно. Потрібен досвід у пошуку відповідних запитів, вміння придумати, що має бути зображено, і в складанні грамотного ТЗ, плюс нормальний дизайнер. Тому, якщо досвіду поки мало – попрацюйте з простішим варіантом, про який йтиметься нижче, а вже потім приступайте до цього.
Якщо мета – позиції
Якщо ваша мета – поліпшення SEO-оптимізації сторінок в цілому, щоб підвищити їх позиції в пошуку, тоді є варіанти:
- Замовити у дизайнера. Тільки ТЗ буде набагато простіше. В даному випадку замовляємо зображення, що доповнюють текст або просто тематичні. Якщо спрацюватися з одним дизайнером, це може бути дуже навіть бюджетно.
- Фотостоки. Безкоштовні можна навіть не розглядати. Перевірено і неодноразово. Тому гуглите «кращі платні фотостоки», вивчаєте тарифи та обираєте під свій бюджет. Тільки перед оплатою переконайтеся, що з вашої тематики там достатньо фотографій.
- Зробити самостійно. Це ідеальний варіант, якщо у вас сайт з послугами (будівництво, ремонт, манікюр, барбер-шоп, детейлінг).
- Використовувати фото постачальника. Для інтернет-магазинів фото товарів в основному надає постачальник, а для блогу і описів – знову-таки потрібен дизайнер або фотосток.
- Попросити клієнтів. Мало хто не стикався з пропозиціями інтернет-магазинів оплатити відео розпакування бонусами. І це тільки один варіант, щоб показати, в який бік дивитися. Варіантів може бути багато. Все залежить від конкретної ніші.
Звичайно, це не всі варіанти, які можна придумати. Головне пам’ятайте, що вам потрібні унікальні фото. А якщо не унікальні, тоді хоча б такі, за які не прилетить претензія. Тому варіант просто нагуглити щось, взяти з чужого сайту або опублікувати фотографії клієнтів без дозволу – вам точно не підходить. Принаймні для серйозного довгострокового проекту.
Генерація зображень за допомогою ШІ
Не важливо, ваша мета – трафік або позиції, за допомогою генераторів візуального контенту на основі AI цілком реально закрити це завдання. Але тут важливо розуміти, що безкоштовні нейромережі в більшості випадків не дадуть те, що ви хочете. Тому краще відразу вивчити платні та підібрати те, що вам підійде. Вибір великий, та й ціни можуть бути 10$, а можуть і більше 100$.
В рамках даної статті спеціально не даю ніяких рекомендацій. Це окрема тема і причому велика. Тому розглянемо її пізніше.
Підготовка зображень для сайту
Будемо вважати, що ви отримали потрібну кількість зображень. Але робити їх SEO-оптимізацію ще зарано. Спочатку потрібно переконатися, що вони мають правильні розміри, роздільну здатність і формати, та оптимізувати ці параметри.
Якщо ви працюєте з дизайнером, швидше за все, ці питання були в його брифі або ви обговорили їх у процесі роботи. У такому випадку навряд чи знадобляться хоч якісь додаткові дії на цьому етапі. У всіх інших випадках потрібна перевірка і доопрацювання під себе.
Який формат краще
Ніхто не скаже однозначно, який формат картинок краще для сайту. Все залежить від завдання:
- Публікуєте скріншоти або фотографії – це буде JPG (JPEG).
- Потрібна анімація – GIF.
- Використовуєте картинки з прозорим фоном – PNG.
- Додаєте елементи дизайну – SVG.
- Намагаєтеся прискорити сайт – WebP.
- Любите експериментувати з новими форматами – AVIF.
Тому потрібно розбиратися конкретно з вашою ситуацією. Але давайте трохи спростимо. Приберемо з цього списку GIF та PNG. Ті, кому потрібні саме вони, зазвичай про це знають.
SVG в основному використовується на етапі створення сайту. Ну і в тому випадку, коли графіку малює дизайнер (у нас основна картинка кожного поста якраз в SVG завантажується, але так роблять одиниці). Якщо це ваш варіант – використовуйте, якщо ні – прибираємо цей формат.
AVIF – дає відмінну якість при мінімальному розмірі. Але у нього є проблема – він не підтримується старими версіями Safari. Це не означає, що його не можна використовувати, варіанти є, але більшість не захоче морочитися і просто відмовиться від нього.
Що у нас залишається: JPG та WebP. Але тут і порівнювати нічого – WebP в більшості випадків буде кращим. Тому, якщо мова про нові картинки – тоді робіть їх в WebP. Якщо мова про вже розміщені (які найчастіше будуть в JPG), тоді можна просто стиснути їх наскільки вийде без сильної втрати якості та поки залишити так.
Розмір, роздільна здатність, вага
Тут потрібно визначитися з термінами. Справа в тому, що в звичайній роботі, та й у повсякденному житті, багато хто використовує визначення так, як їм зручно. І не завжди правильно. Повинно бути так:
- Розмір зображення для сайту – це його ширина і висота в пікселях. Наприклад: 1200×800 px.
- Роздільна здатність зображення для сайту – це кількість пікселів (точок) на одиницю площі (dpi або ppi). Наприклад: 144 dpi.
- Вага – це розмір файлу в кілобайтах (Кб) або мегабайтах (Мб).
При цьому кількістю точок при SEO-оптимізації картинок практично ніколи не користуються. Тому їх розглядати не будемо.
Оптимальний розмір
Оптимальний розмір зображень для сайту – 1200×800 px. Але це дуже і дуже відносно. Якщо ви замовляєте зображення для статті блогу або якогось текстового опису дизайнеру – так, можна використовувати цей розмір. Але якщо це фотосток, фото від клієнтів і подібне – ну звідки там будуть такі цифри?
Оптимізація розміру зображення якраз і полягає в тому, щоб з наявних вихідних даних зробити щось, що буде підходити для використання на сайті. А це означає, що вам потрібно відкрити наявне фото в Photoshop, Pixelmator або чимось подібним. І змінити його розмір. При цьому задаємо тільки ширину 1200, а висоту залишаємо адаптивною.
Орієнтація і співвідношення сторін
Орієнтація краще прямокутна. Але без крайнощів. Наприклад, фото з вертикальною орієнтацією при вставці в текст залишають з боків багато порожнього простору і виглядає це не дуже. Тому їх використовують або в специфічних макетах або уникають по можливості. Горизонтальна орієнтація при занадто малій висоті буде робити з картинки банер, що теж виглядає не дуже. Тому при ширині 1200 px, висота в ідеалі повинна наближатися до 800 px плюс-мінус 100 px.
Це теж дуже умовно і індивідуально, але, якщо у вас немає досвіду і ви будете дотримуватися цієї рекомендації, ризик накоїти помилок мінімальний.
Звідки взялося 1200 px
Хороше питання. Якщо погуглити, які розміри зображень для сайту є оптимальними, ви неодноразово прочитаєте, що це рекомендація Google. Але якщо пошукаєте цю рекомендацію в довідці самого Google, то побачите, що рекомендації для Google Ads, Google Business Profile, Google Merchant Center та Google Пошук сильно відрізняються. І немає там ніякого універсального розміру і однієї конкретної рекомендації. Виглядає це приблизно так:
Максимальна цифра, яку ми там бачимо – 1200 px. А це означає, що набагато простіше робити зображення мінімум на 1200 px, щоб потім з нього можна було зробити менші розміри для інших напрямків, навіть якщо зараз вас цікавить тільки пошук.
Якою має бути вага
При оптимізації зображень для веб прагнемо не перевищувати 100 кілобайт.
Що маємо – якщо брати зображення з занадто малою шириною, на моніторах з високою роздільною здатністю вони будуть розмитими. Плюс пам’ятаємо, що ширина менше 1200 пікселів буде не зручна, якщо виникне необхідність переробити розмір під інші сервіси Google або соціальні мережі. Але може тоді вибирати фото з шириною в 3000-4000 пікселів і більше? Це ж закриє всі питання…
Не закриє. Чим більший розмір, тим вища вага. А велика кількість «важких» картинок погіршить швидкість завантаження. Швидкість завантаження – це фактор ранжування, і її зниження може негативно позначитися на позиціях. Тут, звичайно, багато «але», але зараз все спрощуємо для наочності. Тому, оптимальний розмір картинки для сайту – це такий розмір, який дасть максимальну якість зображення за умови, що вага файлу не перевищить 100 кілобайт. Так, цю цифру перевищувати можна, але прагнути потрібно до цього. І з форматом WebP це цілком реально.
Стиснення
Існує чимало сервісів і плагінів для стиснення зображень: TinyPNG, Compressor.io, Kraken.io, Squoosh, ImageOptim та інші. Це хороший спосіб зменшити розмір і прискорити тим самим завантаження. Але якщо будете ними користуватися – не використовуйте на перших етапах автоматизацію – коли парситься весь сайт і картинки стискаються. Можна отримати неприємний сюрприз у вигляді великої кількості замиленої графіки.
Робите SEO-оптимізацію сторінки, і на ній є графіка – завантажте зображення та поганяйте у різних сервісах, подивіться, наскільки погіршиться якість. Так, багато хто позиціонується як сервіси, що не погіршують якість, але чудес не буває, подивіться самі на хорошому моніторі і потім вирішіть, чи потрібно це вам.
Моя думка – простіше переганяти все в webp та «гратися» в редакторі з розміром і налаштуваннями (при збереженні в webp можна задати зменшення якості). Так ви отримаєте дійсно хороший результат. Нехай і витративши на порядок більше часу.
SEO-оптимізація зображень
Щоб оптимізувати зображення для SEO потрібно прописати правильну назву файлу, alt, title та, при необхідності, скласти підпис. Все це робиться на підставі ключових слів, за якими просувається сторінка. Тут можна застосовувати принцип: один запит – одне фото. При цьому потрібно стежити, щоб не було переспаму.
Наприклад, у вас є 10 ключових слів для просування якоїсь однієї сторінки. І буде кілька зображень на ній, які можна оптимізувати. Ваше завдання зводиться до того, щоб:
- Підібрати такі фото, які доповнять статтю, зроблять її кориснішою, а не просто «аби було».
- Оптимізувати їх під пошукові запити, за якими просувається дана сторінка. Але не всі. Важливо не допустити переспаму.
Якщо зображень мало, наприклад 2-5, оптимізуємо їх всі. Якщо багато (більше, ніж запитів) – наприклад 12-15, тоді оптимізуємо максимум 10 (за кількістю запитів). Але швидше за все менше – 7-9. Інакше буде переспам і плюс деякі запити можна об’єднати в один, оскільки часто вони однотипні. Якщо фото приблизно стільки ж, скільки і ключових слів, наприклад 8-10, тоді приблизно половину з них або трохи більше. Знову-таки, щоб не переспамити.
Ще момент – якщо на сторінці 10 фотографій, а ви оптимізуєте тільки 5 – по можливості чергуйте оптимізовані і звичайні. Якщо їх 10, а опрацьовувати будете тільки 3-4, тоді робіть одну опрацьовану і потім дві звичайні. Це потрібно для того, щоб розподілити ключові слова в вихідному коді сторінки більш рівномірно, не допускаючи їх зосередження в одному місці.
Для чого я все це розписую… Часто бувають ситуації, коли сайт потрапляє під фільтр за переспам. Починаєш перевіряти: аудит контенту показує, що все відмінно, підзаголовки правильні, мета-теги не переспамлені. На перший погляд – ніяких проблем немає, закрадається думка, що це якась помилка і через пару апдейтів сайт з-під нього вийде.
Але коли знаходиш найбільш постраждалі url і робиш SEO аналіз конкретних сторінок, виявляється, що на них може бути з півсотні зображень, в кожному з яких вписані ключові слова (часто у всіх фігурує один і той же ключ). Причому вписані вони в адресу, alt, title, а місцями ще й в підпис. Разом на 50 картинок по 3-4 входження – це мінімум 150. При цьому в тексті на сторінці всього 5-7 входжень…
Тут не потрібно бути великим фахівцем, щоб розуміти, що за таке від ПС цілком може прилетіти фільтр. Тому оптимізацію потрібно робити акуратно. Краще недооптимізувати, ніж знімати фільтр.
З кількістю та переспамом розібралися. Тепер подивимося, як працювати з кожним зображенням, яке потрібно оптимізувати.
Назва файлу
Оптимізація зображення починається з прописування правильної назви. Тобто такої, яка містить пошуковий запит, за яким просувається або саме фото, або вся сторінка. І яка відповідає тому, що на ній зображено.
Наприклад, трохи вище у нас є скрін з оптимальною шириною графічних елементів для різних сервісів Google. Дане зображення додано не просто так. Воно доповнює статтю та під нього є пошуковий запит «оптимальний розмір зображень для сайту», за яким також просувається дана сторінка. Відповідно, в якості імені файлу і потрібно використовувати цей запит на трансліті з роздільниками у вигляді дефісів:
Або, якщо сайт багатомовний і немає можливості для кожної мови зробити свою назву, можна використовувати варіант англійською мовою:
В обидва варіанти я вже підставив формат webp, який умовно будемо вважати оптимальним. Ну і для порівняння, як робити не потрібно:
Що стосується тієї графіки, яку ви використовуватимете в статті, але яку не плануєте оптимізувати, – назви файлів теж потрібно написати правильно, просто постарайтеся не використовувати в них пошукові запити. Наприклад, в рамках даної статті:
Зверніть увагу – назва прописана англійською (може бути і трансліт, не важливо, головне, що це не набір букв/цифр), вона відповідає тому, що зображено на картинці (це назва нашого скріншоту з початку статті) і при цьому не містить пошукових запитів, під які оптимізується сторінка. Тобто – все зроблено якісно і ПС такі моменти «бачить», плюс не буде переспаму.
Робимо висновок – прописувати правильні назви файлів потрібно для всіх графічних елементів (елементи дизайну не враховуємо). Тільки частина оптимізується під ключі, а частина робиться без ключів, щоб ПС краще «розуміла», чим ви доповнюєте тексти.
І ще раз акцентую – в обох варіантах назви повинні відповідати тому, що зображено на фото. Не можна фотографію, на якій людина висаджує яблуню на ділянці, назвати «plodovyj-sad-svoimy-rukamy». Правильніше буде «posadka-yabluni-v-grunt».
Атрибути alt і title
Атрибути title і alt для зображень це приблизно те ж саме, що title та description для звичайної сторінки. Просування картинки в Google Images без них не те, щоб нереально, але сильно ускладнюється. Вони допомагають пошуковим системам точніше визначати, що на них зображено, та покращують ранжування.
Тобто, прописувати дані атрибути, якщо вам потрібно оптимізувати картинки для сайту, як би обов’язково. Але якщо з alt все дійсно так і є, то title особисто я не використовую. З двох причин.
Причина 1. Якщо вписати пошуковий запит в обидва атрибути, плюс в назву файлу – це вже 3 входження. Якщо використовується підпис – чотири. Звичайно, можна не скрізь використовувати ключ, але це не завжди зручно. Та й багато хто просто не замислюється і на автоматі пише його всюди. І якщо таких елементів буде багато, можна легко переспамити сторінку і отримати зниження позицій, замість підвищення.
Тому я рідко роблю підписи, а якщо і роблю – без ключових слів, тільки для людей, а не роботів. І не використовую title. Можливо, це зменшує шанси потрапити в Google Images, зате дозволяє більш якісно оптимізувати сторінку. А в більшості випадків це і є моя мета, тому що за трафік з Google Images замовники не люблять боротися.
Причина 2. Якщо прописаний атрибут title, при наведенні курсору миші на картинку, цей самий title з’являється ось таким чином:
І якщо на звичайній фотографії він може просто дратувати відвідувачів, то на таблицях ще й перекривати інформацію на них. А щоб напис зник, недостатньо трохи змістити курсор, потрібно прибрати його з зображення повністю. І це може бути не зручно для частини відвідувачів.
Зверніть увагу, на скріншоті вище атрибут title ще й використаний неправильно. З того, що в ньому прописано, ПС повинні розуміти, що там зображено. А в нашому прикладі там просто довільна фраза. В результаті і оптимізації під ключові слова немає, і спливаючий напис з нерелевантним текстом постійно буде дратувати відвідувачів.
Тому, якщо оптимізація фото вам потрібна для того, щоб поліпшити ранжування сторінки в результатах пошуку, title можна не заповнювати. Це не заважає просуванню. Перевірено. Та й ніхто не заважає вам подивитися конкурентів у своїй ніші – заповнені title ви мало де побачите.
Залишається атрибут alt. Ось його рекомендую заповнювати. Якщо це SEO картинка – робите якісний опис з входженням ключового слова. Якщо звичайна – робите якісний опис без ключового слова. Скільки буде перших і скільки других – орієнтуйтеся на ті цифри, які розписані вище в блоці про назву файлу.
Що мається на увазі під «якісним описом»:
- Описуйте те, що зображено на фото.м
- Достатньо кількох слів, максимум одного речення.
- Використовуйте правильні мовні звороти.
- Починайте з великої літери.
- Вписуйте ключ максимально природно.
Наприклад, уявимо фото білого стільця на сторінці картки товару інтернет-магазину. Швидше за все, одним із запитів для просування сторінки буде «білий стілець купити». Як можна поліпшити просування за цим запитом? Звичайно ж, вписати ключ в alt. І багато хто робить так:
У правильному варіанті – починаємо з великої літери, додаємо марку, модель nf артикул. При цьому не вписуємо «купити», тому що з цим словом у нас не вийде нормального опису. А завдяки марці, моделі та артикулу ми отримаємо унікальний alt. Якщо цього не зробити і на сайті білих стільців буде кілька сотень, то як пошукова система повинна вибрати, що з цього ранжувати?
Якщо з якихось причин ви не можете заповнити alt якісно – краще взагалі не заповнювати.
Підпис
Не потрібно робити підпис тільки для того, щоб оптимізувати зображення для сайту! Використовуйте його тільки в тих випадках, коли на зображенні зображено щось, що вимагає пояснення або додаткової інформації.
Наприклад, зображена якась схема і на ній цифрами виділені якісь елементи. У підписі можна дати пояснення, що означає кожна з цифр. Або ви вставляєте фото рослини і в підписі можна написати, що це таке, щоб користувач не вишукував потрібну інформацію в статті і не зіставляв з фотографією. І так далі.
Вписувати пошукові запити в підписи чи ні – потрібно дивитися індивідуально для кожної сторінки. Буває таке, що потрібно вписати ще 1-2 ключі, а в тексті це зробити не виходить, щоб виглядало природно. Картинок на сторінці теж мало. У таких випадках можна і ключ «обіграти» в підписі. Якщо оптимізація сторінки цього не вимагає, не ризикуйте. Переспамити набагато простіше, ніж може здатися.
У реальній роботі підписи використовуються рідко. Навіть на блозі PROSUVER, переглянувши статті, ви побачите, що підписи є в кращому випадку в кожному десятому-двадцятому зображенні. А на сторінках інтернет-магазинів в описах товарів або на сайтах з послугами вони використовуються ще рідше. Але іноді без них не обійтися, так що знати про них потрібно.
Що ще можна зробити
Щоб оптимізувати зображення для сайту, достатньо того, що написано вище. Але є ще кілька моментів, які можуть поліпшити просування зображень. Правда, багато хто цього не робить (і це не заважає їм отримувати хороші результати) або робить ще на етапі створення сайту, а не під час опрацювання внутрішньої оптимізації. Тому, використовувати щось із цього чи ні, вирішуйте самі. Зайвим не буде, але і явної необхідності немає.
Sitemap.xml для зображень
У Центрі Google Пошуку написано, що посилання на картинки в sitemap.xml допоможуть Google знайти ті зображення, які він не може знайти при парсингу сайту. Для цього можна використовувати як окремий sitemap.xml для зображень, так і додати їх в загальну карту сайту.
На практиці в цьому є сенс тільки в тих випадках, коли ви помічаєте, що ваші картинки погано індексуються. Або занадто довго потрапляють в індекс, або взагалі не потрапляють, хіба що після відправки їх на індексацію вручну через Google Search Console.
Метадані IPTC
Використання IPTC метаданих може поліпшити видимість картинок. Але ви ж розумієте, що не можна завантажувати чужі зображення і вписувати свої метадані. Тому їх використання доречне в тому випадку, якщо ви замовляєте графіку дизайнеру або використовуєте власні фотографії.
Більш детально про них краще почитати в довідці Google.
На практиці це скоріше спосіб додаткового захисту вашого графічного контенту. Не чекайте особливого результату, навіть якщо будете заповнювати все строго відповідно до рекомендацій Google.
Lazy Loading і CDN для зображень
Часто бачу в статтях, де розповідають, як оптимізувати картинки для сайту, рекомендації використовувати Lazy Loading і CDN. Тільки не зрозуміло, яке відношення це має саме до оптимізації…
Пам’ятайте 2 речі:
- Вони потрібні для збільшення швидкості завантаження сайту, а не просування картинок.
- Вони налаштовуються на етапі створення сайту або пізніше, але в будь-якому випадку один раз для всього сайту. Тому немає сенсу розглядати їх, коли робите SEO-зображення.
Але якщо використовуєте Lazy Loading, рекомендую прочитати рекомендації Google щодо усунення проблем з відкладеним завантаженням та переконатися, що у вас їх немає.
Мікророзмітка
Мікророзмітку для зображень майже ніхто не робить, а багато хто про неї навіть не знає. Ефект від її використання отримати можна, але також можна отримати відмінні результати, не використовуючи мікророзмітку. Тому даний пункт наводжу тут тільки для тих SEO-фахівців і власників сайтів, які зробили вже все, що тільки можна, і не знають, що ще такого докрутити, щоб обійти конкурентів. Якщо це не ваш випадок – поки можна пропустити.
Адаптивні картинки
Адаптивні зображення – це дуже зручний інструмент і використовувати їх варто. Щоб не давати довгих визначень, давайте подивимося на практиці. У нашому блозі є стаття:
У статті є «головна» картинка:
Щоб вона виглядала однаково добре і на великих екранах, і на телефонах/планшетах, ми малюємо її відразу в 3 розмірах:
Зверніть увагу, що відрізняється не тільки розмір, а й трохи зовнішній вигляд. Якби ми просто змінили пропорційно ширину та висоту, на телефоні вона виглядала б так само, як на скрині вище – багато кольорового фону по краях та маленьке зображення по центру, яке важко було б розглянути. А використовуючи адаптивні картинки ми можемо намалювати різні версії для різних пристроїв і отримати якісне відображення сайту на різних пристроях. Робиться це через srcset у тегу <picture> або <img>. Ось так:
Але проблема в тому, що це слід передбачати на етапі розробки, а не коли вам потрібно оптимізувати фото для сайту, а функціоналу під це немає. Пишу цей пункт для тих, хто буде робити редизайн та захоче реалізувати цей момент.
Висновок
Серед власників сайтів та новачків в SEO дуже поширений варіант, коли картинки шукають через Google Images і потім просто крадуть з чужих проектів. Мало того, починають їх оптимізувати і дивуються, чому вони не дають трафік. Це не працює! Щоб оптимізація фото для сайту принесла результати, почніть з отримання унікальних зображень. І тільки після цього починайте доопрацьовувати їх за цією інструкцією.
