Устойчивый веб-дизайн - Jeremy Keith
Версия сайта nasa.gov 2015 года с неполным JavaScript.
Это подчеркивает еще одно различие между HTML и JavaScript. В то время как HTML можно просматривать по частям по мере загрузки, файл JavaScript должен быть загружен полностью, прежде чем его содержимое будет разобрано. Хотя очень заманчиво думать, что лишь небольшое меньшинство посетителей сайта пропустит JavaScript, правда заключается в том, что все являются пользователями без JavaScript до тех пор, пока JavaScript не закончит загрузку… если JavaScript закончит загрузку. Нестабильные соединения, вмешательство операторов сети и непредсказуемое программное обеспечение, блокирующее рекламу, могут разрушить предположение о том, что JavaScript всегда будет доступен.
Проблема не в том, что люди намеренно отключают JavaScript в своих браузерах. Хотя такой вариант использования стоит рассмотреть, это не самая распространенная причина ошибок JavaScript. Стюарт Лэнгридж составил список всех потенциальных точек отказа под заголовком "У всех есть JavaScript, верно?
«Пользователь запрашивает ваше веб-приложение. Загрузилась ли страница? Успешен ли HTTP-запрос для JavaScript? Завершился ли HTTP-запрос для JavaScript? Блокирует ли корпоративный брандмауэр JavaScript? Не препятствует ли провайдер или оператор мобильной связи загрузке JavaScript? Отключили ли они JavaScript? Установлены ли у них дополнения или плагины, которые внедряют сценарий или изменяют DOM таким образом, как вы не ожидали? Работает ли сеть доставки контента? Поддерживает ли их браузер написанный вами JavaScript?»
Многие из этих проблем также могут повлиять на файлы HTML и CSS, но благодаря закону Постеля они могут изящно восстановиться.
Это не означает, что веб-дизайнеры не должны использовать JavaScript. Но это означает, что веб-дизайнеры не должны полагаться на JavaScript, когда существует более простое решение.
Платформа
Веб-дизайнеры, проигнорировавшие посыл книги Джона Оллсоппа "Дао веб-дизайна", совершили ошибку, отнесясь к вебу как к печатной продукции. История печати может многое предложить – иерархию, типографику, теорию цвета, но веб – это принципиально иной носитель информации. История разработки программного обеспечения также может многое предложить – архитектуру, тестирование, процесс, но, опять же, веб остается собственным носителем информации.
Заманчиво применить знания и уроки, полученные в другой среде, к вебу. Но структурно честнее раскрыть уникальные сильные и слабые стороны Интернета.
Язык, который мы используем, может тонко влиять на наше мышление. В своей книге "Метафоры, которыми мы живем" Джордж Лакофф подчеркивает опасность политического языка. Очевидными примерами являются "дружественный огонь" и "сопутствующий ущерб", но более коварным примером является "облегчение налогового бремени" – еще до начала дебатов налогообложение было представлено как нечто, требующее облегчения.
На первый взгляд, термин "веб-платформа" кажется безобидным. Описание веба как платформы ставит его в один ряд с другими программными средами. Flash был платформой. Android – это платформа. iOS – это платформа. Но веб – это не платформа. Вся идея веба в том, что он кроссплатформенный.
Платформа обеспечивает контролируемую среду выполнения для программного обеспечения. Пока у пользователя есть эта среда выполнения, вы можете быть уверены, что он получит именно то, что вы задумали. Если вы создаете приложение для iOS и у кого-то есть устройство iOS, вы знаете, что он получит 100% вашего программного обеспечения. Но если вы создадите приложение для iOS, а у кого-то будет устройство Android, он получит 0% вашего программного обеспечения. Вы не можете установить приложение iOS на устройство Android. Все или ничего.
Веб не так бинарен. Если вы создаете что-то с использованием веб-технологий, а кто-то заходит на сайт с помощью веб-браузера, вы не можете быть уверены, сколько веб-технологий будет поддерживаться. Скорее всего, это будет не 100%. Но также маловероятно, что это будет 0%. Некоторые люди будут посещать сайт с устройств iOS. Другие будут посещать сайт с устройств Android. Некоторые люди получат 80% или 90% того, что вы разработали. Другие получат только 20%, 30% или 50%. Интернет – это не платформа. Это континуум.
Думать о вебе как о платформе – это ошибка. Такие платформы, как Flash, iOS или Android, обеспечивают стабильность и определенность, но только при очень специфическом наборе обстоятельств – доступ к вашему программному обеспечению должен осуществляться с помощью соответствующей среды выполнения, специфичной для данной платформы. Интернет не дает такой уверенности, но он также не ограничивает возможные среды выполнения.
Платформы контролируемы и предсказуемы. Всемирная паутина хаотична и непредсказуема. В Интернете царит полный беспорядок.
Рекомендации
RFC 761: Transmission Control Protocol by Jon Postel
Program Links in WWW by Tim Berners‐Lee
The Internet’s Original Sin by Ethan Zuckerman
Ajax: A New Approach to Web Applications by Jesse James Garrett
Everyone has JavaScript, right? by Stuart Langridge
Глава 5: Слои
В своей классической книге
"Как здания учатся" Стюарт Брэнд освещает идею британского архитектора Фрэнка Даффи:
«Правильно задуманное здание имеет несколько слоев долговечности.»
Даффи называл эти срезающие слои. Каждый из них движется в разных временных масштабах. Бренд развил идею, предложив шесть аллитеративных слоев:
Место – физическое расположение здания меняется только в геологическом масштабе.
Структура – само здание может стоять веками.
Внешняя отделка – внешняя поверхность здания обновляется каждые несколько десятилетий.
Обслуживание – водопровод и электропроводка нуждаются в обновлении каждые десять лет или около того.
План помещения – расположение стен и дверей может периодически меняться.
Вещи – расположение мебели в комнате может меняться ежедневно.
Разделение слоев.
Идею срезания слоев можно применить и к нашим творениям в Интернете. Наши доменные имена – это геологические объекты, на которых мы строим. На другом конце временной шкалы контент в Интернете – "материал" – может добавляться и обновляться ежечасно, ежеминутно или даже посекундно. Между ними находятся слои структуры, представления и поведения: HTML, CSS и JavaScript.
Эти слои могут быть слабо связаны друг с другом, но они не являются полностью независимыми. Как в здании не может быть мебели без комнат и стен, так и таблица стилей нуждается в разметке, чтобы действовать на ее основе. Связь между структурой и представлением осуществляется с помощью селекторов