Оборудование        18.05.2019   

Что значит атрибут alt. Что такое атрибут Alt? Alt и Title должны быть разными или одинаковыми

>> Оптимизация картинок | Атрибуты ALT и TITLE для описания изображений

Как правильно оптимизировать картинки для сайта.

Приветствую Вас, уважаемый читатель моего сайта!

В данной статье, я хочу Вам рассказать о том, для чего используются картинки на сайтах, какую роль они играют для SEO-оптимизации. Рассмотрим важность использования атрибутов html кода alt и title, приведу примеры использования оптимизированных и не оптимизированных изображений, узнаете в каком качестве нужно использовать картинки, и как это сказывается на работе сайта.

Плюсы и минусы использования картинок на сайте:

Плюсы: Возможно, Вы заметили, если Вы заходили на множество сайтов в интернете с какой-то определенной целью, что там практически на каждом сайте присутствуют всевозможные картинки, изображения, фото и другие графические элементы. В каком месте они распологались и какую познавательную нагрузку они несли на данных сайтах или блогах.

Бывает часто такое, когда автор сайта при написании текста конкретной темы, хочет выразить свою мысль более точно и наглядно, чтобы человек, который зашел на данный сайт, получил всю необходимую информацию в полном объеме. Этот фактор сказывается в дальнейшем на его авторитетности в глазах посетителей и раскрутки сайта в поисковых системах, социальных сетях и т.д.

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

И если Вы хотите чтобы Ваши картинки были незабываемые и красивые нужно использовать их по возможности в хорошем качестве.

Еще один положительный момент использования изображений на сайте - возможность использования оптимизации картинок под ключевой запрос определенной страницы сайта с целью улучшения продвижения данной страницы по продвигаемому ключевому запросу .

Плюс к этому, в поисковых системах есть поиск по картинкам, которые находятся на сайтах. И если ключевые слова прописаны к картинкам, то человек, которых ищет по данному запросу себе изображения, может, понравится Ваша картинка и он, возможно, захочет узнать, на каком сайте данное изображение находится и перейдет на Ваш сайт. В итоге Вы выиграете от этого, получив целевой трафик в виде посетителей на свой сайт.

Минусы: Минусов при использовании картинок на сайте может быть много особенно у новичков. Разберем все ошибки, который может допустить случайно или не знавши каждый, что приведет к тому, что использование графики на сайте может отпугнуть посетителя, который находится или пытается зайти на Ваш сайт.

А виной этому множество причин; халатное отношение к своей работе, использование некачественных и в ужасном состоянии изображений, использование их не по теме, наличие слишком большого количества изображений, которые придаю большой вес странице, и она грузится очень долго (в том числе и фон сайта), отсутствует оптимизация изображений под ключевые слова. Вот основные недостатки использования всевозможной графики на сайте.

Но этих минусов можно избежать, зная как их сделать положительными. Все это мы разберем далее в этой статье. Так что дочитайте ее до конца.

Атрибуты alt и title в SEO-оптимизации изображений:

Как я уже писал выше в данной статье, что использование картинок может помочь сайту в его продвижении в поисковых системах. Дать дополнительный приток целевой аудитории (посетителей) с поисковых систем. Для этого Вам нужно использовать два, но очень, нужных атрибута alt и title для любых картинок, изображений, фото и т.д. Суть данных атрибутов заключается в том, чтобы с их помощью выжать максимум, который поможет в продвижении сайта в поисковых системах. В нашем случае атрибутов два соответственно и функций которые они выполняют будут немного различаться.

Атрибут ALT : Данный атрибут входит в язык html. Назначение его заключается в описании какого-то объекта с целью дать дополнительную информацию о данном объекте (в нашем случае изображений). Как данный атрибут работает? Работает он очень просто: Вы берете нужную картинку, которая находится у Вас на жестком диске или носителе (флэшка) и вставляете на нужную страницу сайта в нужное место.

Потом Вы берете, находите код данной картинки и прописываете туда такое значение alt=" Описание данной картинки с использованием ключевых слов " . Но описание не нужно делать слишком большим (максимально пару предложений) и тулить туда много ключевых слов, так как поисковые системы этого не любят, что в итоге может сказаться на Вашем сайте.

Работает данный атрибут alt так, когда посетитель заходит на сайт, то он описание изображения не видит (если в его браузере включена функция показа изображения), но его видит поисковые роботы, когда индексирую сайт . Посетитель может увидеть данный текст, когда отключены в настройках браузера изображения и тогда на месте данного изображения появится текст, по которому посетитель сможет понять что это за картинка. Данный атрибут учитывается поисковыми системами, когда они индексируют Ваш сайт.

Атрибут TITLE: Данный атрибут title также входит в язык html. Назначение его такое же, как и атрибут alt, но с той разницей, что данное описание будет показываться пользователю сайта при наведении на картинку курсором. Данный атрибут не участвует в продвижении сайта, но он позволяет увеличивать поведенческий фактор, который также влияет на позицию сайта в поисковой системе. Пишется оно так title=" Описание картинки " . Поэтому оптимизация изображений играет тоже большую роль при продвижении сайта в поисковых системах.

Образец SEO-оптимизированной картинки с использованием атрибутов alt и title:

Сейчас Вы увидите образец оптимизированной картинки с использованием двух выше перечисленных атрибутов.

C атрибутом title (наведите на картинку курсором)

title="Кот гимнаст" >

С атрибутом alt (без картинки)

Обрацец кода данной картинки:

Без атрибута alt (без картинки)

Образец кода данной картинки:

В каком качестве нужно использовать картинки и изображения на сайте.

Использовать картинки и изображения на сайте конечно лучше в хорошем качестве, но так чтобы они не сильно влияли на загрузку сайта. Так как много людей в интернете пользуются интернетом при малых скоростях и если они не дождутся загрузки сайта, то они покинут данный сайт и больше сюда не вернутся, что в итоге скажется на посещаемости.

Также что я заметил, просматривая множество сайтов так это то, что помимо больших по размеру (килобайты) картинок на сайте используют большой размер фона в качестве картинки. Если уже Вы и надумали использовать в качестве фона изображение, то лучше его выбрать однотонным и маленьким так оно будет слаживаться и у Вас будет цельная картинка.

Также, при использовании качественных изображений, нужно учитывать и размер дискового пространства на Вашем хостинге и скорость работы сервера. Чем она ниже, тем медленней будет загружаться Ваш сайт. Поэтому перед тем как использовать изображения в хорошем качестве для сайта нужно знать, где их применить и в каком количестве.

На этом я данную статью заканчиваю. Я надеюсь, Вы теперь поняли, что такое оптимизация картинок , и какие атрибуты для этого использует оптимизация изображений.

Кстати если Вы не знаете, как уменьшить качество картинки то воспользуйтесь программой Фотошоп. Для этого заходите в меню "Файл" и там выбираете пункт "Сохранить для Web и устройств".

Если Вам понравилась данная статья то, пожалуйста, оставьте комментарий в низу данной статьи. Я очень буду Вам признателен.

Другие страницы сайта:

Не знаю пользуетесь ли вы поиском Гугл или Яндекс по изображениям, но могу сказать одно, даже если Вы не пользуетесь им пользуются сотни миллионов пользователей рунета. С учетом того какая огромная цифра трафика у нас образовалась, целесообразно повышение посещалки интернет-проекта вести также путем наращивания посетителей с поиска по картинкам.

Если говорить о пользователях поисковых систем они имеют как правило либо информационный, либо коммерческий интент. Вне зависимости от того какой у вас ресурс информационный или коммерческий Вам неплохо было бы привлечь либо тех, либо тех, а в лучшем случае всех возможных пользователей. По крайней мере побороться за них.

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

Для начала возьмем любую картинку и в качестве примера разберем, что прописывать в тег alt, а что явно не стоит.

  1. «Фото №1» , или что-либо в этом духе. Так точно не стоит прописывать атрибут alt! Описывает картинку чисто технически и абсолютно не раскрывает ее содержание.
  2. «Маленький мальчик в шапочке» - такое описание с одной стороны хорошо описывает изображение, но с другой стороны не захватывает ни одного значимого запроса, что совершенно не подходит для коммерческих проектов. Да и инфо-сайтам я бы такого тоже не посоветовал. Скорее всего аудитория будет искать шапочку которую рекламирует маленький мальчик и запрос будет задан другим образом. При этом, милых мальчиков и девочек на фотосеты приглашают с целью повысить конверсию.
  3. «Шапка вязаная», «шапка детская» - такие запросы близки к теме. Пользователи действительно задают вопросы таким образом и Вы точно сможете привлечь целевую аудиторию и направить ее внимание на свой продукт. Однако, шапочек много. Даже на вашем сайте может быть раздел посвященный только детским шапочкам, поэтому лучше запрос несколько конкретизировать в угоду пользователям, которые точно знают чего хотят.
  4. «Вязаная шапочка компании Bizonoff» - данный вариант представляется оптимальным, так как точно отражает как изображенное на фотографии, так и в максимальной степени удовлетворяет запросам пользователей. Такой alt отражает название компании, слово «шапочка» отражает габаритные размеры изделия (по крайней мере намекает, что эти размеру не большие), а также каким образом выполнено приведенное изделие. Если на вашем интернет-магазине, landing page или просто информационном сайте существуют типовой продукт отличающийся цветом Вы можете отразить это в атрибуте alt – «вязаная шапочка компании Bizonoff коричневого цвета» .
  5. «Вязаная шапочка, детская шапка, детские шапочки отзывы, шапочка для ребенка» - Вы занимаетесь «душевным онанизмом» чем-то необъяснимым. Толку от такого длинномера не будет и в народе это называется переоптимизация. За такие вещи можно в худшем случае нарваться на санкции поисковиков. В лучшем санкций не будет, но и выхлопа от таких действий тоже.

Как прописывать атрибут alt

  1. Длина текста в атрибуте alt должна составлять до 230-250 символов. При этом минимальная длина 3-4 слова. Это объясняется чисто практическими наблюдениями – очень тяжело написать alt, отражающий всю суть изображенного объемом менее 3х слов.
  2. Текст должен содержать ключевые запросы по которым пользователи смогут отыскать картинку. Важно понимать, что ключи в атрибуте alt и ключи страницы это разные вещи.
  3. Отсутствие спама. Очень важно! Не добавляйте слова «цена», «стоимость», «отзывы», «прайс» … Эти слова никак не характеризуют фото, если на изображении не представлен реальный скриншот ценников, прайсов и отзывов. Тогда конечно можно и нужно.
  4. На Вашем ресурсе всегда есть технические изображения - иконки, картинки, стрелочки, фоновые изображения и т.п. Для них советую в атрибут alt не писать ничего. Так вы покажете технический характер изображений. Некоторые люди умудряются туда вставлять ключевики страницы, но это не айс. Не связывайтесь с поисковыми роботами – они реально крутые ребята.

Несколько слов насчет атрибута title для изображений

Основываясь на собственных экспериментах в области продвижения можно с уверенностью сказать, что title учитывается только поисковым алгоритмом Яндекса и полностью игнорируется гуглом. Лично я использую title только для юзабилити. Если же говорить о том, что писать в title, то я вставляю в него тоже, что и в alt. Это объясняется тем, что написать что-то отличное от текста в альте просто очень и очень тяжело. Да и можно сказать незачем.

Тема сегодняшней статьи – SEO - оптимизация изображения с помощью атрибута ALT. Многие не знают, что при оптимизации данного атрибута вы повышаете вероятность посещения вашего сайта. Итак, более подробнее расскажу далее в статье:

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

ALT – это атрибут, в котором содержится альтернативный текст изображения. Атрибут показывается, когда в браузере отключен показ изображения, но в стандартных настройках вы его не увидите.

Как правильно прописывать описание картинки

Прежде чем прописывать Title я расскажу вам частые ошибки, которые замечаю на сайтах.

Пустые атрибуты ALT и TITLE . Как правило, многие SEO оптимизаторы не заморачиваются по поводу этого тега. Да, возможно, если ваш сайт очень крупный имеет посещаемость 100000 в сутки заморачиваться не стоит, но если вы только раскручиваетесь и вам нужен первый трафик, то указать атрибуты все же стоит.

Не соответствие изображения и атрибутов. Допустим если на вашей картинке отображена BMW X5, а в атрибуте прописываете Audi A3, то не ждите что человек перейдет по вашей картинке на сайт.

Переоптимизация . Часто встречающаяся проблема, можно ставить прям в пример как не нужно делать. Оптимизаторы надеясь получить заветный трафик прописывают по несколько ключевых слов в атрибут “alt” и ждут, когда позиции в выдаче среди картинок начнут расти. Вы должны понимать, что данный текст будут читать люди, которые оценивают несколько картинок и если там сплошь спам никто не перейдет по ссылке. Добавлять коммерческие слова “купить, заказать, цена, стоимость, наименование города” не рекомендуется.

Так же поисковые системы могут наложить на вас санкции, поэтому не увлекайтесь.

А как же нужно прописывать теги для картинок?

Краткое и понятное описание картинки. Как можно точнее опишите изображение и если ALT был создан автоматически перепроверьте все страницы.

Длина атрибута ограничена. Поисковые системы учитывают 3-4 слова (около 250 символов) что затрудняет описание картинки.

Вхождение ключевых слов. Собственно, из-за чего атрибут ALT и стоит указывать. Пишите ключевое слово понятным для пользователя текстом.

Например:

alt=”Ремонт компьютеров в Чебоксарах”

Уникальные атрибуты для каждой картинки. Так же важная составляющая, самая встречающаяся проблема у SEO-оптимизаторов. На примере я вам покажу как ее решить.

Карточка товара содержит много картинок


Как же разделять картинки одного и того же товара, если спамить нельзя и нужно прописывать все уникальное? Допустим “Сплит-система HYUNDAI H-AR6-07H” можно расписать так:

“Сплит-система HYUNDAI H-AR6-07H Вид 1”

“Сплит-система HYUNDAI H-AR6-07H Вид 2”



Помимо картинок товара, есть у вас на сайте имеются элементы: похожие товары, с этим товаром чаще смотрят и так далее. Данный вид картинок не стоит сбрасывать со счетов и SEO оптимизировать их прописав ALT и Title. Причем стоит уделить время прописать конкретно: бренд, модель, номер товара, все важные параметры, которые люди могут вбивать в поиск.

Размер изображения – чем больше разрешение картинки, тем лучше. В любом случае ее отображение можно подкорректировать благодаря атрибутам “width” и “height”. Но не стоит делать картинку слишком маленькой, в противном случае поисковые системы не будут учитывать изображение меньше 150 пикселей и будут считать ее за иконку.

Расположение изображения – как можно ближе к тексту, который содержит ключевые слова. Вот почему многие оптимизаторы учитывают этот фактор и стандартная схема расположения картинок выглядит так:

Текст заголовка с ключевым словом

Дальнейшее описание

Уменьшение веса изображения. Размер картинки играет ключевую роль, ведь если она будет весить очень много, что даже будет тормозить скорость загрузки сайта это скажется на ранжировании всего сайта. Да-да бывало и такое!

Подпись под картинкой

Если на вашем сайте очень много картинок и почти нет текста, подпись картинкой будет полезна, поэтому именно с точки зрения SEO необходимо ее оптимизировать:

  • Указать ключевые слова. Вхождение ключевиков в подпись обязательно, так как данный текст сыграет роль в ранжировании всей страницы;
  • Указать какой-либо факт/преимущество о картинке.

Например, у вас картинка динамиков Iphone 7.

В подписе укажите данный факт: “Звучание звука в Iphone 7 стало заметно лучше благодаря Lighting” Отношение Яндекса к атрибуту ALT



“Как поместить мою картинку на первое место?"

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



Текст под картинкой несет гораздо большую пользу для поисковика, чем собственно сам ALT.

Ранжирование картинок в Google

Помимо вышеупомянутого ALT, вот что учитывает Google в ранжировании изображений.



Давайте пробежимся по главным факторам для Google.

Фотографии хорошего качества – это должно быть понятно, итак. Никому не будут интересны размытые фотографии или просто плохого качества. Здесь скорее качество картинки играет на ее кликабельность, некий CTR.


Отдельные страницы для каждой картинки – интересная мысль, но честно редко встречаю такие сайты. Проблематичным становится оптимизировать: интернет-магазины, одностраничные сайты, сайты каталоги, где хранится большое количество изображений.

А что по поводу атрибута Title

Google не упомянул, а Яндекс по минимуму атрибут Title. (Не путать с тегом ). Указать лишним точно не будет, только можно по тому что Title при наведении на картинку отображается и несет в себе смысл. В этом плане, как и с текстом под картинкой можно экспериментировать, указывать полезную информацию: различные факты, преимущества и так далее.

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

Вот и все. Задавайте вопросы в комментариях, кто что думает по поводу атрибутов ALT, TITLE. Как вы оформляете изображения?

Здравствуйте, друзья.

Сегодня следующий материал по работе с изображениями.

Я продолжаю публиковать материалы по продвижению и на данный момент это вторая статья, которая касается именно изображений на нашем сайте. Первая была про создание качественных скриншотов.

В этой статье я покажу, как производится оптимизация изображений на сайте с помощью атрибутов title и alt для продвижения страниц в поисковых системах.

Статья будет не очень большая, но полезная.

Начнем с того, что вы должны усвоить один момент. Не все обращают внимание на мелочи в продвижении своих сайтов. Особенно на различные мелочи технического плана, например оптимизация изображений.

Это всего лишь одна мелочь из массы, правильное использование которой может помочь вам обойти конкурентов на страницах поиска. Если использовать все мелочи в совокупности, то вы получите очень больше преимущество над другими сайтами.

Поэтому, упускать такой момент крайне нежелательно. И сейчас мы поговорим о том, как же правильно оптимизировать изображения на нашем сайте и с каких этапов состоит данный процесс.

Весь процесс оптимизации я разделяю на 3 этапа:

  1. Создание уникального изображения;
  2. Подготовка окончательного изображения для размещения на сайте, которое не будет грузить блог. На данном этапе мы уменьшаем размер изображения, чтобы страницы грузились быстро;
  3. Правильная оптимизация атрибутов title и alt изображения.

Сюда еще можно добавить правильное название исходного файла, перед загрузкой на сайт. Об этом поговорим ниже.

Про создание уникальной картинки и последующее я выделю отдельные подробные статьи с видео-уроками. Сейчас я же хочу акцентировать свое внимание именно на атрибутах title и alt, так как многие их заполняют неправильно или же не заполняют вообще. А зря!

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

Ну а теперь рассмотрим процесс оптимизации изображений на практике. Как я уже говорил выше, рассмотрим заполнение всех данных - title и alt картинок.

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

Как правильно заполнять title и alt изображений?

Сначала скажу пару слов об этих атрибутах. Зачем они нужны?

Основная задача - дать поисковым системам понять, о чем то или иное изображение. Также эти параметры позволяют попасть изображениям в поиск по картинкам по определенным запросам, которые мы и пропишем в данных атрибутах.

Теперь рассмотрим, как же нужно заполнять их.

На этот счет существует просто огромнейшее количество мнений. У меня сформировалось свое виденье, исходя из изучения различных курсов и докладов людей, разбирающихся в сайтов.

Сначала разберем, что это за атрибуты.

  • Title - во всех случаях это тег заголовка чего-либо (заголовка записи, изображений и так далее);
  • Alt - атрибут тега img itemprop="image", который описывает изображение. Еще называется "альтернативный текст".

Атрибут alt является очень важным для изображений. Его нужно заполнять в 100% порядке. На заполнив же Title, ничего плохо не произойдет, но для лучшего эффекта также необходимо на него обращать внимание.

Первый также отображается на сайте в виде текста, когда картинка не загружается по определенным причинам. Заголовок отображается при наведении на картинку, расположенную в статье.

На практике, если просмотреть код изображения на сайте, title и alt выглядят следующим образом.

Видим, что эти атрибуты находятся в коде во 2й строке. Им заданы определенные значения, а точнее те фразы или слова, которые описывают содержимое картинки. Именно содержимое картинки, а не ключевые слова и еще что-то.

Сейчас уже нельзя вписывать в данные атрибуты большое количество ключевых слов, а там более в каждое изображение статьи. Представьте, что у вас на странице 40 изображений. Если вы пропишите в title и alt всех изображений ключевые сова, то вероятно, что попадете под санкции поисковых систем и высоких позиций в выдаче не видать.

Единственное правило, которого я придерживаюсь и рекомендую использовать его и вам - прописывать в данных атрибутах очень краткое описание того, что изображено на картинке.

Можно также вписать и ключевое слово, по которому продвигается статья, но сильно с этим не играйтесь. Я прописываю максимум к одному изображению в статье - к главной первой миниатюре.

Будет очень хорошо, если ваша картинка будет окружена тематическим текстом, который также ее описывает. Но опять же, все должно быть понятно посетителю и не восприниматься, как какая-то манипуляция. Все делаем естественно. Если тематический текст не имеет места быть возле картинки, то просто пропишите title и alt к изображению и все.

Title и alt должны быть одинаковы?

И снова куча мнений. Кто-то говорит, что должно быть различие, а кто-то - лучше эффект, когда одинаковые. Я же больше склоняюсь верить каким-то фактам. Для этого я взял пару очень успешных ресурсов и посмотрел, как прописываются данные атрибуты у них.

На ресурсах, которые быстро получили хорошие результаты, оптимизация изображений сводится к одинаковому заполнению обоих атрибутов. Да и ключевые слова в них не содержатся. В них действительно прописывается краткое описание того, что изображено на картинке.

Поэтому, следующий вывод - атрибуты title и alt можно делать одинаковыми.

Но, это не 100% догма. Можете сделать их немного отличными, но чтобы смысл не терялся от этого. И тайтл и альт должны описывать изображение. К тому же title может вообще отсутствовать (ошибки в этом нет) и содержать иную информацию кроме описания самой картинки. Более подробно о грамотном заполнении альта и тайтла я . По предыдущей ссылке я копнул глубже в вопросе заполнение данных тегов. Очень советую проштудировать материал.

Как практически прописать атрибуты к изображению

Если вы используете какой-нибудь движок, то в нем предусмотрена такая функция. Вероятнее всего, что у вас сайт на WordPress. В нем все делается очень просто.

Во всплывающем окне задаются параметры изображения, в том числе прописываются title и alt.

Заполняем все и и не забываем обновить файл, что изменения вступили в силу. Так делаем с каждым изображением.

Если же у вас сайт не управляется никакой платформой, то есть простая html страница, то придется добавлять руками.

Я рекомендую сделать следующим образом. Естественно, вам потребуется исходный код сайта, где вы можете увидеть код изображения. Вам нужен открывающий тег

Чтобы сильно не ломать голову, дам тот же код, что и ранее. Возьмите его, как болванку себе.

Смотрите на него, как на образец, куда необходимо вставлять атрибуты, которые копируете из этого же кода. Затем прибавляете их к своим картинкам, заполнив при этом свое описание.

Не забываем, что заполняем эти данные, исходя из содержимого картинки. Описываем само изображение!

С этим вопросом разобрались. Тут все предельно ясно.

Вкратце вывод таков: "title и alt заполняем одинаковыми и прописываем в них описание самого изображения, то есть того, что изображено на картинке" .

Данный вопрос мы рассмотрели. Но тема оптимизации изображений многогранна и есть еще другие важные моменты, используя которые, можно улучшить эффект своего сайта.

Другие важные моменты

Имеется еще 3 вещи, которые я не рассмотрел выше:

  • название файла изображения;
  • уменьшение веса изображений;
  • уникальность картинок для сайта.

Сейчас я рассмотрю только 1й момент, так как под остальные 2 я выделил полноценные объемные материалы.

Про название файла мало кто пишет в интернете. Но тут также имеются свои нюансы. Как нужно называть сам файл, перед загрузкой его на сайт?

Как всегда, мнения разделяются. Кто-то пишет, что нужно употреблять ключевые слова. Кто-то, что необходимо называть описанием картинки, то есть точно также, как title и alt.

А некоторые загружают файлы с любыми названиями. Сделали скриншот с помощью какой-то программы. Ему было присвоено имя текущей датой, таким его и загрузили.

Я склоняюсь больше ко второму варианту, когда мы и в названии самого файла тоже стараемся описать изображение. Никаких ключевых слов, за исключением самой главной картинки в статье. И то, можно не употреблять и там.

В пример покажу изображение из предыдущий статьи моего блога про создание формы подписки на обновления сайта. Возьму следующую картинку.

Код изображения имеет вид.

Привет, народ. Дабы не тратить ваше время, давайте коротко и по делу.

Title картинки – это надпись, которая всплывает при наведении курсора на изображение. Это нужно, чтобы дать подсказку посетителю. Рассказать, что изображено на картинке или куда обратить внимание.

Alt картинки – от английского слова alternative. Это такая полезная вещь, которую очень любят индексировать поисковики, дабы определить, что изображено. Также, он будет виден, если пользователь отключит в браузере отображение картинок. Что не имеет смысла и совершается в редких случаях.

Если все же пользователь выключит отображения графического контента или произойдет какой-то сбой на чьей-то стороне, то вместо картинки будет виднеться маленькая иконка с текстом. Этот текст и есть alt изображения.

Alt и title картинки для SEO

Для тайтл картинки имеет минимальное значение. Он индексируется не охотно, но вот может сыграть вам на руку в поведенческих факторах. На дворе 2018 год, seo сейчас — это юзабилити и качественный контент. Поэтому привлекайте внимания пользователя любым способом.

Даже сами подумайте, приятней же когда появляется всплывающая подсказка у изображения.

А вот alt картинки — это клад. Во-первых, его отсутствие GoogleBot считает ошибкой, Яндекс относится лояльней. Во-вторых, он охотно индексируется, а такое изображение попадает в раздел «Картинки» в поиске. Это значит, что таким способом вы сможете привлекать дополнительный трафик на свой сайт.

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

Как правильно заполнять alt и title для картинок

C title все намного проще. Для поисковика правил нет, но это не значит, что вы пишите тут любую ересь. Выше мы делали подводку к поведенческим факторам. Желательно вам не надоедать пользователю, быть ему полезным.

1) Он не должен быть длинным. Согласитесь, подсказка в 4 строки будет вызывать отторжение.

2) Должен как-то относиться к изображению.

3) Не должен дублироваться с основным title, заголовками h1-h5, с атрибутами alt.

Alt картинки имеет вес у поисковика, поэтому здесь есть ограничения с правилами, но так и возможности.

1) Одного слова не достаточно, желательно держаться в рамках от 3 слов. Максимальное число символов 250.

2) Он должен соответствовать содержимому изображения.

4) Желательно, не должен повторяться с другими alt на странице.

Так что, добавляя очередную картинку в блог, подумайте. Может какой-то человек захочет её найти? Попробуйте превратить его в лишний трафик.

Где заполнять alt и title картинок на примере wordpress

Например, в вордпресе вам достаточно зайти из панели управления (консоль) в раздел «Медиафайлы» «Библиотека» . Далее выбираете любое изображение.

Или, редактируя статью, просто жмёте на любую вставленную картинку, после на карандашик.

Конечно, на примере wordpress показать легче всего, но многие популярные CMS дают такую возможность. Вот, к примеру – Joomla. Там есть свои подводные камни, но у большинства графического контента можно прописать alt если нажать «Редактировать изображение»

На этом все. Очень надеемся, что мы вам были полезны. Если да, поставьте лайк. Это нас мотивирует делать больше качественного и интересного контента!

С уважением, Ваша Суть.