Текст книги "Веб-дизайн"
Автор книги: Дмитрий Кирсанов
Жанр:
Интернет
сообщить о нарушении
Текущая страница: 4 (всего у книги 29 страниц) [доступный отрывок для чтения: 11 страниц]
Как мы только что видели, модульный подход позволяет достичь в HTML определенной ортогональности структуры и представления. Конечно, гораздо удобнее было бы хранить повторяющиеся блоки визуального кода в отдельном, общем для всего сайта «стилевике», а документы размечать только ссылками на тот или иной блок – то есть, по сути, тегами логической разметки, говорящими лишь о том, что стоит в данном месте документа, а не о том, как оно выглядит.
Именно такое естественное, а не насильственно насаждаемое разделение аспектов содержания и представления предлагает язык XML (extensible Markup Language, «Расширяемый язык разметки») – компактное упрощенное подмножество языка SGML, разработанное Консорциумом W3 в расчете на постепенное вытеснение из Интернета языка HTML. Этот «HTML будущего», как его нередко называют, уже активно осваивается ведущими производителями программ, причем не только броузеров – вероятно, поддержка XML через какое–то время появится в большинстве текстовых процессоров, баз данных, систем подготовки документации, а некоторые предрекают встраивание этого языка даже на уровне операционных систем.
Итак, язык XML впервые открывает перед многомиллионной интернетовской аудиторией дверь в мир настоящей структурной разметки и подлинной ортогональности аспектов содержания и представления. В конечном итоге эта новая технология должна резко увеличить производительность труда авторов, сняв необходимость утомительного, зачастую ручного перевода информации из одного визуально–ориентированного формата в другой. Однако не обойтись на этом пути и без трудностей «перепривыкания» и ломки сложившихся стереотипов. Перейти с HTML на XML – это совсем не то же самое, что обновить версию вашего любимого текстового процессора Может показаться, что идеология ортогональности языка SGML, прекрасно работающая для устоявшихся типов документов с годами отлаживавшимися DTD, не справляется со слишком разнообразным и зачастую нелогичным содержимым современного Интернета. Вспомним, однако, что только противоречие может быть двигателем прогресса, – нам предстоит еще увидеть, как развиваются, взаимообогащаясь и изменяясь под действием друг друга, Интернет и XML…
Внешне XML-документ очень похож на HTML: те же угловые скобки, открывающие и закрывающие теги, атрибуты и подстановки. Но если в HTML все допустимые теги жестко заданы стандартом, то XML-документ может пользоваться любыми тегами, пусть даже изобретаемыми на ходу автором документа. Это объясняется разным статусом этих языков: если HTML есть одно из приложений SGML, его отпрыск и порождение, то XML – это подмножество SGML, его «младший брат», обладающий лишь чуть меньшими возможностями и точно так же пригодный для создания фиксированных систем разметки документов. Такие системы на основе XML действительно создаются в последнее время во множестве – от сложного языка Math ML для разметки математических текстов до простеньких наборов из пары десятков тегов для хранения кулинарных рецептов или текстов церковных проповедей.
DTD. Вся специфика HTML как одного из приложений SGML выражена в особой формальной конструкции, называемой определением типа документа (Document Type Definition, DTD). В идеале DTD – высший авторитет во всем, что касается синтаксиса той или иной версии HTML. Им, к примеру, пользуются HTML-валидаторы – интерпретаторы SGML, проверяющие соответствие HTML-документа некоторому DTD. Поскольку DTD для каждой версии HTML зафиксировано в официальной спецификации языка, в самом документе приводить его не нужно, – однако любой HTML-документ обязан ссылаться на свое DTD с помощью тега! DOCTYPE (стр. 29).
Хотя синтаксис DTD мы в этой книге рассматривать не будем, полезно знать, какая именно информация может храниться в определении типа документа:
• полный список допустимых элементов с указанием на обязательность для каждого из них открывающего и закрывающего тегов;
• полный список атрибутов для каждого элемента, с информацией об их обязательности/факультативности и значениями по умолчанию;
• иерархическая структура документа в виде ин 4 юрмации о том, какие другие элементы, в каком порядке и в каких сочетаниях (друг с другом и/или с обычным текстом) могут встречаться внутри каждого из элементов.
Например, в DTD для HTML 4.0 указано, что у элемента HTML можно опускать как открывающий, так и закрывающий теги (границы элемента устанавливаются интерпретатором по контексту), а его содержимое должно состоять из элементов HEAD и BODY, идущих именно в таком порядке. Элемент OL (нумерованный список) обязан иметь как открывающий, так и закрывающий теги, а содержимое его должно состоять из одного или нескольких следующих друг за другом элементов LI. DTD в языке XML на этом уровне рассмотрения имеет только одно существенное отличие от DTD в SGML (и HTML): все элементы XML–до–кумента без исключения обязаны иметь и открывающий, и закрывающий тег.
Важно понимать, что ни в SGML, ни в XML DTD не имеет никаких средств для задания семантики тегов, – иными словами, DTD не дает ответа на вопрос, что означает каждый тег. В каком–то смысле идеология SGML следует Людвигу Витгенштейну, которому принадлежит высказывание: «The meaning of a word is its use» («Значение слова – это то, как оно употребляется»). Тот факт, к примеру, что тег I включает курсивное начертание, формально средствами SGML не выразим, – он лишь подразумевается авторами языка HTML и указывается в комментариях или в сопроводительной документации к HTML DTD. Именно поэтому путь, избранный в HTML, – жесткое закрепление за каждым из тегов (набор которых ограничен) некоторой «рекомендуемой» роли и параметров форматирования – несмотря на свою простоту, плохо Укладывается в рамки идеологии SGML и влечет за собой неприятные последствия. Если семантику тега невозможно определить формально, то нет ничего удивительного в том, что эффект даже простейших тегов иногда сильно различается у разных броузеров. Абстрактный вопрос «что делает такой–то тег», по сути лишён смысла – можно только выяснять, какой результат даёт применение этого тега в том или ином броузере.
Уровни соответствия. Если в SGML каждый документ обязан иметь свое DTD, а у HTML есть одно DTD на всех, то XML представляет собой компромисс: документ может иметь (или ссылаться на) DTD, а может и обходиться без DTD. В последнем случае каждый новый тег и атрибут определяются самим фактом своего употребления. Таким образом, для XML – документов существует два уровня соответствия стандарту: документы, не имеющие DTD, но удовлетворяющие всем другим требованиям синтаксиса XML, называют правильно структурированными (well–formed), чтобы отличить их от документов валидных (valid), имеющих в своем составе DTD (или ссылку на внешнее DTD).
Правильно структурированные документы, хотя и уступают по «правильности» документам валидным, годятся для большинства практических случаев. Это значит, что вы можете сразу же начать описывать структуру вашего документа на «почти человеческом» языке, выдумывая теги на ходу и заботясь лишь об их правильной вложенности:
<ПРЕДЛОЖЕНИЕ>
<ПОДЛЕЖАЩЕЕ>
<СУЩЕСТВИТЕЛЬНОЕ> мама
<СКАЗУЕМОЕ тип=«простое»>
<ГЛАГОЛ> мыла
<ДОПОЛНЕНИЕ тип=«прямое»>
<СУЩЕСТВИТЕЛЬНОЕ> раму
Как видно из этого примера, имена тегов и атрибутов можно писать и по–русски. Опыт HTML показал, сколь важна тщательная и своевременная интернационализация всех аспектов языка, претендующего на какую–то роль в Интернете. Поэтому создатели XML позаботились, в частности, о том, чтобы в именах тегов и атрибутов можно было пользоваться не только латинскими буквами, но и кириллицей, иероглифами и вообще любыми символами из репертуара Unicode, которые считаются «буквами» хотя бы в одном языке или системе письменности.
Такая разметка позволит интерпретатору XML порубить документ на кусочки в соответствии с его теговой структурой. После этого в действие вступает другое приложение – его задачей может быть, например, автоматическое индексирование документа, занесение его в базу данных или (чаще всего) форматирование в соответствии с приложенной к документу стилевой спецификацией. (В нашем примере можно было бы, скажем, раскрасить разные части речи разными цветами.) Однако важно понимать, что все эти задачи лежат уже за пределами собственно языка XML, – который, таким образом, свободен от заботы о визуальном (или каком–либо ином) представлении документа и позволяет сфокусироваться на его логической структуре.
Конверсия. Возможность использовать произвольные теги означает, в частности, что любой HTML-документ очень легко преобразовать в XML. Изменения, требуемые для этого преобразования, немногочисленны и сугубо формальны:
• все значения атрибутов должны быть взяты в кавычки;
• регистр букв в открывающих и закрывающих тегах должен совпадать (в отличие от HTML, язык XML чувствителен к регистру);
• все элементы должны иметь открывающий и закрывающий тег. Это относится не только к элементам с факультативными тегами (такими как упоминавшийся выше элемент HTML), но и к пустым элементам, которые в HTML имеют только открывающий тег. Например, тег IMG придется записывать так:
XML также допускает особую сокращенную запись для пустых элементов:
Существуют утилиты, переводящие HTML в XML «тег в тег» с соблюдением всех перечисленных выше правил. Толку от такой конверсии, правда, немного: хотя результат ее будет «правильно структурированным» документом с точки зрения интерпретатора XML, его разметка не станет ни на йоту более структурной. Только заменяя на соответствующие логические теги унифицированные HTML-блоки (стр. 45), имеющие наряду с форматирующей еще и определенную структурную функцию, можно получить на выходе осмысленный XML-код, обнажающий содержательную основу Документа и способный работать с любой подключенной стилевой спецификацией.
Создатели XML прекрасно понимали, что простота и изящество логического подхода к разметке имеют оборотную сторону – язык, не предоставляющий достаточно мощных и притом стандартизированных средств определения семантики тегов, вряд ли сможет составить серьезную конкуренцию HTML. Поэтому с момента появления черновой спецификации XML в ноябре 1996 года разработчики заняты в основном выбором и стандартизацией расширений языка – надстроек над XML, которые позволили бы формально описывать различные семантические аспекты тегов.
В отличие от HTML, многочисленные «расширения» которого больше похожи на заплаты на расползающейся ткани, модульная структура XML является одним из важнейших преимуществ этого языка. Авторы XML прилагают все усилия к тому, чтобы логический базис и семантические надстройки удобно стыковались, не теряя при этом как формальной, так и содержательной независимости друг от друга.
XLL. Почти одновременно с самим XML Консорциумом W3 был стандартизован XLL (extensible Linking Language, «Расширяемый язык ссылок») – механизм создания гипертекстовых ссылок в XML-документах. Этот аспект языка значительно усовершенствован в сравнении с HTML. Вот основные черты гипертекстовой модели XML:
• XML-ссылки реализованы не на уровне тегов (как в случае тега А языка HTML), а с помощью зарезервированных имен атрибутов. Это позволяет с легкостью превратить в гипертекстовую ссылку любой элемент документа, просто расширив его список атрибутов.
• Для XML-ссылки можно указать, будет ли она обычной ссылкой, активизируемой пользователем (щелчком мышью, к примеру), или же броузер, встретив в документе эту ссылку, должен активизировать ее сам, не дожидаясь команды пользователя.
• Для ссылки можно указывать результат ее активации, а именно: вывести ли документ, на который она ссылается, вместо текущего (например, в том же окне броузера), создать ли для него новый контекст вывода (например, новое окно), или же содержимое нового документа нужно вставить внутрь текущего документа.
• Важные усовершенствования внесены в синтаксис URL-адресов, использующихся в ссылках. Выше я уже упоминал, что адреса могут содержать параметры вызова программы или идентификатор фрагмента документа, отделяемые от основной части адреса соответственно символами? и # (стр. 30). XML расширяет синтаксис этих конструкций, благодаря чему, не теряя обратной совместимости с существующими адресами, они позволяют адресовать практически любой фрагмент любого XML– или HTML-файла. При этом не требуется, чтобы автор файла, на который ссылаются, как–то по–особому разметил этот фрагмент (в HTML, как вы знаете, его нужно пометить тегом А с атрибутом name). Более того, вырезание этого фрагмента из документа можно переложить на сервер, на котором документ хранится, тем самым избежав пересылки по сети документа целиком (правда, для этого нужно, чтобы сервер умел обрабатывать такие «расширенные» запросы).
XSL. Как я уже упоминал, ничто не мешает использовать с XML-документами стилевые спецификации на языке CSS (стр. 40), и для не особенно требовательных к дизайну документов эта комбинация технологий, по–видимому, будет оптимальной. С другой стороны, оформить заголовки, блоки текста и навигационные элементы хотя бы приблизительно так же, как они оформлены на веб–странице на рис. «I, с помощью CSS невозможно. Поэтому в качестве одной из стандартных надстроек над XML Консорциум W3 разработал стилевой язык XSL (extensible Stylesheet Language, «Расширяемый язык стилевых спецификаций»).
Один из прототипов XSL – созданный уже довольно давно для использования совместно с SGML язык DSSSL (Document Style Semantics and Specification Language, «Язык стилистических и семантических спецификаций документов»). Как и DSSSL, XSL предполагает два последовательных этапа при обработке документа. На первом этапе иерархическое дерево элементов исходного документа преобразуется в другое дерево, которое, в принципе, может не иметь с исходным почти ничего общего: содержимое может быть переупорядочено, по–иному разбито на элементы, в нем может отсутствовать часть исходного материала (фильтрация) и добавлен новый (генерируемое содержимое, стр.44). Теги, которыми размечен этот преобразованный документ, могут опять–таки быть любыми (стилевая спецификация документа описывает правила их порождения в зависимости от содержимого оригинала), но общий принцип состоит в том, что эти новые теги уже не должны соотноситься со структурной основой документа, а могут содержать только параметры форматирования тех его частей, которые подлежат выводу.
На втором этапе в дело вступает собственно форматировщик, интерпретирующий теги преобразованного на первом этапе документа и выводящий его на экран, на печать или любое другое устройство вывода. Среди прочего стандарт XSL описывает базовый набор тегов визуального форматирования, к которым рекомендуется приводить XML-документы на первом этапе обработки и которые обязан понимать форматировщик любого XSL-процессора. По предоставляемым возможностям эта «визуальная» часть XSL превосходит CSS2, однако пока она еще не закончена и, очевидно, в дальнейшем будет еще расширяться и пересматриваться.
Если же учесть тот факт, что «словарь» визуального форматирования XSL должен еще пройти долгий и болезненный процесс реализации и отладки в броузерах, на данный момент более реалистичным кажется другой подход к использованию XSL. Чуть выше я говорил, что на первом этапе обработки XML-документ может быть приведен к любому формату, использующему любые теги, с единственным требованием – чтобы формат этот не нарушал синтаксис XML (правильная вложенность тегов, кавычки вокруг значений атрибутов и т. п.). Следовательно, ничто не мешает вам написать стилевую спецификацию, разворачивающую теги логической разметки в форматирующие блоки модульного HTML (стр. 45). Полученный в результате HTML-код останется лишь скормить привычному, давно отлаженному во всех существующих броузерах (и, очевидно, отнюдь не собирающемуся отправляться на свалку истории) механизму форматирования HTML, который и займется окончательным выводом документа на экран.
Этот сценарий предлагает путь относительно безболезненной миграции на XML для огромной массы сайтов, использующих сейчас типично «визуальный» HTML. Для этого, однако, их HTML-разметка должна как можно точнее соблюдать заповеди модульного HTML (стр. 45). Например, приведенный на стр.46 блок внутритекстового заголовка глобальным поиском легко заменить на логический XML-элемент:
Теперь достаточно написать стилевую спецификацию на XSL, которая преобразовывала бы каждую копию элемента FRAMED-HEADING в соответствующий HTML-блок и вставляла бы в нужное место внутри этого блока содержимое обрабатываемого элемента – т. е. текст заголовка, попутно переводя его в верхний регистр (несомненно, регистр текста принадлежит в данном случае к аспекту представления, а не содержания, так что из XML-документа эту подробность лучше убрать).
На момент написания этой книги конверсия модульного HTML в XML + XSL реализуема только в броузере MS1E 4.0 с помощью разработанного фирмой Microsoft ActiveX-компонента (стр. 70), транслирующего XML в HTML и передающего полученный HTML-код стандартному механизму форматирования броузера.
Графика
Технологии компьютерной графики опираются на нисколько не менее абстрактные концепции и потому ничуть не проще для освоения, чем только что рассмотренные технологии текстовой разметки. Даже профессионалам в этой области полезно иногда отступить на шаг назад, чтобы окинуть обобщающим взглядом пеструю мешанину форматов, программ и стандартов.
Если верно, что компьютер – инструмент для реализации абстракций, то для успешной работы с ним человек должен сам легко овладевать абстракциями и уметь приводить к ним явления реального мира. С таким целостным и гармоничным (в смысле пушкинской «гармонии», которую нельзя «поверить алгеброй») явлением, как графика, это может показаться еще более трудным, чем со всегда несколько суховатым и склонным к формализму (будь то формализм грамматики или же формализм компьютерного языка разметки) текстом. Однако и награда за соединение несоединимого велика: если текст в компьютере всегда останется текстом, то в работе с изображениями компьютер даст вам такую творческую свободу и откроет перед вами такие возможности, которые в докомпьютерную эпоху трудно было даже вообразить.
Все компьютерные изображения, все форматы для их хранения и все программы для их обработки делятся на два больших класса – векторные и растровые, – различающиеся прежде всего уровнем абстракции, примененной к изображению. Можно сказать, что если векторная графика пытается имитировать восприятие изображений человеком, то растровый формат хранит графику в том виде, в каком она легче всего переваривается компьютером. Соответственно, векторная графика в большинстве своем создается человеком с нуля прямо в векторном редакторе, а попытки генерировать ее автоматически (алгоритмы трассировки, стр.100) редко когда приводят к удовлетворительному результату. И наоборот, основной поставщик растровых изображений – фотографии, т. е. в существенной своей части автоматический процесс с легко оцифровываемыми результатами.
Векторное изображение состоит из объектов – геометрических форм, составленных из прямых, дуг окружности и кривых Безье (стр. 99). Во всех векторных форматах объекты могут варьировать толщину и цвет контура, а замкнутые объекты – еще и цвет заливки. Объекты могут накладываться, частично или полностью заслоняя друг друга. В качестве отдельных объектов могут включаться растровые изображения и строки или абзацы текста (буквы которых могут также храниться в виде геометрических форм, но допускают и более высокий уровень абстракции – разделение на собственно текст, который можно редактировать, и параметры его оформления). Именно такой базовый набор возможностей предусмотрен в языке PostScript – одном из первых векторных форматов, появившемся в 1986 г. и до сих пор остающемся lingua franca для векторных изображений.
Фирма Adobe, которой принадлежит язык PostScript, разработала также первый векторный графический редактор Adobe Illustrator, для которого PostScript был стандартным форматом файлов. Однако долгие годы сохранявшееся монопольное положение этого формата сыграло с ним злую шутку: тот факт, что он стал стандартным входным форматом появившихся к тому времени лазерных принтеров и фотонаборных автоматов, практически затормозил его развитие, так как зашитое в принтер программное обеспечение, в отличие от программы, установленной на компьютере, не так–то просто обновить. В результате уже к началу 90‑х PostScript стал узким местом и Adobe Illustrator, и векторных редакторов других фирм, – которые могли бы реализовать, к примеру, частичную прозрачность объектов, но не решались сделать это из боязни потерять совместимость с PostScript.
В последнее время, однако, избавившись от гипноза PostScript'a, векторные форматы развиваются очень бурно – являясь по самой своей природе «сборниками абстракций», они легко заимствуют подходящие идеи из соседних областей. Некоторые из этих форматов двигаются в направлении поддержки сложных многостраничных документов с элементами логической разметки, а программы для работы с ними все больше походят на системы верстки. Другие вводят элементы анимации, мультимедиа и интерактивности. Все это сопровождается развитием собственно векторной основы графики, изобретением все новых свойств объектов и трансформаций для работы с ними. Конечно, векторные эффекты еще не столь многочисленны, как растровые (стр. 295), но они позволяют иногда добиться в векторной графике, при сохранении всех присущих ей достоинств, таких вещей, которые до недавнего времени казались прерогативой только и исключительно растра.
А достоинств у векторной графики действительно немало. С точки зрения дизайнера главное и решающее ее преимущество – всегда сохраняющаяся независимость объектов и невозможность совершить необратимые действия. Векторную картинку можно править и изменять бесконечно, не боясь «протереть дырку» или ненароком потерять часть исходной информации. По моему мнению, это свойство векторной графики настолько важно, что композиции, имеющие хоть какое–то отношение к дизайну, имеет смысл делать только в векторном редакторе, – хотя это может быть и неверным для компьютерного аналога, скажем, живописи. (И в самом деле, наиболее отчетливо преимущества векторных редакторов над растровыми проявляются при работе над композициями, содержащими текст и именно по этому признаку относимыми к жанру дизайна, а не к графике как таковой.)
Вектор в Интернете. Есть у вектора и важные практические преимущества: небольшой объем файлов (в сравнении с сопоставимыми растровыми изображениями) и независимость от разрешения устройства вывода. Эти два фактора сделали векторную графику вероятным кандидатом на роль одной из ключевых технологий Интернета. Если до сих пор векторные изображения встречаются на веб–страницах довольно редко, то объяснить это можно лишь обилием конкурирующих технологий и нежеланием их владельцев открывать доступ к техническим спецификациям своих форматов, – что является одним из обязательных условий их стандартизации Консорциумом W3.
Тем не менне среди реально применяемых в Интернете векторных форматов уже есть свои лидеры. У дизайнеров популярен формат Shockwave Flash фирмы Macromedia, замечательный своими богатыми интерактивными и анимационными возможностями (один из предков Flash – профессиональный пакет компьютерной анимации Macromedia Director). Приспособленный специально для Интернета, формат этот поддерживает гипертекстовые ссылки, а в дополнение к своей врожденной векторной нетребовательности пользуется сжатием информации на манер утилит – архиваторов. Для просмотра этого формата в броузере нужен подключаемый модуль (plug–in), бесплатно распространяемый фирмой Macromedia. Для отдельных анимированных вставок использовать Flash вряд ли целесообразно, однако существуют сайты, целиком построенные на этой технологии (например,www.olympic.org).
Для статических текстовых документов популярен формат PDF (Portable Document Format, «переносимый формат документов») фирмы Adobe, разработанный на основе PostScript со сжатием данных обязательным инкапсулированием растровой графики и шрифтов и с возможностью использования гипертекстовых ссылок и интерактивных форм. Хотя графические возможности PDF ничуть не богаче, чем у PostScript, формат этот удобен для выкладывания в Интернете рекламных брошюр, проспектов, журнальных статей и прочих материалов, либо существовавших ранее в виде бумажных копий, либо предназначенных для распечатывания пользователем. Особенно удобно то, что формат PDF не привязан к какой–то графической программе и системе верстки: печатать на PostScript–принтерах и, следовательно, давать на выходе PostScript умеют все программы без исключения, а конвертация из PostScript в PDF – процедура полностью автоматическая. Программа для чтения этого формата под названием Acrobat Reader распространяется бесплатно и существует как в виде подключаемого модуля для броузера, так и в виде самостоятельного приложения.
Консорциум W3 готовит стандарт «языка векторной разметки» VML (Vector Markup Language), использующего синтаксис XML и семантику CSS2 для описания векторных объектов. Относительная примитивность этого языка искупается тем, что для реализации его в современных броузерах не потребует много усилий, так как VML максимально использует набор свойств элементов разметки и механизм абсолютного позиционирования CSS2 (стр.241). Поэтому вполне можно надеяться на то, что язык этот сможет найти свою нишу в современном Интернете.
3D Особую разновидность векторной графики представляют трехмерные форматы, из которых самый известный и чаще всего встречающийся в Интернете – язык VRML (Virtual Reality Modeling Language). Описываемые трехмерным форматом сцены состоят, как и векторные изображения, из математически описанных объектов, – с той только разницей, что все их точки имеют по три пространственных координаты (а в форматах с поддержкой анимации – еще и четвертую, временную координату). Кроме обычных объектов, сцены могут содержать разноцветные и произвольно размещаемые источники освещения, а программа – интерпретатор покажет вам сцену с любой точки и даже позволит зайти внутрь и «побродить» между объектами. Интерактивная трехмерная графика как метод представления информации грозилась одно время занять место в арсенале приемов профессионального веб–дизайна, однако ничего подобного так и не произошло – трехмерность остается любимой игрушкой непрофессионалов, но для создания в жанре вещей, интересных с художественной точки зрения, время, по–видимому, ещё не пришло (стр. 290).
