Не работает атрибут alt

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

Но ты можешь потребовать изменения стандарта HTML :-).

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

№4 07-04-2005 18:28:49

Re: Тег ‘alt’ не отображается

Но ты можешь потребовать изменения стандарта HTML :-).

Да нет, он меня устраивает . Однако в некоторых случаях лучше заранее знать, что тумбочка за собой скрывает, а не тянуть 100-150Кб-ную картинку, чтобы убедиться, что она мне не нравится.

А вот предыдущий совет мне помог. Спасибо. Теперь я полностью удовлетворен ФФ и на прочие даже смотреть не хочу.

Отредактировано Poor Fred (07-04-2005 18:29:03)

№5 07-04-2005 21:22:22

Re: Тег ‘alt’ не отображается

в FF для этих целей существует дескриптор «title» и при наведении на картинку появляется всплывающая подсказка. При написании сайтов необходимо указывать и «alt» и «title». И правильно сказал ladserg, что «Тег alt отогбражаетс только в том случае, если недоступна загрузка изображения».

Через сомнения приходим к истине. Цицерон

№6 08-04-2005 04:18:32

Re: Тег ‘alt’ не отображается

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

Думаешь, потребовать владельцев сайта изменить код проще, чем требовать изменить стандарт? Или нужно ходить фоксом только на те сайты, где есть ‘title’, а на остальные эксплорером? Одно время мне так и приходилось делать — для одних сайтов был AvantBrowser, для других FF, но это же не дело, согласись. А с помощью малюсенького расширения все проблемы решились.

Я знаю, что ‘alt’ должен описывать содержание картинки при её НЕПОКАЗЕ, но AvantBrowser показывал его просто при наведении на картинку мыши. И это удобно. Даже несмотря на неполное соответствие стандарту. Именно поэтому я так долго и нудно объяснял, зачем мне это нужно.

Однако, когда буду свой сайт стряпать, совет учту. Спасибо.

Источник

Alt-текст для SEO : как оптимизировать изображения

Статистика статьи

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

Показывает ежемесячный рассчетный поисковый трафик на эту статью по данным Ahrefs. Фактический поисковый трафик (по данным Google Analytics) обычно в 3–5 раз больше.

Количество ретвитов этой статьи в Twitter.

Поделиться этой статьей

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

Из этого руководства вы узнаете:

Чем важен alt-текст?

Alt-текст является важным фактором по четырем основным причинам.

1. Alt-текст повышает уровень доступности

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

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

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

2. Alt-текст может улучшить «тематическую релевантность»

Google изучает слова на странице, чтобы определить ее тематику.

К примеру, если на странице упоминаются пудели, лабрадоры и ретриверы, Google поймет, что на ней представлена информация о породах собак.

Как это связано с изображениями?

Дело в том, что иногда контекст «спрятан» в изображениях, которые Google не может распознать.

Использование alt-текста помогает поисковику «увидеть» эти изображения, а значит, лучше понять вашу страницу и ее содержимое.

3. Alt-текст может повысить рейтинг страницы в Google Images

Google Images — вторая по величине поисковая система в мире. Она выполняет обработку 20,45 % всех поисковых запросов в сети Интернет, что больше доли YouTube, Bing и прочих поисковых систем вместе взятых.

Это значит, что у вас есть возможность привлечь трафик с Google Images.

Просто взгляните на количество переходов на блог Ahrefs из Google Images за последние три месяца:

Джон Мюллер из Google говорит, что alt-текст — это важная часть оптимизации для Google Images:

Alt-текст чрезвычайно полезен для Google Images — если вы хотите, чтобы ваши изображения попали в их выдачу. Даже при использовании «ленивой загрузки» вы знаете, какое изображение будет загружено, поэтому как можно раньше добавьте к нему эту информацию и проверьте, как она отрисовывается.

4. Alt-текст служит якорным текстом для ссылок-изображений

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

Но не все ссылки являются текстовыми — некоторые закреплены за изображениями.

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

Как добавить alt-текст к изображениям

Просто добавьте атрибут alt в тег в коде HTML .

Изображение с атрибутом alt:

Если вы пользуетесь современной системой управления контентом ( CMS ), то в ней наверняка можно добавить alt-текст, не забираясь в сам код HTML .

Например, в WordPress, когда вы добавляете изображение к странице или определенной записи, на экране появляется поле для alt-текста:

В других CMS это делается схожим образом.

Вот инструкции для некоторых из наиболее популярных CMS :

Нужно ли добавлять alt-текст ко всем изображениям?

Нет, это распространенное заблуждение.

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

Например, на некоторых сайтах для разделения контента используются пиктограммы:

Они нужны только лишь для красоты, поэтому добавлять к ним alt-текст не нужно. Такой текст будет только раздражать посетителей с программами для чтения информации с экрана, не добавляя при этом никакой «ценности для SEO ».

То же самое относится к фоновым или стоковым изображениям наподобие этого:

Наличие alt-текста «ванна и свеча» не принесет пользы читателям с нарушениями зрения, поскольку эта информация им ни к чему. Лучше будет, если программа для чтения полностью проигнорирует это изображение.

Но есть один важный момент…

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

Вот как это должно выглядеть:

Как составить хороший alt-текст

Alt-текст — это не квантовая физика. Четко выполняйте приведенные ниже пять рекомендаций, и все будет хорошо.

Будьте немногословны. Пространный alt-текст будет действовать на нервы тем, кто пользуется программами для чтения. Используйте минимум слов (если без длинного описания все-таки не обойтись, используйте атрибут longdesc).
Будьте точны. Главная задача — описать изображение словами.
Не забивайте alt-текст ключевыми фразами. Это не место для размещения ключевых фраз.
Не объявляйте, что это изображение. Не нужно начинать описания со слов «Изображение…» или «Фотография…». И Google, и программы для чтения информации с экрана способны сделать это сами.
Избегайте избыточности. Не повторяйте информацию, которая уже имеется в контексте изображения. Например, если у вас на странице есть фотография Стива Джобса, а прямо под ней написано «Стив Джобс», то добавлять это описание в alt-текст не нужно. Google должен и так понять, что это подпись к фотографии.

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

Примеры хорошего и плохого alt-текста

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

Плохо:

Нормально:

Хорошо:

Идеально:

Плохо:

Нормально:

Хорошо:

Идеально:

Плохо:

Нормально:

Хорошо:

Идеально: AD30HTC — усилитель 30 ватт”>

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

Как найти и исправить проблемы с атрибутами alt

Существует множество служб, которые могут просканировать ваш сайт и найти недостающие атрибуты alt; один из них — Site Audit от Ahrefs.

Но отсутствие alt-текста — это не обязательно проблема, ведь он требуется не для всех изображений.

К примеру, взгляните на эти ссылки с отсутствующими атрибутами alt:

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

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

На это есть две веские причины:

Их уже читают люди с нарушениями работы органов зрения.У 2,4 % граждан США нарушено зрение. Это приблизительно каждый 42‑й человек; из чего следует, что если вашу страницу посещают 10 000 человек в месяц, то 240 из них не могут полноценно потребить ваш контент.
Они потенциально могут получать больше трафика. Alt-текст может помочь изображениям подняться выше в выдаче Google Images, а это приведет к повышению трафика. Даже прирост на 1 % для страницы с 10 000 посещений в месяц означает 100 дополнительных посетителей.

Итак, какова же последовательность действий:

Шаг 1. Определите страницы с наибольшим естественным трафиком

Воспользуйтесь сервисами Google Analytics, Google Search Console или отчетом «Top pages» («Самые популярные страницы») в Site Explorer от Ahrefs.

Шаг 2. Проверьте свои атрибуты alt

Установите бесплатное расширение для Chrome Alt Text Tester, откройте свою наиболее посещаемую страницу и активируйте данное расширение.

Расширение будет отображать alt-текст при наведении курсора на изображение.

Если атрибут alt отсутствует, расширение сообщит об этом.

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

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

…или сделать обратный вывод для этой страницы на сайте The Mirror:

Шаг 3. Сделайте то же самое с другими страницами

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

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

Например, 51 % месячного естественного трафика блогу Ahrefs приносят всего десять записей…

…что позволяет нам легко и быстро проверить и оптимизировать alt-текст для наиболее часто посещаемых страниц.

Напоследок

Улучшение alt-текста является крайне важным аспектом, однако это не единственный пункт в программе поисковой оптимизации изображений. Также нужно оптимизировать названия файлов, использовать адаптивные изображения, предусмотреть «ленивую загрузку» и сделать многое другое.

Источник

Не работает атрибут alt

не работает alt