IronnerВеб-дизайн → HTML5: Nav-элемент и его возможности

HTML5: Nav-элемент и его возможности

18 октября 2011 года

Среди новых элементов HTML5, нацеленных на усиление разнообразия структуры HTML-документов, nav-элемент, пожалуй, наиболее важный.

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

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

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

При отсутствии nav-элемента навигация, как правило, оформляется с помощью элемента div со своим атрибутом class. Значение «nav» в атрибуте class фактически одно из примерно двадцати наиболее часто используемых во Всемирной паутине значений атрибута class. Для сайтов также используются такие значения, как primaryNav и secondaryNav, в целях более подробного разграничения секций навигации.

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

Проблема доступности и удобства применения

Ряд вопросов, связанных с доступностью, сказывается на решении того, куда следует поместить навигацию в структуре документа.

Например:

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

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

Вопрос удобства применения контента для браузеров портативных устройств с минидисплеями тесно связан со второй проблемой. Ряд браузеров для портативных устройств имеет встроенные функции автоматического переформатирования контента в одну колонку для удобного чтения информации с минидисплея.

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

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

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

Альтернативные способы представления навигации

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

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

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

Ваши мысли:

Ваше имя:

Комментарий:

Для выделения используйте следующий код: [i]курсив[/i], [b]жирный[/b].
Цитату оформляйте так: [q = имя автора]цитата[/q] или [q]еще цитата[/q].
Ссылку начните с http://. Других команд или HTML-тегов здесь нет.

Сколько будет 67+9?