Як оптимізувати картинки / зображення для сайту за принципом SEO

1. Назва зображення
2. Атрибут Alt
3. Атрибут Title
4. Тема зображення (caption text):
5. Оптимізація розміру зображення:

Коли мова заходить про SEO (оптимізація під пошукові системи), не варто забути і про зображення. Кожен фахівець з SEO скаже вам, що у зображень є свої переваги і можуть привести ваш вебсайт до хорошої позиції у видачі.

Багато власників веб-сайтів просто розміщують зображення, навіть не змінюючи його назви, і їх це зовсім не турбує. Це неправильний підхід. Якщо ви хочете володіти грамотним SEO-оптимізованим вебсайтом, не можна залишати поза увагою оптимізацію зображень.

Отже, давайте я розповім вам про оптимізацію зображень.

• Назва зображення (назва файлу зображення)
• Атрибут Alt
• Атрибут Title

<Img title = "SEO оптимізація зображень" src = "http://web-profy.com/wp-content/uploads/2011/12/seo-optimizacija-kartinok.jpg" alt = "для сайту і пошукових систем" width = "502" height = "270" />

Назва зображення

Найважливіший фактор, і тому вам варто було б використовувати розумні слова в назві файлів зображень, які описували б то, що представлено на зображенні. Як роздільник між словами можна використовувати дефіс (-).

Приклад: seo-optimizacija-kartinok.jpg

Атрибут Alt

Alt-атрибут зображень також важливий щодо SEO, але тут важливо не перестаратися. Не потрібно намагатися вмістити на сторінку якомога більше маленьких зображень, щоб до всіх прикріпити ключові і атрибути alt. Пошукова система може і покарати за це. Отже, просто намагайтеся вести себе природно, і не забувайте про alt-атрибут у вже наявних на сторінці зображень.

У попередньому прикладі ми використовували seo-optimizacija-kartinok.jpg. Хорошим alt-атрибутом такого зображення може бути «Як оптимізувати зображення» або «SEO-оптимізація картинок».

Коротше кажучи, alt-атрибут як би пояснює те, що зображено на картинці. До того ж, якщо браузер користувача не відображає зображення, він хоча б зможе прочитати, про що це зображення.

Атрибут Title

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

Інші важливі фактори SEO, що впливають:

Тема зображення (caption text):

Даний атрибут також може принести кілька очок в вашу користь. Іноді буває корисно розмістити під зображення його назва (опис). Подібний текст підкаже Google, що це зображення дійсно підходить під видачу на певний запит.

Оптимізація розміру зображення:

Не настільки важливо, якщо ви використовуєте певні розміри зображення на сторінках, буде грамотніше, якщо ви вкажете точні розміри в пікселя в коді HTML. Це трохи прискорить швидкість завантаження сторінки. Браузер вже заздалегідь буде знати, де і якого розміру буде зображення, і продовжить завантажувати інший контент, не чекаючи повного завантаження зображення. Якщо ви не вказуєте ширину і висоту зображення, браузер спочатку прогрузити зображення, а потім вже продовжить завантажувати сторінку.

Також, ви, напевно, знаєте, що краще заздалегідь підготувати зображення потрібних розмірів, а не масштабувати їх засобами HTML.

Олексій Повловскій