HTML - краткое описание языка

Изображения и их текстовые эквиваленты…


Изображения включаются в документ HTML с помощью элемента IMG.


Значения атрибутов элемента IMG: src - адрес (URL) файла изображения; width - ширина изображения (в пикселах); height - высота изображения (в пикселах); alt - альтернативное текстовое описание.

Обратите внимание: IMG — это строчный элемент. Если вы хотите расположить изображение в отдельном блоке, его можно включить в подходящий блочный элемент (например, DIV). Вы можете найти на сайте как сделать картинку по центру.


В XHTML 1. 0 атрибут alt является обязательным для элемента IMG. Не забывайте указывать его.


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


Это не такие редкие причины, как может показаться на первый взгляд: пользователь может отключить загрузку изображений из-за экономии трафика. При просмотре веб-страниц изображения в среднем составляют до ¾ загружаемой информации. Так как абсолютное большинство изображений не содержат ничего полезного для посетителя сайта, разумные пользователи предпочитают не загружать их; многие пользователи подключаются к Интернету по низкокачественным, медленным линиям связи. Не надо думать, что таковыми являются только небогатые люди, живущие в провинции. Все больше состоятельных людей постоянно имеют при себе компьютеры типа Notebook и с их помощью выходят в Интернет, находясь в дороге, на переговорах или на отдыхе. Качество связи при этом определяется местными условиями, которые не всегда благоприятны. В таких ситуациях отключение изображений обеспечивает гораздо более быструю загрузку веб-страниц; в нашей стране повсеместно распространяются портативные информационные устройства, с помощью которых пользователи также посещают сайты. Это, например, наладонный компьютер, специализированные сотовые телефоны, коммуникаторы. Экраны таких устройств не приспособлены для полноценного показа изображений — прежде всего из-за малого размера. Поэтому многие пользователи портативных компьютеров также отключают загрузку изображений; наконец, бывают пользователи, которые применяют текстовые или речевые браузеры. Это не только люди с ограниченными возможностями, но и те, кто временно оказывается в ситуации, когда обычные средства просмотра сайтов недоступны. Например, в автомобиле может быть установлен речевой браузер, с помощью которого водитель во время движения может прослушивать сайты с новостями и информацией о дорожных пробках.


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


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


Еще один важный аспект пользы от атрибута alt — это его важность для поисковых систем. Многие современные поисковые системы осуществляют поиск среди изображений. При этом поиске они в основном опираются на названия файлов и на содержание атрибута alt. Разве вы не хотите, чтобы изображения с вашего сайта оказывались в первых строчках результатов поиска?


В браузере Internet Explorer содержимое атрибута alt отображается в виде всплывающей подсказки даже тогда, когда сам рисунок доступен. Во многих других браузерах (например, Mozilla Firefox) оно при этом не отображается. Если вы хотите сделать «настоящую» всплывающую подсказку, используйте для этого не alt, a title.


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


Тем не менее, следует соблюдать ряд рекомендаций, которые сами по себе не гарантируют идеального текстового описания, но по крайней мере позволяют избежать ряда ошибок и сделать это описание наиболее удобным и доступным для пользователя: Пишите конкретно, что изображено на рисунке. Не нужно общих слов: «Фото», «Картинка», «Портрет» и т. д.;


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


Для большинства изображений удается составить текстовое описание, не превышающее 5—7 слов. Подбирайте такие слова, которые характеризуют наиболее важные детали изображения.


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


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


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


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


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


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

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


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

Facebook Vk Ok Twitter Telegram Pocket