Як прописати атрибут ALT до картинки правильно?

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

оптимізація коду

Як ви можете здогадатися, кожна буква цьогокоду, кожен символ мають значення. Ще, що цікаво, буває так, що візуально сайт може не містити тих елементів, які вкрай важливі для його оптимізації (мається на увазі правильне налаштування ресурсу під пошукові системи). До числа таких малопомітних можна віднести, наприклад, атрибут ALT. Він є на сторінках багатьох ресурсів, і дуже часто ми просто не помічаємо його.

У цій статті ми хотіли б приділити увагу якраз цього елементу веб-дизайну. Тут ми розповімо, чим він так важливий для правильного ранжирування сайту, зростання його відвідуваності і зручності користувача в роботі з ним.

Що таке атрибут ALT?

Почнемо з самого початку: опишемо, про що в цій статті йдеться і навіщо нам взагалі потрібен цей атрибут.

Отже, для розуміння даного тексту в першучергу необхідно розбиратися в мові розмітки HTML. Це - код, на якому пишуться базові веб-сторінки, який, як уже було зазначено, має властивість відображатися в браузері. Весь мова складається зі спеціальних атрибутів (наприклад, IMG, ALT, FONT і так далі). Кожен з них відповідає за роботу з тим чи іншим елементом дизайну. На практиці застосовується згаданий вище атрибут ALT для картинок, які можна зустріти на сторінках сайтів. Якщо говорити конкретніше, то з його допомогою створюється опис до картинок, за якими користувач (відвідувач сайту) може легко і просто розібратися в тому, що ж на них показано. Напевно ви і самі стикалися з такими описами - вони виникають при наведенні мишки на картинку.

практичне значення

Зрозуміло, ці атрибути застосовуються на практиціне просто так. Вебмайстрам потрібні опису їх зображень не менше, аніж самим відвідувачам сайту (а швидше за все, навіть більше). Адже якщо у всіх зображень відсутня атрибут ALT, людина може цього навіть і не помітити, якщо до картинок на сторінці будуть додані пояснювальні тексти. З іншого боку, пошукові роботи (при порожньому ALT) можуть недостатньо високо оцінити сайт, знизити його позицію у видачі та, таким чином, не принесуть достатньої кількості відвідувачів. Тому ми можемо з упевненістю сказати, що опису до картинок на сайті також грають важливу роль і для самих вебмайстрів, тому не можна ними нехтувати.

Бонуси від пошукачів

Щоб зрозуміти краще, ніж вигідні правильнозаповнені теги описів до картинок, наведемо невеликий приклад. Скажімо, є сайт з розміщеними на ньому зображеннями. Якщо не прописати атрибут ALT, користувач не постраждає, оскільки він в будь-якому випадку побачить, що зображено на тому чи іншому фото. Зовсім інший результат чекає власника ресурсу, який буде нехтувати зазначеним вище тегом, через що втратить якусь частку трафіку з пошукових систем картинок, наприклад.

Як прописати атрибут ALT?

Технічно немає нічого складного в тому, щобзаповнити під тією чи іншою картинкою опис. Це очевидно: треба зайти в HTML-редактор на своєму сайті і знайти код зображення (починається з IMG і закінчується ним же). Усередині цього блоку коду є код. Саме його і мають на увазі, коли говорять, що потрібно прописати атрибут ALT. Робиться це так: "alt =" опис ".

Якщо ви працюєте ні з чистим кодом, авикористовуєте якийсь окремий "движок" для сайту (наприклад, Wordpress або Joomla), - в ньому інтегрований особливий механізм додавання "альтів", через які наш сайт і запам'ятається пошуковикам. Якщо ви заповнюєте новий ALT, оновлення виявляється на вашій сторінці.

Що пишуть в атрибуті?

Зрозуміло, коли у вас виникає задачапрописати атрибут ALT, ви думаєте нема про технічну сторону. Найчастіше це питання задається в тому випадку, якщо веб-майстер не знає, яку інформацію йому потрібно вказувати про той чи інший зображенні. Через це складно сказати, які відомості підуть сайту на користь з точки зору пошукових механізмів.

На практиці є безліч підходів до вирішенняпроблеми опису. Хтось працює з типовими шаблонами, згідно з якими тег просто заповнюється ключовими словами, під які створюється сторінка. Мабуть, це найбільш поширена практика, яку можна зустріти часто. Іноді замість того, щоб шукати, як прописати атрибут ALT, користувач просто залишає це місце порожнім. Тут слід уточнити, що кожен самостійно приймає рішення щодо того, який опис вказувати.

вимоги

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

Наприклад, перший такий вимога - це довжинавсього тексту. Якщо ви шукаєте, як правильно прописати атрибут ALT, рішення елементарно: використовуйте не більше 2-3 слів. Текст такого розміру буде, по-перше, ідеально зчитуватися пошуковим роботом (і робити ваш сайт більш релавантним); по-друге, такий опис більш зрозуміло самим користувачам. Погодьтеся, читати ціле речення, якщо ви хочете просто знати, що показано на картинці, ніхто не буде. Досить коротко і точно викласти опис, що буде корисно як вам, так і клієнтам.

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

Ще один важливий момент (який був встановлений вПід час численних практичних випробувань) - це унікальність. Якщо шукаєте, як прописати атрибут ALT до картинки, пам'ятайте: його потрібно підбирати унікальним для кожної з перерахованих фотографій на сайті. Наприклад, публікувати три картинки поспіль з підписом "мій слон" буде неправильно - це тільки зашкодить вашому ресурсу в пошуковій видачі. Краще назвати зображення "слон 1" і "слон 2", що зробить їх більш унікальними.

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

Пошук ALT

Нарешті, ми поговорили про основи атрибута, продеякі правила його складання та вимоги обох сторін (як користувачів, так і пошукових роботів) до них. Тепер подумаємо: так як же шукати ключові слова і фрази, які ми будемо прописувати на своєму сайті? Як вже зазначалося вище, пошук потрібно направляти в бік готових баз ключових слів, якими реально почати залучення клієнтів на ваш сайт. Зрозуміло, цього не добитися, якщо у вас все ж відсутня атрибут ALT. Беріть в готовому вигляді ключові слова і фрази, які застосовуєте в контенті, і вставляйте в картинки.

Якщо таких відомостей у вас немає і ви зовсім недумали над тим, щоб почати потроху розкручувати свій ресурс, пропонуємо почати шукати бази таких "ключових слів", з якими ви зможете легко створювати нові сайти. Для цього відмінно підійдуть сервіси типу Google Keyword Extract Tool або Yandex.Wordstat, де показана статистика пошуку по тим чи іншим фразам. "Граючи" з цими настройками, можна істотно розширити частку пошукового трафіку на своїх сайтах і тим самим почати витягувати нову вигоду. Головне, щоб не виникло ситуації, в якій у всіх видимих ​​зображень відсутня атрибут ALT.

висновки

Отже, що можемо сказати про описаний в ційстатті атрибуті? Він є частиною мови, на якому створюються найпростіші сайти - HTML. Робити це дуже просто, оскільки описується елементарний, базовий мову. Для того щоб все-таки прописати тег в картинках, необхідно самостійно оформити його через вихідний код. Або ж, скориставшись новою інструкцією, почати оформляти заново. Як би там не було, а вказівка ​​тегів ALT - це той ідеальний випадок взаємної вигоди, коли залишаються задоволеними і відвідувач, і власник ресурсу.

Вказівка ​​тега може привести і нових відвідувачів- особливо часто таке явище спостерігається на таких сервісах, як Google і Yandex Images. При кліці на картинку сайт самостійно визначає джерело, з якого було взято зображення, і перенаправляє відвідувача. А це, як ви розумієте, дуже важливо вміти робити в майбутньому.