Веб-дизайн - [11]

Шрифт
Интервал

Главный принцип, который нужно при этом иметь в виде, формулируется так: alt–текст должен давать текстовый эквивалент информации, содержащийся в изображении, а не некую метаинформацию о самом этом изображении. С этой точки зрения исключительно неуместно смотрятся вставляемые иногда в alt–тексты размеры файлов изображений в байтах или же советы типа «Включите загрузку графики, чтобы увидеть эту картинку». В простейшем случае, когда картинка содержит заголовок, надпись на кнопке или другой текст, ее атрибут alt обязан содержать в точности этот самый текст и ни слова больше. Ниже перечислены некоторые распространенные типы изображений и принципы выбора alt–текстов для них:

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

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

• Для разделителей, аналогичных по функции тегу HR (стр. 203), подходящим alt–текстом будет ряд небуквенных значков — например, "======" или "******".

С другой стороны, такое решение неплохо смотрится только в текстовых броузерах вроде Lynx, тогда как владельцам речевых броузеров, скорее всего, не очень–то понравится слушать монотонное «знак равенства, знак равенства, знак равенства…»

• Для кнопок панелей навигации (стр. 206) и всех прочих изображений–ссылок разумно принять особое правило оформления alt–текстов (например, я рекомендую заключать их в квадратные скобки). Это следует делать не только для того, чтобы ссылки легко было найти в текстовом эквиваленте страницы, но и для отделения alt–текстов друг от друга: дело в том, что, если графические вставки идут одна за другой без пробелов, их alt–тексты также не будут ничем разделены, если только пробелы или другие символы–разделители не предусмотрены в них самих.

Приведенные здесь правила рассчитаны на то, чтобы облегчить доступ к информации на любых платформах и в любых средах — графической, текстовой или звуковой (стр. 34). В последнее время, однако, графические броузеры несколько переопределили семантику атрибута alt: начиная с четвертых версий броузеры Netscape и Microsoft не только показывают alt–текст на месте отсутствующей графики, но и выводят его в виде «всплывающей подсказки» (floating tip), возникающей при поднесении курсора мыши к изображению. С одной стороны, это нововведение заставит визуальных дизайнеров внимательнее относиться к расстановке alt–текстов на своих страницах — не писать туда что попало и не забывать о пустых alt–текстах у вспомогательных изображений. С другой стороны, непосредственное участие alt–текстов в процессе интерактивного исследования страницы заставляет дизайнера отказаться от дословного воспроизведения в alt–текстах содержимого графических вставок: сейчас не редкость страницы, в которых, например, alt–тексты дают расширенные пояснения для слишком лаконичных или же вообще лишенных текста кнопок навигации.


Доступность: изображения–карты. В HTML существует два способа сделать так, чтобы части одного изображения служили ссылками на разные адреса: серверные (server–side) и клиентские (client–side) изображения–карты (image maps). Первый из этих способов, предполагающий посылку серверу координат точки, в которой произошел щелчок мыши, и получение в ответ URL-адреса, на который нужно перейти, сейчас встречается уже довольно редко, и это нельзя не приветствовать: поскольку само понятие «координат» имеет смысл только в графической среде, оформленные таким образом ссылки по определению недоступны никому, кроме пользователей графических броузеров.

Клиентские изображения–карты, которые хранят конфигурацию областей, чувствительных к щелчку мыши, и соответствующие им UR. L прямо в HTML-файле, с этой точки зрения куда предпочтительнее: неграфический броузер может, проигнорировав само изображение, представить список его чувствительных областей в виде обычных ссылок. Для этого нужно не забыть снабдить каждый тег AREA внутри тега MAP атрибутом alt (который, кстати, согласно стандарту является его единственным обязательным атрибутом), чей текст и будет оформлен в виде соответствующей ссылки.

Еще предпочтительнее, однако, совсем отказаться от карт и разрезать изображение на отдельные «кнопки», не забыв прописать для каждой соответствующий alt–текст. Графические броузеры позволят вам заверстать изображения вплотную без каких–либо швов или зазоров, так что дизайн страницы от этого не пострадает. Кроме гарантированной Доступности в неграфических средах, это решение позволяет иногда понизить для исходного изображения цветовую глубину и, соответственно, уменьшить общин объем файлов страницы (стр. 253).


Рекомендуем почитать
Интернет вещей. Новая технологическая революция

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


Инстаграм: хочу likes и followers

Instagram на сегодняшний момент самая динамично развивающаяся социальная сеть, имеющая самый дешевый трафик. Множество людей проводят, в среднем, от 2 до 5 часов в день за просмотром Instagram. Поэтому здесь очень легко добиваться результатов. Не важно, хотите вы быть популярным блогером, вывести бизнес в Instagram, или освоить новую востребованную профессию SMM-специалиста – эта книга будет одинаково полезна всем. Эта издание – не набор теоретических данных. Это практика. По этим технологиям прошли обучение 250 государственных организаций; около 3000 специалистов стали экспертами в области SMM.


Интернет вещей: Будущее уже здесь

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


Атака на Internet

Эта книга является одним из первых специализированных изданий, написанных отечественными авторами, которое посвящено обстоятельному анализу безопасности сети Internet. В книге предлагаются и подробно описываются механизмы реализации основных видов удаленных атак как на протоколы TCP/IP и инфраструктуру Сети, так и на многие популярные сетевые операционные системы и приложения.Особое внимание авторы уделили причинам возникновения и успеха удаленных атак, а также их классификации. Были также рассмотрены основные способы и методы защиты от удаленных атак.Издание предназначено для сетевых администраторов и пользователей Internet, администраторов безопасности, разработчиков систем защит, системных сетевых программистов, студентов и аспирантов вузов, а также для всех интересующихся вопросами нарушения и обеспечения информационной безопасности компьютерных сетей.


Рунетология. Кто управляет русским Интернетом?

Самые сильные российские интернет-бренды. Самые известные люди Рунета. Самые первые его «поселенцы». Им посвящена программа Максима Спиридонова «Рунетология», выходящая еженедельно в рамках аудиожурнала PodFM.ru. Накопленный материал представляет большой интерес для тех, кто развивает свой бизнес в интернете.В эту книгу вошли двадцать лучших интервью последнего года. Читайте, если вам интересны биографии ярких людей. Читайте, если вам хочется больше узнать об истории построенных ими мощных компаний. Читайте, если вы ищете пути к успеху в Сети.


Добавьте в корзину. Ключевые принципы повышения конверсии веб-сайтов

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