Я читал, что не рекомендуется стилизовать контент на основе атрибутов data-* HTML5.
Цитата с html5doctor.com:
Наличие/отсутствие определенного атрибута данных не должно использоваться в качестве зацепки CSS для любого стиля. Это будет означать, что данные, которые вы храните, имеют непосредственное значение для пользователя и должны быть размечены более семантическим и доступным способом.
Может ли кто-нибудь пролить свет на это утверждение или привести несколько примеров того, почему это может негативно повлиять на работу пользователя?
В качестве действительно простого примера, скажем, я использую data-attribute-error="404"
для элементов, чтобы дать обратную связь скрипту, вместо того, чтобы также добавлять классы error-404
, error-500
и т. д. для каждого элемента для некоторого дополнительного стиля, не мог бы я просто стилизовать их так :
.error { color: red; }
.error[data-attribute-error]:after { content: attr(data-attribute-error); }
.error[data-attribute-error=404] { color: grey; }
.error[data-attribute-error=404]:after { color: red; }
/* etc */
Вероятно, это не лучший пример, и я не беспокоюсь о поддержке браузера. Я просто пытаюсь лучше понять общую концепцию.
Кажется, было бы много интересных вещей, которые мы могли бы сделать с помощью CSS3 и пользовательских атрибутов для стилизации вещей на основе контента, сохраняя наши «настоящие» классы более общими для обработки чистого стиля, который не основан на содержании.
Является ли это просто общим правилом, которым можно пренебречь в определенных ситуациях, или это ужасный грех на стороне клиента?
Спасибо!