ID атрибуты элементов не повышают семантику ваших документов.

Автор статьи: Louis Lazaris.    Оригинал:http://www.impressivewebs.com/ids-not-make-documents-semantic/

До того, как я доберусь до сути вопроса, обсуждаемого в данной статье, я хочу, чтобы вы четко представляли себе его контекст. Не так давно, Харри Робертс опубликовал потрясающую статью, в которой разъясняет свою точку зрения касательно неверного CSS кода (*ее перевод уже сделан на хабре). В этой статье, он не рекомендует использовать идентификаторы ID в качестве CSS селекторов.

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

После нескольких обменов мнениями, Зельдман, пишет следующее:

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

Вот мое мнение на этот счет:

«Уникальность идентификаторов и возможность многократного применения имен классов – это не "метод старой школы". Это именно то, как стандарты HTML предусматривают идентификацию элементов. И корректное понимание HTML стандартов, совсем не является устаревшим ("старой школой"). Да и вообще, можно ли считать устаревшим способ определения элементов, предусмотренный стандартами W3C концорциума?»

И вот несколько его заключительных слов достойных внимания:

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

Да, действительно, приверженность могуществу кода, лишенное уважения (или понимания) безграничной истинной силы HTML, преследует Web со времен первой табличной разметки. Большую часть истории Веба, для разработчиков считалось нормой создание достойных проектов на основе низкопробных, нестабильных платформ, пренебрегая при этом самим понятием HTML семантики. В определенный период, в 2000-х, мы смогли изменить это восприятие, благодаря чему большинство людей нашей индустрии все еще понимает значение удобного, семантически корректного кода. Я лишь переживаю за тех, кто этого не осознал, но вы не в состоянии повлиять на каждого.»

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

Принимаются ли во внимание идентификаторы ID машинами?

В части, посвященной семантике публикации Марка Пилгрима«Погружение в HTML5» («Dive Into HTML5»), поясняется:

«Элемент <div> не содержит никакого смыслового значения, это же касается и атрибута id. (Пользовательским агентам (браузерам) не позволено рассматривать значения атрибутов id с точки зрения семантики.) То есть, если вы измените свое значение атрибута на вот это — <div id="shazbot">, то в семантическом смысле они будут эквивалентны, то есть абсолютно бессмысленны.»

А что на этот счет скажет W3C. Вот что говориться в HTML5 спецификации по поводу атрибута ID:

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

Идентификаторы являются обычными строчными данными. И смысловые значения отдельных id атрибутов не должны приниматься во внимание.»

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

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

Есть ли польза от идентификаторов ID для программ чтения с экрана?

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

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

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

И какое это имеет значение для CSS?

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

Наличие аргументов против применения идентификаторов ID в качестве селекторов совсем не означает, что их совсем не нужно использовать в HTML. Речь идет об их присутствии в селекторах стилей, а не о семантике или структуре документа.

Селекторы с идентификаторами излишне специфичны, и при их избытке они могут нарушить каскадность таблиц стилей. Вы, конечно же, можете употреблять ID селекторы для пары уникальных элементов, и в этом случае у вас не возникнет каких-либо серьезных проблем. Но зачем вам это делать, если вместо них вы можете с таким же успехом использовать уникальные имена классов? А если для вас очень важно быстро и однозначно определять уникальный селектор на фоне остальных, присутствующих в вашем CSS коде, то для этого вы можете использовать префиксы или что-то вроде того. В этом случае будет сразу понятно, что этот класс не для многоразового использования. Вот, к примеру, вместо этого селектора:

#header { }

Вы можете применить вот такой:

.header-main { }

Или, если необходимо, даже такой:

.id-header { }

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

Что о ID селекторах говориться в CSS спецификации?

Вот цитата из раздела о ID селекторах CSS спецификации:

«Используемый в документе язык (*CSS используется в различных форматах веб-документов — HTML, XHTML, XML) может содержать атрибуты, с объявленным типом ID. Особенность атрибутов типа ID заключается в том, что в рамках соответствующего документа не должно быть двух одинаковых значений, независимо от типа элементов, в которых эти атрибуты указаны; при любом языке документа, атрибут типа ID может быть использован для уникальной идентификации его элемента.»

То есть, правило фокусируется на уникальности элемента, а не на его семантике. Уникальность имеет свои плюсы при использовании идентификаторов фрагментов и для привязки элементов документа к коду JavaScript, но в плане семантики не имеет никакого смысла.

На самом деле, ведь нигде, ни в одной спецификации (CSS или HTML) не говориться о том, чтобы использовать селектор ID для создания семантически корректного документа.

Итоговые замечания.

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

Я бы не стал высказываться на этот счет, если бы его мнение было менее влиятельным. Но судите сами, у него порядка 300 000 последователей в Твиттере и кто знает, сколько читателей его блога. И если хотя бы 10% из этих читателей и последователей, прочитав его пост, сделают вывод, что ID атрибуты или ID селекторы могут улучшить семантику документа, то это нанесет серьезный ущерб сообществу веб-разработчиков.

Я, конечно же, буду спать спокойно, если люди продолжат использовать идентификаторы для определения стилей элементов. Это их выбор и они имеют на это полное право. Но утверждать, что наши документы будут в большей степени соответствовать W3C стандартам, если мы будем использовать идентификаторы в качестве селекторов или говорить о том, что наш контент улучшится с точки зрения доступности или семантики благодаря применению идентификаторов в HTML коде – это уж точно не отвечает W3C стандартам.

Последняя информация: Зельдман все-таки любезно признал некоторые свои ошибки (если не все), касательно идентификаторов и семантики:

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

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

…»

*Что касается последнего комментария, то именно этому вопросу посвящен мой следующий пост – перевод статьи «The Truth About HTML5» Люка Стивенса.

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

* Примечание переводчика.

Ссылка на оригинал: http://www.impressivewebs.com/ids-not-make-documents-semantic/

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *