Устойчивый веб-дизайн - Jeremy Keith
Шрифт:
Интервал:
Закладка:
Крупный план экрана с зеленым текстом на черном фоне. Браузер Line Mode Browser в действии.
Как только в мире появилось два веб-браузера, важными вопросами стали совместимость и обратная совместимость.
Например, что должен делать браузер Line Mode , когда он встречает непонятный ему элемент HTML, такой как NEXTID?
Ответ можно найти в скудной документации, которую Тим Бернерс-Ли написал для своей первоначальной коллекции под названием HTML Tags. Под заголовком " NEXTID " он написал:
Программное обеспечение браузера может игнорировать этот тег.
Это безобидное на первый взгляд решение имело далеко идущие последствия для будущего Всемирной паутины.
Тим Бернерс‐Ли, улыбается. Сэр Тим Бернерс-Ли. Фотография Пола Кларка. Лицензировано по лицензии Creative Commons Attribution-ShareAlike 4.0 International.
Рекомендации
Information Management: A proposal by Tim Berners-Lee
Telecom Maps by TeleGeography
As We May Think by Vannevar Bush
HTML Tags
Глава 2: Материалы
Рискуя научить
бабушку сосать яйца, я бы хотел, чтобы вы подумали о том, что происходит, когда браузер разбирает элемент HTML. Возьмите, например, элемент абзаца с каким-то текстом внутри него. Есть открывающий Р-тег, закрывающий Р-тег, и между этими тегами есть текст.
<p>some text</p>
Веб-браузер, столкнувшись с этим элементом, отобразит текст между открывающим и закрывающим тегами. Теперь рассмотрим, что произойдет, если тот же веб-браузер встретит элемент, который он не распознает.
<marklar>some more text</marklar>
И снова браузер отображает текст между открывающим и закрывающим тегами. Здесь интересно то, что браузер не делает. Браузер не выдает ошибку. Браузер не останавливает разбор HTML на этом этапе, отказываясь идти дальше. Вместо этого он просто игнорирует теги и отображает содержимое внутри них.
Такое либеральное отношение к ошибкам позволило со временем расширить словарный запас HTML с первоначального 21 элемента до 121 элемента в HTML5. Каждый раз, когда в HTML появляется новый элемент, мы точно знаем, как к нему отнесутся старые браузеры: они будут игнорировать теги и отображать содержимое.
Это удивительно мощная функция. Она позволяет браузерам внедрять новые возможности HTML с разной скоростью. Нам не нужно ждать, пока каждый браузер распознает новый элемент. Вместо этого мы можем начать использовать новый элемент в любое время, будучи уверенными, что не поддерживающие его браузеры не подавятся им.
<main>this text will display in any browser</main>
Если веб-браузеры относятся ко всем тегам одинаково – отображают их содержимое – тогда какой смысл в наличии словаря элементов в HTML?
Значение разметки
Некоторые элементы HTML буквально бессмысленны. Элемент SPAN ничего не говорит о содержимом внутри него. С точки зрения веб-браузера, вы можете использовать несуществующий элемент MARKLAR. Но это исключение. Большинство элементов HTML существуют не просто так. Они были созданы и согласованы для того, чтобы учитывать конкретные ситуации, с которыми могут столкнуться такие авторы, как вы и я.
Существуют специальные элементы, например, элемент A, которые наделены сверхспособностями. В случае с элементом A его суперспособность заключается в атрибуте HREF, который позволяет нам ссылаться на любой другой ресурс в Интернете. Другие элементы, такие как INPUT, SELECT, TEXTAREA и BUTTON, имеют свои собственные суперспособности, позволяя людям вводить данные и отправлять их на веб-сервер.
Кроме того, есть элементы, которые описывают содержание, которое они содержат. Содержимое элемента P следует рассматривать как абзац текста. Содержимое элемента LI следует рассматривать как элемент списка. Браузеры отображают содержимое этих элементов с некоторыми визуальными подсказками относительно их значения. Абзацы отображаются с пробелами до и после их содержимого. Элементы списка отображаются в виде точек или цифр перед их содержимым.
В начале развития лексикон HTML был наполнен новыми элементами, которые предоставляли визуальные инструкции веб-браузерам: BIG, SMALL, CENTER, FONT. На самом деле, визуальные инструкции были единственной причиной существования этих элементов – они не давали никакого намека на смысл содержимого, которое они содержали. HTML был в опасности превратиться в язык визуальных инструкций вместо словаря смысла.
Дело стиля
Хокон Виум Ли работал в ЦЕРНе в то же время, что и Тим Бернерс-Ли. Он сразу же распознал потенциал Всемирной паутины и ее языка HTML. Он также понимал, что выразительные возможности языка могут быть перегружены визуальными функциями. Ли предложил новый формат для описания представления HTML-документов: Каскадные таблицы стилей.
Вскоре к нему присоединился голландский программист Берт Бос. Вместе они приступили к созданию синтаксиса, который был бы достаточно мощным для удовлетворения потребностей дизайнеров, оставаясь достаточно простым, чтобы быстро учиться. Им это удалось.
Подумайте обо всех сайтах в Интернете. Существует огромное разнообразие визуального стиля: цветовые схемы, типографика, текстуры и макеты. Все это разнообразие стало возможным благодаря одному простому шаблону, который описывает весь когда-либо написанный CSS:
selector {
property: value;
}
Вот и все.
CSS разделяет снисходительное отношение HTML к ошибкам. Если браузер встречает непонятный ему селектор, он просто пропускает все, что находится между фигурными скобками этого селектора. Если браузер видит непонятное ему свойство или значение, он просто игнорирует это конкретное правило. Браузер не выдает ошибку. Браузер не выбрасывает ошибку. Браузер не прекращает разбор CSS на данном этапе, отказываясь идти дальше.
marklar {
marklar: marklar;
}
Как и в HTML, такая свободная обработка ошибок позволила CSS развиваться со временем. За эти годы в словарь языка были добавлены новые селекторы, новые свойства и новые значения. Когда в CSS появляется новая функция, дизайнеры и разработчики знают, что могут смело использовать ее, даже если она еще не получила широкой поддержки в браузерах. Они могут быть уверены, что старые браузеры отреагируют на новые возможности с полным безразличием.
Если язык элегантен и хорошо продуман, это еще не значит, что люди будут им пользоваться. CSS появился позже, чем HTML. Дизайнеры не тратили прошедшие годы на терпеливое ожидание способа стилизации своих документов в Интернете. Они использовали то, что было им доступно.
Убийственно
В 1996 году Дэвид Сигел опубликовал книгу под названием "Создание убийственных веб-сайтов". В ней он описал ряд гениальных приемов для создания привлекательного дизайна из
