Додавання тегів alt-тексту до зображень у блогері для SEO

  1. Що таке тег alt
  2. Навіщо додавати тег alt?
  3. Як додати тег Alt в HTML
  4. Додавання Alt Tag у редактор повідомлень - режим створення
  5. Додавання Alt Tag у редактор повідомлень - режим HTML
  6. Поради щодо додавання тегів alt
  7. Тестування ваших тегів alt
  8. Схожі повідомлення

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

Що таке тег alt

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

Навіщо додавати тег alt?

Зображення можуть генерувати тонну трафіку. Скільки разів ви шукали щось на Google і натискали на пошук зображень? Я впевнений, що багато хто. Пошукові системи не можуть «читати» або «бачити» зображення, як вони читають текст, тому важливо описати зображення / зображення для них, якщо це необхідно. Наприклад, якщо був образ собаки, що спить, ми можемо легко побачити, що таке зображення, але пошукові системи не можуть і тому ми повинні просто описати це як "собака спить". Тоді, коли хтось використовує зображення Google і шукає сплячої собаки, пошукова система буде знати, щоб показати, що зображення. Зазвичай ми включаємо ключові слова для того, щоб павуки / веб-сканери знали, що таке зображення, і про що йде мова / сторінка.

Як додати тег Alt в HTML

Якщо ви додаєте зображення до публікації, сторінки або гаджета і хочете додати теги Alt Text, просто додайте alt = "ВАШЕ ОПИС" до коду зображення перед закриттям /> подібним чином.

<img src = "ПЕРСОНАЛЬНА URL-адреса зображення" alt = "ВАШ ОПИС" />

Додавання Alt Tag у редактор повідомлень - режим створення

Під час редагування публікації в блозі в режимі складання можна натиснути на зображення, вибрати властивості та вставити опис у поле Alt Text.

Додавання Alt Tag у редактор повідомлень - режим HTML

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

<div class = "separator" style = "clear: обидва; text-align: center;"> <a href = "http://1.bp.blogspot.com/-JNWtDffwCHY/U6GiKZMrzJI/AAAAAAAAAvY/gCIhigzcKVg/s1600/ Moving1.jpg "imageanchor =" 1 "style =" margin-left: 1em; margin-right: 1em; "> <img border =" 0 "src =" http://1.bp.blogspot.com/-JNWtDffwCHY /U6GiKZMrzJI/AAAAAAAAAvY/gCIhigzcKVg/s1600/Moving1.jpg "/> </a> </div>

так від цей пост про основи зображень і посилань , ми знаємо, що кожен з цих розділів коду. Синій - це посилання, пов'язане з зображенням, рожевий - код для показу зображення.

<div class = "separator" style = "clear: обидва; text-align: center;"> <a href = "http://1.bp.blogspot.com/-JNWtDffwCHY/U6GiKZMrzJI/AAAAAAAAAvY/gCIhigzcKVg/s1600/ Moving1.jpg "imageanchor =" 1 "style =" margin-left: 1em; margin-right: 1em; "> <img border =" 0 "src =" http://1.bp.blogspot.com/-JNWtDffwCHY /U6GiKZMrzJI/AAAAAAAAAvY/gCIhigzcKVg/s1600/Moving1.jpg "/> </a> </div>

щоб додати тег alt, до якого ми додаємо alt = "DESCRIPTION" перед закриттям /> коду зображення.

<div class = "separator" style = "clear: обидва; text-align: center;"> <a href = "http://1.bp.blogspot.com/-JNWtDffwCHY/U6GiKZMrzJI/AAAAAAAAAvY/gCIhigzcKVg/s1600/ Moving1.jpg "imageanchor =" 1 "style =" margin-left: 1em; margin-right: 1em; "> <img border =" 0 "src =" http://1.bp.blogspot.com/-JNWtDffwCHY /U6GiKZMrzJI/AAAAAAAAAvY/gCIhigzcKVg/s1600/Moving1.jpg "alt =" КОРОТКИЙ ОПИС ІМІДЖА / ПОШТОВОГО ВИКОРИСТАННЯ ДЕЯКИХ КЛЮЧОВИХ СЛОВ

Поради щодо додавання тегів alt

Короткі, лаконічні, релевантні та описові теги alt краще працюють. Спробуйте скористатися одним або двома ключовими словами, які пов'язані з темою цієї публікації або сторінки, але не переборюйте ключові слова. Якщо це точний огляд продукту, вкажіть назву продукту. Якщо це рецепт, вкажіть назву страви. Якщо це подія згадують назву події… Ви отримуєте ідею.

Тестування ваших тегів alt

Використовуйте цей інструмент для тестування зображень на вашому сайті, це дасть вам запустити вниз теги alt використовуватися.

Схожі повідомлення

Більше SEO поради
Основи HTML для початківців блогерів

Навіщо додавати тег alt?
Скільки разів ви шукали щось на Google і натискали на пошук зображень?