Атрибуты ALT


    .dev Одесса Developers

    Определение

    Атрибуты ALT являются частью стандарта HTML. Их можно использовать для указания альтернативного текста для изображений, которые включены в веб-страницы. Они играют важную роль в поисковой оптимизации (SEO) и в безбарьерных, доступных для инвалидов веб-сайтах.


    Цель альтернативного текста

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


    Seobility SEO Tool
    SEO Audit creative for free-trial sign-up

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


    Подробно атрибуты ALT используются в следующих 3-х случаях:

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


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

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

    Кроме того, хорошие альтернативные тексты улучшают рейтинг изображений в поиске изображений Google. Особенно графика, которая имеет прямое отношение к содержимому страницы, генерирует больше трафика, поскольку привлекает дополнительных пользователей из поиска изображений на реальный веб-сайт. Если изображения особенно актуальны для определенного поискового запроса, они могут даже отображаться в обычных результатах поиска и, таким образом, увеличивать посещаемость веб-сайта. Что касается SEO, без атрибутов ALT не обойтись.


    Спецификация атрибутов ALT в HTML-коде

    ALT - обязательный атрибут в HTML. Хотя большинство браузеров игнорируют отсутствующие атрибуты ALT, они являются обязательными для всех тегов img и area веб-страницы, соответствующей стандартам.

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

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

    Требования к атрибутам ALT

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

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

    Однако даже идеально оптимизированный атрибут ALT не может скрыть недостаток контента на веб-странице. Следовательно, неправильное использование альтернативного текста не помогает SEO и может - в случае наполнения ключевыми словами - даже быть контрпродуктивным, поскольку Google и другие поисковые системы наказывают такие методы SEO.

    ALT тексты для разных типов изображений

    Оптимальное содержание высококачественного текста ALT во многом зависит от цели и содержания изображения. Хорошей отправной точкой является вопрос о том, какой текст заменит изображение, если оно вообще не существовало. Кроме того, разделение на следующие типы изображений может помочь сформулировать правильный атрибут ALT для SEO:

    Независимые изображения

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

    Встроенные изображения

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

    Пояснительное изображение

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

    Декоративная графика

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

    Отличие от атрибута TITLE

    Хотя ALT можно применять только к тегам img, TITLE - универсальный атрибут, который поддерживается большинством элементов HTML. Его цель - добавить комментарии, короткие пояснения или дополнительную информацию. Веб-браузеры отображают TITLE как всплывающую подсказку, когда на него наведен указатель мыши. Из-за своей важности для доступности и удобства использования альтернативные тексты более важны для SEO, чем заголовки изображений. Следовательно, ALT является обязательной спецификацией, тогда как TITLE используется экономно и осмотрительно.


    Баннер Canva Pro
    Более новые Старые
    Seobility SEO ToolSEO Ads banner 2
    Seobility SEO ToolSEO Ads banner 3