зачем нужно прописывать тег alt для изображений
Какие тексты использует робот для поиска изображений
Текст атрибута alt тега img
Атрибут alt — это альтернативный источник информации для пользователей, у которых показ изображений в браузере отключен. Если атрибут alt определен, то, когда показать картинку будет невозможно, на ее месте отобразится текст атрибута:
Без заданного атрибута alt изображение будет показано как пустое:
Особенно важно описание картинок с помощью атрибута alt для сайтов, контент которых составляют преимущественно изображения.
Задать атрибут alt можно следующим образом:
В атрибуте alt следует писать не все ключевые слова сайта или страницы, а лишь те, которые действительно относятся к картинке. Это поможет роботу точнее найти картинку, а пользователю Яндекса — выбрать ее в результатах поиска и перейти на ваш сайт. Оставлять атрибут alt пустым нежелательно.
Если вы добавляете несколько похожих изображений (например, фотографии товара из интернет-магазина), то стоит задать уникальные атрибуты alt (вид спереди, вид сзади).
Текст атрибута title тега img
Атрибут title предоставляет дополнительную информацию о картинке. Текст, заключенный в этом атрибуте, появляется при наведении курсора на картинку:
Задать атрибут title можно так:
Если картинка является ссылкой, то title лучше указывать в ссылке:
Другие тексты
Кроме значений атрибутов alt и title при поиске по картинкам используются следующие тексты:
тексты ссылок на картинки с других страниц и с других сайтов;
прилегающий к картинке текст — расположенный на странице в непосредственной близости к картинке;
тексты и заголовки коротких документов, обрамляющих одиночную картинку;
имена файлов и скриптов картинок, в том числе с учетом транслитерации и упрощенного подстрочного перевода.
Однако атрибуты alt и title являются наиболее универсальными, поэтому их стоит прописывать всегда.
Атрибуты Alt и Title для картинок. Ответы на популярные вопросы
В сегодняшней статье я хочу рассмотреть, почему всё-таки стоит заполнять HTML-атрибут Alt у картинок, чем он отличается от атрибута Title. Материал рассчитан на новичков и начинающих веб-мастеров, которых интересует вопрос, зачем и почему нужно заполнять атрибут Alt. В конце статьи я подготовил ответы на популярные вопросы по этим атрибутам. Начнём с основ.
Что такое атрибут Alt?
Alt у картинки – это альтернативный источник информации для пользователей, у которых по какой-то причине (слабый интернет, отключено отображение картинок и т. д.) не выводятся изображения на странице. Выводится он в виде текста там, где должна быть картинка.
В HTML-коде атрибут прописывается следующим образом:
Рассмотрим на примере.
Для примера я взял фото с сайта обоев для рабочего стола. Основной контент страницы – изображения.
После того, как я отключил отображение картинок в браузере, вся графика на странице перестала отображаться и можно увидеть альтернативное описание изображения.
С его помощью мы понимаем, что находится на странице. Кроме того, этот атрибут полезен не только пользователю, он также помогает понять поисковому роботу, что изображено на картинке. И Google, и Яндекс используют Alt как один из критериев ранжирования при поиске по картинкам.
Появляется следующий вопрос: что же нужно добавлять в Alt, чтобы он был максимально полезным и для пользователя, и для поисковика?
Как правильно заполнить атрибут Alt для картинок
Что понять, как правильно заполнить атрибут Alt, рассмотрим следующий пример: у нас есть интернет-магазин зоотоваров, и мы хотим прописать Alt для карточки товара с «мячиком для собак».
Есть несколько вариантов заполнения атрибута:
Вариант 1. В качестве альтернативного текста используем «Фото №1», «Картинка 1» и т. д. Такой альтернативный текст не несёт никакой пользы, так как не даёт информации об изображении. Более того, как пишет Яндекс: «Картинки, у которых отсутствуют содержательные описания, не попадают в поиск, так как не могут быть найдены по запросам». Подробнее: «Индексирование картинок».
Вариант 2. Пишем в Alt «Собака с мячиком во рту». В этом случае мы описываем саму картинку, но нужно обратить внимание, что запрос «Собака с мячиком во рту» – информационный. Для описания изображения интернет-магазина он не подойдёт.
Вариант 3. Alt «Мячик для собак» – этот вариант нам больше подходит, но, так как мячиков в магазине может быть много, лучше уточнить запрос.
Вариант 4. Alt «Мячик для собак Humunga Chomp» – этот вариант оптимален для нас. Атрибут содержит название товара и его производителя. Если такого товара много, можно расширить Alt, используя цвет, название модели.
Вариант 5. Alt «Мячик для собак Humunga Chomp, игрушка Humunga Chomp, купить, недорого, Москва» – такой вариант может быть воспринят поисковой системой как спам и нужного результата не принесёт.
Из этих примеров следует, что атрибут Alt:
Зачем нужен атрибут Title?
Title у картинок даёт дополнительную информацию об изображении. Он нужен для того, чтобы пользователю было проще понять, что изображено на картинке. Атрибут выводится при наведении курсора на изображение.
На картинке выше видно, как отображается атрибут на странице.
В HTML-коде атрибут прописывается следующим образом:
Если картинка будет ссылкой, Яндекс рекомендует указывать Title в ссылке:
Рекомендуется заполнять Title. Он может положительно отразиться на поведенческих параметрах сайта. Когда пользователю сложно понять, что изображено на картинке, он машинально может навести на неё мышкой и подсказка Title поможет ему сориентироваться.
Основные требования к Title похожи на требования к Alt:
Зная это, перейдём к вопросам.
Ответы на популярные вопросы по Alt и Title
Alt это описания к изображениям?
Не совсем. Alt – это альтернативное описание, которое будет выводиться вместо картинки, если у пользователя не отображаются изображения.
Обязательно ли заполнять атрибуты Alt и Title для картинок?
Если Вас интересует трафик из поиска по картинкам, Alt обязательно нужно заполнять, Title – по желанию.
Alt и Title должны быть разными или одинаковыми?
Существует два основных мнения по этому поводу:
1) Alt и Title должны быть уникальными;
2) атрибуты должны быть одинаковыми.
Если посмотреть, как заполняют эти атрибуты сайты, изображения которых находятся в ТОПе поиска по картинкам, увидим оба варианта заполнения.
Яндекс по этому поводу пишет следующее:
Я считаю, что эти атрибуты могут быть одинаковыми. Главное, чтобы они давали чёткое структурированное описание вашей картинке.
Нужно ли прописывать возле атрибута Alt ещё и Title?
Необязательно, но учтите: атрибут Title в некоторых случаях помогает лучше понять, что изображено на картинке. Это может положительно отразиться на поведенческих показателях сайта.
В Alt картинки надо ставить те же ключевые слова, что и у статьи, или другие?
Желательно. Главное, чтобы Alt был содержательным и описывал картинку.
Нужно ли прописывать в этих атрибутах ключевые слова?
Если эти ключевые слова будут описывать картинку, то да.
Как правильно писать атрибут Alt: кириллицей или латиницей?
Если ваш сайт на русском, заполняйте кириллицей.
Как писать – с большой или маленькой буквы?
А если статья уже проиндексирована поисковиками, можно внести описание в картинки или не стоит?
Можно. Когда поисковики переиндексируют вашу страницу, они учтут эти описания.
Где заполнять Alt и Title?
Всё зависит от того, на какой CMS сделан ваш сайт.
Если это чистый HTML, то:
Обычно поля для заполнения Alt и Title находятся в параметрах изображения. Например, если ваш сайт сделан на WordPress, открыв параметры изображения, вы увидите поле для заполнения атрибута Alt. В дополнительных настройках есть поле для атрибута Title.
Если же ваш сайт на 1С-Битрикс, в дополнительных настройках параметров изображения есть поле для атрибута Alt. Атрибут Title будет подтягиваться из поля «Заголовок».
Нужно понимать, что всё индивидуально. Многое зависит от того, на какой CMS сделан ваш сайт и как настроен.
Стоит ли и возможно ли прописывать Alt и Title для своих картинок в комментариях?
Не вижу в этом необходимости, да и вряд ли у кого-то в комментариях есть возможность оптимизировать изображения.
Когда к картинкам пишу тайтл и альт на русском, на сайте высвечиваются иероглифы, что делать?
Такое происходит из-за кодировки. Нужно преобразовать текущую кодировку в UTF-8.
Итоги
Ещё раз пробежимся по тому, какими же должны быть Alt и Title.
Основные требования к атрибуту Alt:
Почему стоит заполнять Alt:
1. учитывается поисковыми системами при ранжировании картинок, а значит, если ваша картинка попадёт в ТОП, – это источник дополнительного трафика;
2. будет полезен пользователю, у которого отключены изображения на сайте.
Почему стоит заполнять Title:
1. будет полезен пользователю, которому сложно разобраться, что изображено на картинке;
2. подсказки Title могут положительно отразиться на поведенческих показателях сайта.
Тег alt для изображений: зачем нужен и как правильно оформить
Привет, друзья! Я подготовил для вас статью про оптимизацию и посвящена она будет такому атрибуту, как тег alt для изображений. Он используется в описании изображений. Если не пренебрегать им, то можно существенно повысить шансы на более высокие позиции сайта в поисковой выдаче.
Этот вопрос интересует всех «молодых» владельцев сайтов. В частности, его часто задают участники моего бесплатного онлайн-тренинга, как создать свой сайт. Кстати, тренинг длится всего 4 дня. Он построен на практических заданиях. Участники просто повторяют за мной, и после окончания учебной программы у них на руках остается свой веб-ресурс – полностью готовый к развитию и продвижению. Если давно мечтаете о личном проекте, но у вас пока не было возможности заказать сайт, можете сделать его своими руками. Чтобы принять участие в обучении просто оставьте адрес своей электронной почты.
Но сначала еще интересная информация по поводу использования картинок из интернета.
Смотрите видео всего 9 минут
Ну, а теперь перехожу непосредственно к главной теме статьи: тег alt для изображений – что это такое, как правильно его заполнять.
Зачем нужен тег alt для изображений: лаконично о главном
Тег alt – это обязательный атрибут для фотографий, изображений. В нем содержится описание картинки. Этот атрибут пользователи не видят, ведь браузер показывает им картинки. Если по какой-то причине изображение не демонстрируется (показ отключен или просто не грузится), пользователь на месте картинки увидит текст.
Кроме того, тег альт очень важен для оптимизации и продвижения статей в поисковых системах. Во-первых, поисковые роботы, которые проводят анализ сайта, более позитивно относятся к проектам, у которых прописаны все теги. Во-вторых, в теге прописываются ключевые слова, что положительно отражается на ранжировании проекта.
Как правильно прописать тег alt для изображений: основные правила и рекомендации
Теперь, когда вы знаете, зачем нужен тег alt для изображений, перехожу к подробному рассказу, как работать с ним.
1. Краткое описание изображения
Обязательно создайте лаконичное, но понятное и максимально точное описание картинки. Если вдруг на сайте настроено автоматическое заполнение этого атрибута, необходимо проверить все страницы и изображения, исправить неточности и ошибки.
2. Оптимальная длина
Идеальный вариант – три-четыре слова. Больше – нет смысла. Потому что именно их учитывают поисковые роботы при анализе сайта.
3. Наличие ключевых слов
Чтобы от этого атрибута было максимум пользы, в нем следует использовать ключевые слова, релевантные тексту статьи и соответствующие теме изображения.
4. Уникальность для каждой отдельной картинки
Каждый тег альт должен быть уникальным, отличающимся от других. Думаете, это не всегда возможно сделать? Ошибаетесь! Сейчас попробую вас переубедить.
К примеру, на сайте несколько картинок одного и того же фотоаппарата. Как сделать, чтобы атрибут альт описывал изображение, в нем были ключевые слова, но и сам он оставался уникальным. Вот простой пример для 4-х картинок (капсом выделены ключевые слова):
Как видите, все условия соблюдены! Все очень просто. Если речь идет об одинаковых женских платьях, то здесь обязательно в описание картинки каждой модели следует вставлять название цвета.
5. Подпись под картинкой
Также важно делать правильные подписи под картинкой. Особенно, если на сайте много изображений и фотографий, но мало текста. Тогда наличие дополнительной подписи будет невероятно важно.
Однако тут следует учитывать определенные особенности создания такой подписи, дабы от нее было максимум пользы. Вот как этого добиться:
Допустим, что на изображении – наушники фирмы «Кактус» (название выдумано). Тогда хороший вариант подписи к картинке – «Наушники «Кактус» хорошо звучат и помогают прочувствовать каждую ноту» или «Звук в наушниках «Кактус» стал намного приятнее благодаря современной технологии «Молния»». (Название технологии, как вы могли догадаться, тоже выдумано).
Теперь вы знаете не только, зачем нужно прописывать тег alt для изображений, но и как это делать, чтобы достигать нужного результата.
Тег alt для изображений: как к нему относятся поисковые системы
Очень и очень трепетно.
Например, сотрудники компании Яндекс не скрывают, что этот атрибут невероятно важен. В частности, они указывают, что чем точнее и правильнее описание изображения, тем выше вероятность, что картинка окажется на первых позициях в поисковой выдаче. Соответственно, и саму страницу, статью изображение будет тянуть за собой наверх.
Google также учитывает тег. Кроме того, чтобы картинка оказалась на первых позициях, поисковые роботы учитывают такие показатели:
Вот вы и узнали, зачем нужно прописывать тег alt для изображений и как к нему относятся разные поисковые системы.
Тег alt для изображений в распространенных CMS
В завершение расскажу о том, как заполнять тег alt для изображений в популярных системах управления контентом
1. WordPress
Сделать это можно двумя способами. Для этого не нужны какие-то особые умения, а также не потребуются и специальные плагины.
Первый метод – когда добавляете картинку в редакторе статьи. После нажатия на кнопку «Добавить медиафайл» перед вами откроется вся библиотека существующих картинок. Выбрав нужную вам и кликнув по ней, вы увидите с правой стороны информацию об изображении и поля, в которые вводится нужная информация.
Второй метод – если картинка уже добавлена в тело статьи. Тогда нужно просто выделить ее и кликнуть на «карандаш», который появится в подсказке. После этого откроются поля с параметрами для заполнения.
2. Joomla
Тут теги прописываются непосредственно на этапе загрузки картинки в тело статьи. Нужно нажать на соответствующую иконку в редакторе. После этого откроется дополнительное окошко с полями для заполнения.
3. Opencart
Это одна из наиболее популярных систем для интернет-магазинов. Как известно, на таких проектах очень много картинок и изображений, ведь без них нельзя детально описать товар.
А что бы создать собственный интернет магазин, приглашаю вас на свой курс по созданию и продвижению интернет магазина с нуля. С точки зрения скорости заработка денег — интернет магазин лучше, чем сайт/блог,так как уже в первый месяц вы сможете сделать первые продажи и именно это я показываю во время обучения!
Чтобы заполнить тег, нужно в редакторе найти иконку, указывающую на изображение – она демонстрирует картину с горами и солнцем. Потом кликнуть на неё и перед пользователем откроется новое окно. В этом окошке под ссылкой находится строка «Альтернативный текст». Вот именно в эту строку и вводится атрибут альт.
Тег alt для изображений: в завершение
Я вам подробно рассказал, зачем нужно прописывать тег alt для изображений. Надеюсь у вас больше не осталось вопросов по этой теме. Если же вы хотите работать с собственным сайтом, создать свой прибыльный и успешный проект, но не знаете с чего начать, приглашаю вас на мой авторский тренинг. На нем я рассказываю, как сделать сайт своими руками. Обучение – бесплатное. Тренинг длится всего 4 дня. После его завершения у вас будет собственный проект, с первыми статьями и посетителями, готовый к продвижению и развитию.
Alt и Title изображений для SEO: как правильно использовать
Атрибут Alt – это описание изображения в теге в виде текста, представляющее собой альтернативный источник информации для пользователей, у которых в браузере отключено отображение картинок на странице. Текст атрибута появляется в том месте, где должно было быть изображение, которое не удалось загрузить. Также данный атрибут считывается роботами поисковых систем в процессе индексации страницы.
Зачем нужны?
Изображение нормально загрузится на странице даже с пустыми атрибутами alt и title. Но вы не реализуете их возможности для более эффективного SEO продвижения самой картинки. Дело в том, что поисковые системы способны анализировать уникальность изображений, но вот распознавать какой тематике они посвящены еще полноценно не могут.
Вдобавок, у поисковиков Google и Яндекс есть сервисы «Картинки», через которые пользователи тоже могут отыскать ваше изображение – то есть это дополнительный источник трафика. Вот почему следует оптимизировать описания для графических изображений.
Вообще важность альтернативного текста, содержащегося в атрибуте Alt, трудно переоценить. Здесь вкратце описывается суть картинки, то есть что на ней изображено. Если у пользователя слабое интернет-соединение и отключен показ картинок, то именно этот текст показывается вместо графики.
Благодаря alt пользователи понимают, что находится на странице. Важно и то, что данный атрибут помогает роботам понять, что изображено на картинке.
Важно! У Яндекса и Google атрибут Alt выступает в роли одного из факторов ранжирования в поиске по картинкам.
То есть он отлично индексируется роботами поисковых систем и применяется для идентификации содержимого изображений. Это способствует увеличению релевантности страницы и привлечению дополнительных посетителей из поиска по картинкам.
Кроме важной роли для SEO тег alt помогает в веб-серфинге слабо видящим или пользователям вовсе без зрения. Специальные программы для чтения текста с экрана распознают и зачитывают информацию, написанную в данном поле.
Поэтому всякий раз, когда вебмастер пренебрегает заполнением атрибута alt, он лишается возможности добавить своему ресурсу дополнительный рейтинг и привлечь больше трафика.
Title для изображений в свою очередь помогает повысить конверсию, особенно коммерческим сайтам, если вставить в него призыв, мотивирующий пользователя осуществить целевое действие. К примеру: «закажите наши услуги со скидкой 20%».
Но title изображения виден только пользователям, сидящим с компьютеров. И если вы хотите донести до пользователей важную информацию, не делайте это в поле title. Рекомендуется разместить ее внутри контента, как обычный текст. А нерелевантный тайтл лучше и вовсе не добавлять.
Как отображаются в коде и на сайте
Когда браузер не подгружает картинки на странице, показывается описание изображения alt:
В коде атрибут alt задается так:
На сайте тег title отображается следующим образом:
В коде title к картинке задается так:
Но если картинка будет использоваться в качестве ссылки, Яндекс советует вставлять title в ссылку:
Как влияют на SEO
В 2014 году Андрей Левчук провел эксперимент, в ходе которого выяснилось, что важнее для поисковой системы: вхождение ключа в контент или вхождение ключа в alt картинки? И как сильно оптимизированные посредством альтернативного текста изображения сказываются на продвижении в целом?
1. Нашел слово, по которому в результатах поиска не выдает ни единой ссылки:
2. Создал два практически идентичных поддомена kvadro1.optimizer.co.ua и kvadro2.optimizer.co.ua – так он уравнял их факторы настолько, насколько это было возможно.
3. На первом поддомене (kvardo1) опубликовал текст с пятью вхождениями ключевого запроса, процент вхождения составил 5,8%.
4. На втором поддомене (kvadro2) создал практически аналогичный текст и добавил 5 уникальных изображений, слегка изменив их в Paint.
5. Посредством Webmaster Tools (WMT) обе страницы попали в поисковый индекс.
Спустя 3 минуты результаты были получены.
Эксперимент начался с того, что после ввода запроса в поиск система не находила никаких релевантных источников. А когда оба сайта добавились на индексацию через WMT, через 4 секунды второй сайт уже оказался в выдаче, хотя отправился на 10 секунд позднее первого.
Вывод – текст индексируется слегка дольше. Что же наблюдалось после попадания страниц в выдачу:
Хотя kvadro1 уже тоже попал в индекс Гугла, в результатах выдачи он отобразился не сразу:
Скорее всего дело в том, что сервера поискового гиганта работают с задержкой и не могут выдавать моментальный ответ.
Далее в поисковой строке было вписано ключевое слово с добавлением оператора «intext:». Был получен ответ:
А еще через 5 минут он увидел такие изменения:
Первый веб-ресурс уже в поиске и отображается на первом месте. За 5 минут изменились сниппеты – у первого сайта сниппет взят из тега Description, а у второго сформирован из фрагмента текста, при этом Google распознает атрибут Alt и тоже добавляет его в описание.
Еще через 2 минуты сниппеты вновь изменяются:
То есть поисковик самостоятельно решает, какой сниппет должен быть у страницы. Но это ни для кого не новость.
Предварительный вывод эксперимента после обхода сайта быстроботом таков – вхождение ключевика в контент приоритетнее для Google, нежели вхождение ключевика в alt изображения.
Отмечу, что после индексации по прямому запросу в «Поиске по картинкам» результаты выдачи пустые. Значит, либо поисковая машина не привязывает изображения к их альтернативному тексту, либо прошло еще недостаточно времени:
Спустя два дня в результатах поисковой системы по основному ключевому слову осталась лишь первая страница, в то время как вторую страницу с картинками Google забросил в «скрытые результаты»:
Но через 12 часов результат был совсем иным. В выдаче по уникальному ключевому запросу остался только второй сайт, а первый совсем пропал. На протяжении последующих пяти дней сайты то поочередно пропадали из выдачи и снова появлялись, то вместе исчезали и опять отображались. Наблюдалось даже, что выдача зависела от того, с какой буквы написать запрос – с маленькой или большой.
Судя по всему, поисковая машина анализировала поведенческие факторы страниц, изучала клики. Либо просто была более тщательная индексация, в отличие от быстроробота, и сайты вставали в очередь на сервере. Быть может даже информация в эти моменты переходила от одного сервера к другому.
Одно остается неизменным: «Поиск по картинкам» до-сих пор пустой. Alt не привязался к изображениям, и это спустя неделю. Также Андрей Левчук отметил, что спустя 5 дней после первой индексации страницы были отсканированы повторно.
Через 3 дня выдача стабилизировалась и получились такие результаты:
Наконец-то добавились в поиск картинки. При этом они расположились в том же порядке, что и в тексте. То есть Google не отдал предпочтение ни одной из них:
То есть эксперимент показал, что «текстовый» сайт победил у «альтовского», в то же время изображения со второго ресурса были включены в «Поиск по картинкам», даже невзирая на его попадание в скрытые результаты.
Какой напрашивается вывод? Прописывать Alt для картинок есть смысл для привлечения посетителей из поиска по картинкам. Но думать, что такая оптимизация поможет взобраться сайту выше в поисковой выдаче – заблуждение. Стоит больше внимания уделять вхождению ключей непосредственно в текст страницы, если у вас оптимизированный сайт, но ему не удается попасть в ТОП. Добавление нескольких ключей в контент окажет больший эффект, нежели уникальные альтернативные описания.
Но помните, что нужен комплексный подход к продвижению – использование одного лишь фактора с ключевыми словами не эффективно.
Как правильно использовать alt для картинок?
Наиболее полезный текст в теге Alt для изображения пишется по принципу «чем проще, тем эффективнее». Просто посмотрите на картинку и напишите двумя-тремя словами в поле то, что видите. Если на картинке изображен пример тега alt в HTML-коде страницы, то так в альте и напишите: «Тег Alt в html страницы». Чем точнее описание, тем выше изображение отобразится в «Поиске по картинкам».
Рассмотрим пример с конкретным изображением и несколько способов заполнения альтернативного описания для него:
Способ №1. В альте указываем «Изображение №1», «Фото 1» или другой подобный текст. Данное содержание абсолютно бесполезно для поисковика и пользователя в качестве описания к картинке. Яндекс негативно относится к такому заполнению тега, сообщая что:
«Фото без содержательных описаний не будут включены в индекс, потому что их не найдут по релевантным запросам».
Способ №2. В alt прописываем «Девочка кормит игрушку кашей». Таким способом мы описываем непосредственно то, что изображено на фото. Но подобный запрос подойдет для информационного сайта, а для интернет-магазина понадобится иное описание.
Способ №3. Содержание альта: «Каша детская». Данный вариант более актуальный для интернет-магазина. Но детских каш много и лучше уточнить название товара.
Способ №4. Указываем в Alt «Каша детская Царь». Самый оптимальный запрос, где в атрибуте содержится название каши с брендом. Если у производителя много каш, можно в описании уточнить цвет, вес, модель и прочие характерные отличия товара от других похожих.
Способ №5. Описание «Каша детская Царь, рецепт семейного счастья Царь, купить недорого, Сочи». Подобное содержание alt поисковые системы воспримут как спам. Поэтому избегайте таких описаний.
Исходя из перечисленных выше методов выделим основные требования к альту:
Но бывает так, что в тех же интернет-магазинах есть одинаковые товары, просто сфотографированные с разных сторон/ракурсов и т.д. И как же их разделять, если нельзя писать идентичные тексты для картинок? Все просто. Допустим, у вас есть несколько фотографий телефона Iphone X. Подписать их можно так:
Когда товары одинаковые, но разных цветов или с прочими отличающимися параметрами, все намного проще. Просто добавляем в текст с описанием соответствующий цвет или другую характеристику:
Указывайте в Alt максимум полезных элементов, характеризующих товар или картинку и которые пользователь может указать в запросе: бренд/модель/цвет/категория и так далее. Но при этом не забывайте об ограничении символов в атрибуте.
Alt можно писать и с маленькой, и с большой буквы. Важно сказать и про имя файла – его название должно соответствовать описанию картинки. Лучше всего изображения делать транслитом, а вместо пробелов вставлять дефис. Например если вы загружаете на свой сайт фото черного iphone x, то файл картинки должен называться так iphone-x-black.jpg
Как правильно использовать title для картинок?
Хотя поисковики и не сильно обращают внимание на содержимое данного тега, косвенно title может сказываться на продвижении, то есть через поведенческие факторы. Контент выглядит куда приятнее с изображениями, наведя курсор на которые отображаются подсказки. Тем более, когда пользователь не может понять, что именно изображено на картинке. Обязательно следите, чтобы title был заполнен правильно:
Нет разницы, писать текст в теге с маленькой или с большой буквы. Со временем в поле title можно вносить изменения – когда боты переиндексируют страницу, измененные описания учтутся.
Можно ли делать Alt и Title одинаковыми?
Сегодня распространено два мнения касательно содержания атрибутов:
Если взглянуть, как данные теги заполняют владельцы сайтов, картинки которых занимают ТОПовые позиции «Поиска по картинкам», то вы увидите и разные варианты заполнения.
Один из сотрудников поисковой системы Яндекс касательно вопроса содержания Alt и Title однажды сообщил:
«Применение одинаковых текстов для alt и title не наказывается».
Это лишний раз доказывает, что главное для данных атрибутов – понятное для людей и структурированное для поисковиков описание того, что изображено на картинке.
Как прописать в WordPress?
Когда вы размещаете контент в редакторе Вордпресса, текст и медиафайлы добавляются в том виде, в котором он будут отображаться на сайте. Писать HTML код самому нет необходимости. А для заполнения тегов alt и title необходимо перейти в свойства изображения, обозначенные иконкой карандаша.
Сейчас CMS автоматически указывает в тайтле название файла, а затем копирует в alt. Но оставлять их в неизменном виде нельзя. Нужно самостоятельно прописывать в теги корректный текст, релевантный изображению.
Преимущества WordPress при использовании атрибутов для картинок заключается в отсутствии необходимости переключения на редактор в HTML-коде, отыскивать необходимый тег, а затем изменять его.
Когда картинка загрузится после добавления в редактор движка, нажмите на нее курсором мыши, кликните по кнопке «редактирование», после чего появится отдельное окно, где и заполняются теги alt/title.
Заключение
Заполнять теги alt и title для картинок нужно, но не сильно акцентируйте внимание на данных атрибутах, так как те же ключевые слова и фразы, применяемые внутри текста, куда сильнее влияют на ранжирование сайта. Использование тегов поможет получить дополнительный поток трафика с поиска по картинкам, если вам удастся продвинуть изображения в ТОП, а также может положительно повлиять на поведенческие факторы, когда при наведении на картинку пользователь будет видеть ее описание.
Еще их наличие поможет пользователям понять, что изображено на фото, если оно не загружается на их устройствах, и людям с нарушением зрения или вовсе слепым, пользующимся инструментами для голосового считывания текста.
Оцените эту статью. Чтобы мы могли делать лучший контент! Напишите в комментариях, что вам понравилось и не понравилось!
Рейтинг статьи: 4.4 / 5. Кол-во оценок: 17
Пока нет голосов! Будьте первым, кто оценит эту статью.