Автор: HTML — один из основополагающих строительных блоков Интернета. Но так же, как со временем меняются лучшие практики и методы веб-дизайна, меняется и код, который мы используем. По мере развития HTML часть его старой разметки устарела, а другие части были перепрофилированы.
Но разве это не создает для нас больше проблем? Может, нам лучше начать сначала, чтобы убедиться, что мы все работаем на одном языке, а не пытаться вычеркнуть то, что нам не нужно или не нужно?
Проблемы с сохранением устаревшего HTML
Давайте посмотрим, что происходит, когда мы со временем вносим изменения в правила HTML, и как это влияет на Интернет:
1. Рискованно оставлять устаревший HTML
Независимо от того, устарели ли определенные функции и от них пора отказаться, или браузеры вообще перестали поддерживать определенные теги, устаревший код в конечном итоге становится проблемой.
Длинный список устаревших HTML-кодов вы найдете на сайте HTML.com :
Для многих из них HTML-теги и атрибуты были заменены более эффективным стилем CSS. Существуют также примеры устаревания HTML, поскольку функции устарели (например, фреймы).
Тем не менее, все еще существуют веб-сайты, содержащие устаревший HTML.
В некоторых случаях HTML молчаливо сидит на другой стороне веб-сайта. Однако если этого ошибочного кода достаточно, эти дополнительные символы и директивы могут замедлить время обработки вашего сервера и отображать страницы медленнее, чем обычно.
В других случаях HTML нарушает функции на фронтенде веб-сайта . Возьмем, к примеру, это предупреждение от Mozilla относительно <nobr>тега:
Использование устаревшего кода может привести к непоследовательному и плохому опыту на фронтенде. И когда все браузеры наконец присоединятся и решат больше не поддерживать HTML-тег, все посетители останутся со сломанным пользовательским интерфейсом.
Итак, хотя и замечательно, что HTML5 исключил устаревший HTML, который больше не нужен и не полезен, это не означает, что всем следует прекратить его использовать или оставить на старых веб-сайтах.
2. Устаревший код фокусируется на стиле, а не на семантике
Как я уже упоминал, многие устаревшие HTML были постепенно выведены из употребления и заменены на стили CSS. И это хорошо.
Позвольте мне привести вам простой пример…
My favorite book is <i>The Stand</i> by Stephen King. The first time I read it, I didn’t sleep for <i>three days</i>. Thankfully, when I revisit it every year, I have fewer nightmares and can more greatly appreciate the storytelling aspect of it.
В приведенном выше абзаце я использовал <i>тег, чтобы выделить курсивом несколько слов.
В ранние дни HTML <i>обозначал «курсив» (путь <b>обозначал «жирный»). Однако с HTML5 по <i>-прежнему будет отображаться как курсив, но его семантическое значение не столь широко. Он был перепрофилирован для обозначения стилистического изменения , что важно для таких вещей, как названия книг и фильмов, иностранные слова и т. д. Чтобы выразить ударение , мы используем <em>вместо этого тег .
Однако сохранение наследия <i>и <b>тегов может привести к проблемам.
В приведенном выше утверждении я выделил курсивом название книги (The Stand), а также количество бессонных ночей (три дня) с <i>. Независимо от того, решит ли дизайнер сегодня, завтра или через десять месяцев, что он хочет изменить стиль литературных или кинематографических ссылок, мой выбор HTML будет ему помехой.
Поскольку весь мой курсивный текст обозначен <i>, стили не могут универсально применяться к определенному контенту (например, к ссылкам на книги). Вместо этого дизайнеру пришлось бы пройтись по всему коду и очистить его, чтобы он выглядел так:
My favorite book is <i>The Stand</i> by Stephen King. The first time I read it, I didn’t sleep for <em>three days</em>. Thankfully, when I inevitably revisit it every year, I have fewer nightmares and can more greatly appreciate the storytelling aspect of it.
Это позволило бы сохранить семантически выделенный курсивом контент нетронутым, пока дизайнер или разработчик корректирует стили названия книги здесь и по всему сайту. (Хотя, на самом деле, первую выделенную курсивом фразу следует обвести , <cite>так как это было бы более семантически точно.)
Хотя здорово, что мы создали сегодня руководящие принципы использования устаревшего HTML, сохранение старого кода может сбить с толку писателей, дизайнеров и других, кто знаком с предыдущим способом форматирования контента. Сбросив HTML, отбросив старые стили и создав один язык, который мы будем использовать последовательно в Интернете, мы не создадим себе больше работы в будущем.
3. Устаревший код затрудняет доступ
Еще одна важная причина, по которой перепрофилированный и устаревший HTML представляет собой проблему, — это доступность.
Во-первых, если вы оставляете устаревший и неподдерживаемый код, это, скорее всего, вызовет проблемы для программ чтения с экрана, поисковых систем и браузеров, которые используют HTML для получения подсказок о контенте.
Теги заголовков (например <h1>, , <h2>, <h3>), например, используются не только для визуального разбиения больших фрагментов текста. Теги заголовков и, более конкретно, их иерархия представляют важную информацию о взаимоотношениях между темами на странице — и это то, что считывают экранные ридеры и поисковые системы.
Вот почему нам нужно быть очень осторожными с кодом, который мы оставляем за кулисами, даже если читатели на фронтенде не могут его увидеть. Давайте рассмотрим пример того, как это может повлиять на доступность:
Is there an <i>à la carte</i> menu or is it just <i>prix fixe</i> tonight?
Если бы это предложение прочитала программа чтения с экрана, французские фразы были бы произнесены с тем же ударением, что и любые другие выделенные курсивом слова на странице.
Вот почему HTML5 поощряет семантическое кодирование, а не чисто стилистическое.
Правильный способ написания HTML в строке выше будет следующим:
Is there an <i lang="fr">à la carte</i> menu or is it just <i lang="fr">prix fixe</i> tonight?
Для этого есть две причины:
- Чтобы сообщить программам чтения с экрана об изменении языка.
- Чтобы дизайнерам и разработчикам было проще создавать индивидуальный стиль для иностранных фраз.
Семантическое кодирование необходимо дизайнерам, работающим над многоязычными веб-сайтами .
Как поясняет Консорциум Всемирной паутины , в таких языках, как японский, не используется курсив или полужирное начертание для акцентирования внимания — по крайней мере, так, как это делают носители английского языка.
Итак, чтобы правильно перевести страницу с английского, японскому дизайнеру нужно будет убрать курсив или жирный шрифт и добавить окружающие скобки к словам. Однако, если все закодировано с помощью <i>и <b>или есть смесь <i>и <em>и <b>и <strong>, будет действительно сложно легко найти и заменить правильный HTML.
Поэтому, если для вас важны доступность или интернационализация, очень важно четко понимать HTML, на котором вы пишете.
Заворачивать
Дело в том, что переписывание правил HTML требует много работы. Так что, хотя было бы здорово переустановить HTML, я не знаю, насколько это практично.
Все, что мы можем сделать, это быть в курсе того, что происходит с языком, удалять устаревший код с наших веб-сайтов, как только он становится устаревшим, и всегда использовать теги и атрибуты, которые поддерживаются. Играя с устаревшим или перепрофилированным кодом, мы только подвергаем риску опыт посетителей веб-сайта, поэтому лучше потратить время на очистку старого кода при любой возможности.
Если мы все сможем прийти к единому мнению по этому вопросу, проблемный устаревший HTML в конечном итоге исчезнет с наших веб-сайтов и из нашей памяти.
