К учебнику по созданию Web-страниц

Введение Говорить о популярности Интернета в наши дни, по меньшей мере, странно. Интернет стал не просто частью нашей жизни, но и частью настолько привычной и обыденной, что мы перестали удивляться и восхищаться предоставляемыми им услугами. На самом деле, даже десятилетний ребенок может заметить, насколько веб-технологии проникли во все сферы культурной жизни человека: образование, коммерция, политика, развлечения. Мы пользуемся Интернетом либо в личных целях, либо в профессиональных, либо и в тех и в других. Интернет может объединять и членов клубов по интересам, и детей с родителями. И все они только выиграют от того, что будут знать хоть что-то о Сети. Умение опубликовать документ в Интернете в один прекрасный день может стать чем-то вроде умения печатать на пишущей машинке, и практически любой человек со средним образованием должен будет твердо владеть, по крайней мере, начальными навыкам. Сейчас это является важным пунктом любого Curicculum Vitae (резюме), а также ключевым моментом при выполнении различных задач — как оплачиваемых, так и личных. Если вы морально готовы к тому, чтобы научиться строить собственные сайты, то пришло время начать читать эту книгу и вникать в ее содержимое. Для кого предназначена эта книга Изучение технологий публикации в Сети можно разделить на две стадии. Более того, на два подхода: одним из них является фокусирование внимания на написании кода, другим — изучение технологии публикации с помощью графических редакторов. Наша книга является пособием, придерживающимся первого из этих подходов, она помогает понять суть стандартов HTML и XHTML для написания с помощью этих языков веб-страниц, построения сайтов, совмещения их в более сложные структуры, такие как таблицы стилей, скрипты. Пусть вас не пугают эти термины, по прочтении этой книги вы узнаете, что означают эти умные слова, научитесь работать со средствами веб-публикации, даже если до сих пор вы никогда не сталкивались с ними. Позвольте, однако же, заметить, что эта книга не для всех. Я предполагаю, что вы уже знаете, где у компьютера расположена кнопка Power, а также умеете работать в Windows, Macintosh OS или Unix .Я не буду описывать, как создать файл, папку, что такое расширение файла и т п Из этой книги вы будете узнавать исключительно о том, что касается Сети. Вам придется раздел за разделом следовать за изложением, наращивая свою страницу, придется вникать в графические и муль тимедийные технологии. Понадобятся и минимальные навыки программирования, без этого невозможно создать действительно интересный сайт. Если вы хотите научиться создавать сайты в Интернете для своей фирмы, организации или образовательного учреждения, то совершенно правильно выбрали именно эту книгу. Здесь описаны все необходимые принципы, приведены определения терминов, объяснены основы веб-программирования и дизайна. Хочу быть честным относительно испельзуемого подхода. Если ваша цель — «крутой сайт за один день», то эта книга не для вас. Далее, если вы хотите начать свой марш-бросок в веб-технологии при помощи какого-то конкретного специализированного графического редактора, как, например, Macromedia Dreamweaver, я порекомендовал бы вам купить книгу, описывающую именно этот пакет. Я надеюсь, что используемый здесь подход является оптимальным: несмотря ни на что, до сих пор очень важно уметь программировать «ручками», знать, понимать и любить код, генерируемый редакторами. Без знания основ невозможно ничему научиться. Хотя графические редакторы порой удобны (и они, на самом деле, даже описаны в главе 20, «Графические редакторы»), я считаю, что если человек хочет понять, как устроены веб-сайты, хочет сам научиться их создавать, то программирование на уровне кодов должно стать его родной стихией К счастью, изучение XHTML, таблиц стилей, JavaScript и даже Dynamic HTML, на мой взгляд, может обойтись без этих сложностей, — в конце концов, надо же хоть где-то применять веб-редакторы без зазрения совести! Как организована книга Изложение материала в книге построено от простого к сложному, то есть от вступления и обзора концепций веб-публикации разговор переходит к основам технологии создания собственных страниц и далее к более сложным темам. Часть I: Создание веб-страниц. Здесь вы встретите определения основных терминов (Интернет, Web, HTML, XHTML, таблица стилей, JavaScript и т д), описание различных концепций веб-публикации. Глава 2, «Краткий курс веб-дизайна» — это своего рода букварь веб-дизайна, а глава 3, «Что необходимо для начала работы», представляет собой обзор инструментальных средств, которые нужно установить и освоить, прежде чем приступать к разработке веб-сайтов. Среди них текстовые редакторы и приложения для управления графикой. В главе 4, «Создаем первую веб-страничку», вы найдете пример страницы и шаблон для написания будущих страниц. Часть II: Дизайн, ведущий к успеху. Во второй части книги вы узнаете о том, как использовать XHTML для создания веб-страниц. Мы начнем с обычного форматирования текста и разбивания его на параграфы, научимся создавать заголовки различного уровня, текстовые стили и специальные типы блоков, например маркированные и нумерованные списки. В главе 6, «Визуальная привлекательность: графика на веб-страницах», вы узнаете о том, как вставлять в страничку графику, какие форматы при этом можно использовать. В главе 7, «Создание гипертекстовых ссылок», — все о создании гиперссылок — ключевой технологии и идеи веб-сайтов, в том числе ссылок, указывающих на другой сайт или его страницы или указывающих на какую-либо часть текущего документа. Глава 8, «Основы построения таблиц», посвящена, как ни странно, XHTML-таблицам в тексте, которые могут быть использованы, как показано в главе 9, для форматирования целых страниц В главе 10, «Добавьте оригинальности: таблицы стилей, шрифты и специальные символы», рассказывается о таблицах стилей — современном пути настройки внешнего вида текста, изменяемых отступах и других средствах контроля и управления веб-страницами Глава 11, «Дополнительные свойства изображений и карты ссылок» заканчивает вторую часть книги более подробным рассмотрением изображений в Web, дает представление о том, как оптимизировать их использование на своих страницах. Часть III: Построение собственного сайта. В третьей части книги мы обратимся к некоторым технологиям веб-публикации, которые можно применить сразу ко всему сайту, то есть к собранию работающих вместе веб-страниц. Глава 12, «Создание сайтов при помощи фреймов», рассказывает о том, как разделить браузер на несколько частей с помощью XHTML-фреймов так, что в каждой части может отображаться своя страница.Фреймы очень удобны для быстрого создания «интерфейса» просмотра нескольких страниц одновременно. В главе 13 обсуждается мультимедийное содержимое, которое может быть включено в состав веб-страниц: звук, видео, анимация. В той же главе обсуждается вопрос подключения небольших приложений с помощью Java-технологии. Глава 14, «Стили сайтов: разработка, доступность и глобализация», заканчивает эту часть обзором различных настроек таблиц стилей, с помощью которых можно выбирать и изменять внешний вид документов, составляющих сайт. Часть IV: Взаимодействие с пользователями. Из этого раздела вы узнаете о некоторых технологиях, позволяющих собирать данные, вводимые пользователем, и каким-то образом реагировать на них. В главе 15 рассказывается о применении форм HTML для добавления разного рода флажков, переключателей, меню и других элементов управления. Глава 16, «CGI и сбор данных», посвящена CGI-пpoграммированию, которое часто используется в связке с XHTML-формами для обработки введенных пользователем данных. Главы 17 и 18 обращают внимание читателя на JavaScript — популярный язык написания скриптов, который можно использовать для автоматизации различных действий на веб-странице. Наконец, глава 19, «Dynamic HTML», посвящена темам, касающимся так называемого «динамического HTML» (или DHTML), — это расширение языка HTML объединяет технологии JavaScript и таблиц стилей, заставляя внешний вид веб-страниц изменяться в соответствии с данными, полученными от пользователя. Часть V: Инструментарий для публикации в Сети. Последняя часть книги описывает различное программное обеспечение и службы, позволяющие расширить свои возможности и знания в области веб-публикации. Глава 20, «Графические редакторы», рассказывает о популярных редакторах, автоматизирующих процесс создания веб-страниц, — Macromedia Dreamweaver и Microsoft Frontpage. В главе 21, «Форумы, чаты и другие дополнительные возможности», рассказывается о том, какие элементы можно прикрутить к своему веб-серверу: описываются скрипты для добавления счетчиков посещения, создания интерактивных форумов и чатов. Глава 22, «Услуги веб-публикации», посвящена описанию различных серверных решений, включая бесплатные веб-серверы и решения для электронной коммерции. Кроме этого, в конце книги можно найти приложение со справочной информацией, касающейся элементов XHTML и таблиц стилей CSS. Соглашения, принятые в этой книге По мере чтения вы заметите, что некоторые элементы отличаются от обычного текста и содержат дополнительную информацию. ПРИМЕЧАНИЕ Примечания включаются в текст для того, чтобы дать вам дополнительную важную или просто интересную информацию на конкретную тему. СОВЕТ Совет — это обычно некое указание, которое немного выпадает из темы обсуждения Если вы находите, что совет полезный, используйте его в своей практике создания веб-страниц; в противном случае можно его проигнорировать. В тексте есть некоторые типографские соглашения. Определения и термины выделяются курсивом. То, что вы должны нажать или напечатать, выделяется моноши ринным шрифтом. Листинги, занимающие более одной строки, отделяются от основного текста и пишутся таким шрифтом. Тем же шрифтом выделяются отдельные команды, встречающиеся в тексте. Дополнительная информация Чтобы задать вопрос, сообщить об ошибке, получить дополнительную информацию, посетите сайт автора: http://mac-upgradecom/abgcwp/. Вы найдете там авторские обновления, ответы на вопросы (если таковые возникнут), ссылки на мой адрес e-mail и сетевые форумы. Спасибо за то, что вы выбрали эту книгу, я желаю вам извлечь из нее максимум полезной для вас информации и научиться создавать качественные веб-проекты.

Глава 1. Основы технологии публикации в Сети

• Двухминутное сообщение на тему «История Интернета»

• Как работает Всемирная паутина

  • Что такое HTTP

  • Что такое HTML

  • Гипертекст и гиперссылки

  • Унифицированные указатели информационных ресурсов (URL)

  • Протоколы, используемые в URL

• HTML против XHTML

  • Кто устанавливает стандарты HTML

  • Для чего нужны новые стандарты

  • Чем пользоваться

• HTML — это не программирование

  • Основная разметка

  • Оформление с помощью таблиц стилей

  • Добавление скриптов

• Резюме

Всемирная сеть Интернет вошла в нашу жизнь настолько быстро, что мы не успели еще до конца осознать это событие и оценить открывшиеся возможности полностью. Вместе с электронной почтой и другими технологиями Всемирная паутина стала огромной частью феномена Сети. Но, как говорит нам наука археология — все семь чудес света — творения рук человеческих, и веб-страницы тоже не богами пишутся. Иметь представление о том, как создаются веб-страницы, необходимо сейчас каждому, кто хочет быть на передовых рубежах производства, науки, торговли маркетинга и т. д. Если вы хотя бы раз думали о создании веб-страницы, сайта или если вы когда-нибудь задумывались над тем, как же все это работает, значит, вы уже подошли вплотную к ознакомлению с этой книгой. В первой главе мы рассмотрим следующие темы:

• краткую историю Интернета и Всемирной паутины World Wide Web;

• основные принципы работы Сети, включая протоколы и акронимы, встречающиеся в данной книге;

• настоящее и будущее HTML и XHTML;

• простоту программирования на HTML и не меньшую простоту его изучения;

• несмотря на то что написание программ на HTML программированием, строго говоря, не является, но при публикации в Сети вам придется столкнуться с различными проблемами, которые мы также рассмотрим в данной главе и в данной книге.

Двухминутное сообщение на тему «История Интернета»

Прародительницей Интернета можно считать сеть ARPANet — вычислительную сеть, основанную американской правительственной организацией Advanced Research Projects Agency (Агентство передовых исследований) в конце 60-х годов Сеть могла работать во время военных действий и стихийных бедствий. Самым необычным в ARPANet было то, что сеть была децентрализованной, пакеты данных гуляли по ней, сами находя путь от одного узла к другому. Это означало, что от отправителя к получателю пакет мог проходить различными путями, что, без сомнения, повышало устойчивость такой системы.

В начале 1980-х годов был создан протокол управления передачей данных TCP/IP (Transmission Control Protocol/Internet Protocol). Он стал доминирующим в процессах обмена пакетами в ARPANet. Примерно в это же время стало понятно, что TCP/IP может использоваться для соединения различных компьютерных сетей, что позволяло обмениваться данными на национальном или даже на международном уровне. Термин Интернет впервые был использован для обозначения такой «сети сетей».

В конце 1989 года проект ARPANet благополучно пришел к своему завершению, но к тому моменту многие университеты и научные организации имели, что называется, «доступ к Интернету». В начале 90-х корпорации стали активно использовать Интернет для передачи данных по электронной почте, однако запрет на коммерческое использование трафика, наложенный Национальным научным фондом, еще существовал и препятствовал коммерческому использованию Всемирной сети В 1991 году запрет был снят, что сделало Интернет доступным для частных лиц, предприятий и организаций, не являющихся правительственными либо образовательными, а также расширило возможности его коммерческого использования (Интернет-магазины, реклама через Интернет).

В 1991 году Тим Бернерс-Ли (Tim Berners-Lee) из швейцарской фирмы CERN, используя компьютер NeXt, написал код того, из чего вскоре выросла Всемирная сеть В 1993 году был выпущен первый графический браузер Mosaic. В 1994 году Марк Андреесен (Marc Andreesen), один из разработчиков Mosaic из университета при Иллинойском национальном центре приложений для суперкомпьютеров, переехал в Калифорнию и основал корпорацию Netscape совместно с предпринимателем по имени Джим Кларк (Jim Clark).

Вскоре после выхода в свет коммерческой версии браузера для персонального компьютера фирма Netscape выпустила Netscape Commerce Server. Это серверное приложение давало возможность организациям не только размещать веб-сайты и отправлять веб-страницы на удаленные персональные компьютеры, но и, например, используя защищенные соединения, работать с кредитными карточками. При этом данные посылались в шифрованной форме, так, чтобы их могли прочесть только отправитель и получатель. В 90-х годах Интернет-технологии стали интенсивно развиваться, в результате чего Сеть стала как стандартной средой передачи данных, так и механизмом для осуществления коммерческой деятельности.

Пройдя испытание множеством обновлений аппаратуры и сменой поколений пользователей, Интернет остается важной частью мировой коммуникационной инфраструктуры. Доступ к Сети стал возможен с помощью множества устройств, например мобильных телефонов и карманных ПК. Телевидение, радио и печатные издания часто отсылают зрителей, слушателей и читателей в Интернет за дополнительной информацией. Как показывает опыт, во время различных кризисных ситуаций Сеть способна быть самым оперативным средством связи.

Не потеряв своей значимости для правительственных организаций и больших корпораций, Интернет является также достоянием любого среднего гражданина, который может разместить в Сети свой сайт и участвовать в сетевой жизни, независимо от того, какую цель он преследует: коммерческую, образовательную, развлекательную или какую-либо иную. Для этого требуется совсем немного знаний и компьютерный инструментарий. Начнем со знаний.

ПРИМЕЧАНИЕ

Легко спутать два понятия: Интернет и World Wide Web Интернет — это глобальная сеть, состоящая из линий связи, серверов и протоколов, дающих возможность миллионам компьютеров во всем мире связываться друг с другом. WWW — это услуга, которая предоставляется при помощи Интернета .Это всего лишь один из методов доступа к информации, наряду с e-mail, чатами, системами передачи файлов и т. д.

Как работает Всемирная паутина

World Wide Web — это не какое-то определенное место в Интернете, это не какой-то компьютер или нечто, с чем можно «установить сеанс связи». Всемирную паутину можно, скорее, назвать услугой, предоставляемой в рамках Интернета. Использование определенных протоколов, компьютеров, называемых веб-серверами (потому что они подключены к Сети и на них запущено серверное программное обеспечение) делает предоставление этой услуги возможным. То есть серверы могут отвечать на запросы клиента, на котором установлен веб-браузер.

ПРИМЕЧАНИЕ

Все, что нужно компьютеру, чтобы стать сервером, — это подключение к Интернету и наличие серверного программного обеспечения. Это ПО включено в состав многих популярных операционных систем: Windows, Mac OS, Unix, часто в виде простого решения «Web Sharing» (разделения веб-ресурсов). Веб-сервер постоянно «сидит» в Интернете и ждет запросов от клиентских браузеров типа Netscape, Internet Explorer и т. п. Клиентские компьютеры запрашивают документы, которые сервером и отсылаются по адресу, назначенному браузером.

У каждого компьютера, находящегося в Интернете, есть свой уникальный адрес. Когда на веб-сервер приходит запрос, всегда известен адрес отправителя. Ответ посылается именно по этому адресу. Файл, пришедший браузеру в качестве ответа на запрос, обрабатывается — чаще всего показывается на экране. Иногда браузер не может обработать файл, тогда он обращается к вспомогательной программе, которая, например, сохраняет файл на жестком диске клиентского компьютера.

Во время типичного сеанса «перемещения» по World Wide Web операции типа запрос-ответ происходят практически постоянно: поскольку не только текст должен быть «скачан» с сервера, но и все графические изображения, все звуковые файлы, цифровое видео и т. д. Все это становится возможным благодаря тому, что оба компьютера подключены к Интернету. Они оба распознают протокол передачи данных (команды передачи и приема); кроме того, клиентский компьютер должен распознать язык, команды которого заставляют перерисовывать изображение и отображать содержимое веб-странички в окне браузера. Итак, у нас имеются три разных протокола, или три различных языка.

Первый из протоколов — это TCP/IP С его помощью компьютеры связаны друг с другом в Интернете. У каждого из компьютеров есть адрес, который используется для его идентификации и обеспечения возможности передачи команд и данных из одного места в другое. Если имеется компьютер, который планируется подключить к Интернету, необходимо для него установить TCP/IP-соединение, при этом аппаратура и среда передачи данных никакой роли не играет. Это может быть обычный модем для телефонных линий, кабельный модем, DSL, корпоративное подключение и т. д.

После того как установлено соединение по TCP/IP, запускается веб-браузер, который использует протокол передачи гипертекста (HTTP, Hypertext Transfer Protocol) для обмена командами. Затем веб-сервер посылает специальным образом размеченные документы (HTML) на браузер клиента, который выводит их на экран. Рассмотрим подробнее понятия HTML и HTTP.

Что такое HTTP

Протокол передачи гипертекста (HTTP) является основой общения веб-браузеров и веб-серверов. Он очень простой, но для большинства веб-дизайнеров не представляет особого интереса, поскольку используется исключительно для программного соединения браузера и сервера. Так что знать интимные подробности его работы не обязательно. Но знать основные принципы полезно.

Веб-браузер посылает запрос на соединение с сервером в виде специальной команды HTTP. Если запрос может быть удовлетворен, браузер запрашивает файл, который, по его мнению, имеется на сервере. Если это действительно так, то файл отсылается, а принимающая сторона сама решает, что с ним делать — то ли показывать его на экране, то ли сохранять на диске, то ли что-то еще.

Обратите внимание, HTTP не является единственным протоколом, использующимся в Интернете. Есть протокол передачи файлов (File Transfer Protocol, FTP), протокол обмена сообщениями электронной почты (Post Office Protocol, Simple Mail Transport Protocol) и др. Имеются также различные разновидности HTTP, например шифрованный HTTP (SHTTP): при передаче данных с его помощью информация определенным образом кодируется .Этот протокол используется для обмена конфиденциальной информацией, в том числе коммерческой.

Но протоколы имеют свойство работать незаметно для глаз пользователя. Единственным моментом, требующим внимания к используемому протоколу, является создание гиперссылок, о чем будет сказано позднее (Мы узнаем немного подробнее об HTTP из главы 15, «Добавление HTML-форм», и из главы 16, «CGI и сбор данных»).

ПРИМЕЧАНИЕ

Несмотря на то что разрабатываются и новые версии HTTP, самой популярной является HTTP 11, которая отличается от базовой тем, что дает возможность соединению между браузером и сервером оставаться открытым в течение длительного времени. Это делает работу протокола более эффективной.

Что такое HTML

Язык гипертекстовой разметки документов (HTML) представляет собой набор стандартных кодов и соглашений, предназначенных для создания веб-страниц и подготовки их к выводу на экран браузеров. Используя HTML, можно создавать веб-страницы, включающие в себя форматированный текст и команды вывода изображений и других мультимедийных элементов.

ПРИМЕЧАНИЕ

Веб-страница определяется как единый HTML-документ, независимо от его длины. При ее просмотре вы можете не прокручивать экран вообще, а можете прокручивать много раз. В любом случае вы наблюдаете на экране только лишь одну веб-страницу.

Само название языка дает некоторое понятие о его предназначении: это язык разметки. И это отличает его от языков программирования. Можно говорить, что HTML — это набор инструкций, которые указывают веб-браузеру, каким образом выводить тот или иной текст или изображение. В большинстве случаев это делается командами управления документом. Например, HTML-документ может содержать команду, делающую конкретный текст заголовком странички:

<h1>Добро пожаловать на мою страничку</h1>

<hl> и </hl>, окружающие текст, называются тегами (флажками). Они образуют элемент <hl>, сообщающий браузеру о том, что текст, содержащийся между тегами, является заголовком первого уровня Браузер знает, как обрабатывать эти теги, и, соответственно, изменяет начертание букв этого текста.

Подобным же образом HTML-документ может содержать команды, загружающие изображение и размещающие его на экране:

<img src="imagejpg" />

Этот код сообщает браузеру, что необходимо загрузить файл imagejpg и разместить его на страничке. Даже изображения и мультимедийные элементы, которые находятся на страничке, являются частью разметки HTML. В документ Word, например, изображения могут встраиваться, становиться его частью, тогда как в HTML-документе указывается только их расположение, а сами изображения существуют отдельно. Документ, созданный с помощью HTML, всегда является простым текстовым файлом, как текст программы, никакие элементы типа изображений в него не встраиваются.

Когда браузер читает HTML-документ, он распознает команды загрузки и позиционирования тех изображений или мультимедийных элементов, которые вы решили включить в этот документ. Кроме того, почти в любом документе имеются инструкции создания гиперссылок, то есть ссылок на другие документы.

Гипертекст и гиперссылки

Одним из ключевых методов, реализующих HTML в частности и Всемирную паутину в целом, является метод гипертекстовых ссылок .С помощью специальных команд можно выделить часть текста и сделать так, чтобы на него можно было «нажимать» Обычный текст таким образом превращается в гипертекст. При щелчке на гиперссылке, как показано на рис 11, браузер обычно загружает другую страницу (Я говорю «обычно», поскольку иногда щелчок на гиперссылке может вызывать другие эффекты, например запуск вспомогательного приложения типа проигрывателя RealAudio или Telnet либо сохранение файла на жестком диске).

Тем не менее не всегда ссылки представляют собой текст — иногда на изображениях тоже можно щелкать, в этом случае более правильно, наверное, называть такую ссылку гиперссылкой, а не гипертекстом, хотя это большой роли не играет. Гиперссылки играют большую роль в веб-публикациях и вообще в World Wide Web.

Почти каждая веб-страничка содержит гиперссылку, и не одну. В более узком смысле понимание гиперссылок необходимо для того, чтобы научиться организовывать свой сайт.

Рис 1.1. Гипертекстовые ссылки обычно отличаются цветом и выделяются подчеркиванием

Но как же осуществляется связывание страниц? С помощью разметки HTML просто создается ссылка, которая указывает на какой-либо адрес в Сети. Каждая веб-страничка, как и любой другой Интернет-ресурс, имеет свой уникальный адрес, поэтому браузер всегда может запросить именно ту информацию, которая нужна. Эти адреса называются унифицированными указателями информационных ресурсов (чаще используют сокращение URL (Uniform Resource Locators)).

Унифицированные указатели информационных ресурсов (URL)

Доступ к большинству Интернет-служб осуществляется с помощью схемы адресации, благодаря которой можно легко найти интересующий документ. Каждый тип службы имеет свой формат адреса, который обычно чем-нибудь да отличается от других. Например, с одной стороны, чтобы послать электронное письмо на мой адрес, следует написать в поле адреса своего почтового приложения: tstauffer@aolcom. С другой стороны, чтобы получить доступ к FTP-серверу AOL, нужно написать:ftpaol.com

Браузеры могут получать доступ к большому количеству различных типов сервисов: что касается веб, то речь идет прежде всего о доступе к отдельным документам. Таким образом, URL — это комбинация адресов типа ftpaol com и некоторых дополнительных элементов, позволяющих указывать тип службы и имя конкретного запрашиваемого документа URL можно использовать для получения доступа к любым документам и службам, поддерживаемым веб-браузерами URL записывается следующим образом:

протокол://Интернет_ адрес/путь/имя_файла.рсш

или

протокол:интернет_адрес

Вот пример URL для доступа к некому веб-документу: http://www.microsoft.com/windows/index.html

В соответствии с форматом URL, http:// означает протокол, а wwwmicrosoftcom — адрес веб-сервера компании Microsoft. За ним следует косая черта (/), означающая, что после нее следует путь.

Путь к файлу указывает на то, что мы ищем документ indexhtml, расположенный в папке Windows.

ПРИМЕЧАНИЕ

Если вы знакомы с операционными системами, основанными на DOS или Unix, вы сразу узнаете нечто знакомое — выражения, обозначающие пути к файлам. Если вы пользуетесь Mac OS, нужно представить, что путь задает направления на определенный файл, хранящийся на сервере. Браузер должен точно знать, в каких директориях и поддиректориях находится файл, поэтому путь — это стандартная часть любого URL.

Двумя главными преимуществами URL являются следующие:

1 Они позволяют определить тип Интернет-ресурса Например, если URL начинается с http, значит, ведется работа по соответствующему протоколу. При этом именно HTTP — это не единственно возможный протокол. Их краткий список приведен ниже.

2 Система адресации в URL позволяет единственным образом идентифицировать каждый документ, программу или файл в Интернете.

Протоколы, используемые в URL

HTTP — это наиболее часто используемый протокол доступа к HTML-страницам. В таблице 1.1 показаны некоторые альтернативные протоколы, которые могут быть частью URL.

При помощи ввода одного из названий этих протоколов с последующим указанием адреса сервера и пути можно получить доступ практически к любому документу, директории, файлу или программе, имеющимся в Интернете или на вашем жестком диске. Как видно из табл 11, URL относятся не только к http, но и к совершенно иным протоколам Интернета. FTP-серверы, в частности, предназначены для передачи файлов (тем самым они как бы противопоставляются протоколу HTTP, который предназначен для просмотра файлов). Серверы Gopher были предшественниками веб-серверов и служили для просмотра обычных текстовых документов. Серверы Telnet предназначены для удаленного соединения с помощью системы учетных записей, то есть пользователь должен ввести свое имя и пароль, после чего появляется командная строка, дающая возможность совершать удаленно различные операции на сервере. Большинство веб-браузеров могут отображать списки файлов, хранящихся на FTP-серверах, и меню Gopher, некоторые имеют встроенные редакторы электронных писем, но большинству требуется дополнительное программное обеспечение для доступа к Telnet.

Таблица 1.1. Протоколы, используемые в URL

Протокол		Доступ к...
№11		НТТР(веб)-серверам
ftps://		Некоторым НТТР(веб)-серверам с шифрованием
file://		HTML-документам на вашем жестком диске
ftp://		FTP-серверам и файлам
gopher://		Gopher-меню и документам
news://		Серверам групп новостей Usenet
news:		Конкретной группе новостей Usenet
mailto:		Определенному адресу электронной почты
telnet:		Удаленному серверу Telnet

ПРИМЕЧАНИЕ

Протоколы mailto:, news: и telnet: предъявляют различные требования к синтаксису URL. После mailto: должен следовать обычный адрес e-mail, после news: следует имя группы новостей, а после telnet: пишется адрес сервера (без указания пути).

HTML против XHTML

Как вы уже, наверное, заметили, HTML — это язык разметки, позволяющий комбинировать текст, мультимедиа-элементы и гиперссылки при создании веб-страниц. Но HTML не стоит на месте, он развивается, и с момента его появления в начале 90-х уже вышло несколько обновленных стандартов. Каждая последующая версия строится на основе предыдущей, и если браузер поддерживает текущую версию стандарта HTML, значит, он поддерживает и все предыдущие, но знать различия все-таки надо.

Кто устанавливает стандарты HTML

Консорциум World Wide Web (http://www.w3.org) отвечает за создание спецификаций, которых должны придерживаться компании, занимающиеся разработкой таких вещей, как веб-браузеры и устройства просмотра веб-страниц. W3C — это отраслевая группа, основанная Тимом Бернерс-Ли, она включает в себя все основные корпорации, занимающиеся веб-индустрией (такие как Microsoft, Netscape, AOL и AT&T).

Одной из задач W3C является разработка спецификаций HTML. Поскольку технологии постоянно меняются, постоянно ведется работа над новыми стандартами. Время от времени публикуются рабочие варианты, призванные кодифицировать новые достижения, не забывая о том, что пользователи не могут постоянно переходить от стандарта к стандарту. При этом организация стандартизации пытается учесть все интересы: W3C может отказать во введении в стандарт нового элемента, предложенного разработчиками браузеров, поскольку, например, он поддерживается только графическими средствами просмотра и не поддерживается текстовыми.

Через некоторое время после опубликования рабочих вариантов и их обсуждения Интернет-общественностью стандарт становится официальным и выпускается рекомендация. В соответствии с рекомендациями разработчики должны обновить версии своих браузеров (впрочем, чаще всего это происходит еще до опубликования рекомендаций). Отказ от следования рекомендациям W3C для разработчиков браузеров означает только то, что их программные продукты не будут воспринимать документы, написанные в соответствии с новым стандартом. Поэтому все стараются своевременно принимать меры.

Спецификация HTML прошла уже несколько обновлений, начиная от HTML версии 10 и заканчивая самой свежей на сегодняшний день версией 401 (от 1999 года). После этого основное внимание было уделено созданию таких элементов HTML, которые были бы совместимы с расширяемой спецификацией языка создания вебстраниц XML, созданной специально для того, чтобы стать основой других языков разметки XML может быть использован для создания и определения новых языков, специфичных для какой-либо области применения. Благодаря тому что XML является мощным средством, W3C сделало своей целью переписать HTML, приведя его к новому обобщенному стандарту. Вместе с тем делается все возможное для того, чтобы новый HTML был похож на старый и не создавал проблем с совместимостью языков.

Для чего нужны новые стандарты

Результатом видоизменения HTML стал стандарт XHTML. Текущая версия, XHTML 10, очень немногим отличается от своего предшественника, HTML 401. Есть некоторые различия, но он больше напоминает более строгую версию старых стандартов HTML, от авторов требуется больше аккуратности при написании документов. Но понять все это довольно-таки несложно.

Зачем же нужны новые стандарты? Чем больше веб-браузеров будет поддерживать XML, тем больше XHTML будет превращаться из самостоятельного языка в модуль XML, понимаемый и выводимый на экран. Например, можно создать специальный язык для написания документов с множеством математических формул.

Строгое следование стандарту XHTML может в скором времени сильно упростить жизнь. Уже сейчас многие устройства и приложения используют доступ к World Wide Web. Это касается мобильных телефонов, карманных компьютеров и других подобных изобретений. XHTML призван учесть возможности и интересы всех браузеров. И чем лучше код вашей странички будет согласован с новым стандартом, тем лучше он будет себя вести в различных условиях.

Чем пользоваться

Может показаться, что во всех случаях следует использовать новейший стандарт, XHTML 10, но на самом деле не так все просто. Проблема в том, что даже внутри стандарта имеется два подхода: строгий и переходный. Использование строгого подхода — это, конечно, очень хорошо, однако далеко не все браузеры смогут это оценить просто потому, что не смогут отобразить странички в новом формате. Несмотря на то что большинство пользователей обновляют программное и аппаратное обеспечение довольно часто, есть еще ряд довольно старых машин, на которых установлены старые браузеры, ничего не знающие про XHTML.

Поэтому нужно в первую очередь решить, на кого вы ориентируетесь и в соответствии с этим выбрать подход: строгий или переходный. Нужно объявить использование того или другого при написании веб-страницы. Мы еще обратим на это внимание в главе 4, «Создаем первую веб-страничку». Время от времени мы будем указывать на команды и настройки строгого XHTML. В некоторых случаях они отличаются от переходного XHTML, я на это тоже обращу ваше внимание. Но в большинстве случаев я бы посоветовал пользоваться гибридным подходом, в котором содержится больше старых команд и свойств.

ПРИМЕЧАНИЕ

Нельзя говорить про строгий и переходный (гибридный) подходы, что они «правильные» или «неправильные» В конечном счете (через несколько лет) строгий подход будет понятен абсолютному большинству браузеров, и проблема выбора отпадет сама собой Но в ближайшем будущем придется продолжать использовать переходный подход.

HTML — это не программирование

Я, может быть, немного напугал вас всеми этими многочисленными акронимами, сокращениями и разговорами о спецификациях? Честно признаюсь, я и сам, пока писал про все это, подглядывал в разные шпаргалки, чтобы убедиться, что я еще не отстал от жизни. В большинстве случаев концепции HTML и XHTML оказываются довольно простыми для понимания, особенно если вникнуть в суть принципа языков разметки. Напоминайте себе постоянно о том, что HTML по сложности даже рядом не лежал с такой непростой штукой, как программирование. Программирование — это процесс создания скриптов или приложений с использованием сложных компьютерных языков типа C++ или Java, а что такое создание веб-страниц? Чаще всего этот процесс называют авторской разработкой, что-то вроде написания книги .Да и в самом деле, что делает веб-дизайнер, разработчик веб-страницы? Он набивает текст, затем добавляет коды для его приемлемого размещения на экране. Ну конечно, можно добавить картинки, звуковое сопровождение, еще что-нибудь для того, чтобы страничка смотрелась луч-_; ше и оригинальнее .Собственно, последнему и посвящена большая часть книги, и все, что вам остается сделать по ее прочтении, — это разработать что-нибудь свое.

Кроме базовой разметки XHTML, в книге рассматриваются еще две концепции, применяемые при публикациях в Сети. Я говорю о таблицах стилей и скриптах .Таблицы стилей заставляют страницу выглядеть привлекательно или по крайней мере оригинально, для этого используются разные цвета, шрифты и т. д. Скрипты — это программные элементы, хотя и очень небольшие. Используются совместно с XHTML и таблицами стилей.

Основная разметка

В то время как скрипты и таблицы стилей требуют некоторой предварительной подготовки и, вообще говоря, подключаются к основному документу, сама разметка есть суть веб-страниц. В общем случае вы печатаете текст, затем с помощью тегов организуете его желаемым образом HTML и XHTML имеют две основные разновидности элементов: пустые и непустые.

Пустые элементы делают что-то сами по себе: рисуют линию, добавляют изображение, загружают какой-нибудь файл Примером может служить простой элемент, рисующий горизонтальную линию:

<hr />

Непустые элементы (или контейнеры) используются для того, чтобы что-нибудь делать с текстом, который их окружает.

Это <strong> очень </strong> важное замечание!

Обратите внимание на косую черту И в HTML, и в XHTML косая черта означает закрывающий тег непустого элемента, такого как, например, strong. В XHTML важно вставлять косую черту и в конце пустого элемента В более ранних версиях HTML это было не обязательно.

ПРИМЕЧАНИЕ

Замыкающая косая черта в пустом элементе часто добавляется через пробел для облегчения восприятия: <hr/> Это не является обязательным условием синтаксиса, поэтому <hr/> будет работать ничуть не хуже.

HTML и XHTML, возможно, гораздо сложнее, чем описано выше? Какие-то простенькие теги — все понятно. Чем тогда объяснить наличие более четырехсот страниц в этой книге? Да, действительно, эти языки чуть-чуть сложнее, чем просто набор тегов, но сложность их проявляется не столько в теории, сколько на практике. Хорошим способом понимания HTML и XHTML является подробное изучение атрибутов элементов, которые используются лишь для окончательной «настройки» внешнего вида символов на экране Возьмем для примера основной тег для помещения изображения на страничку:

<img'src="imagejpg" />

Часть этого тега, состоящая из <img /> является полноценным элементом, хотя большого толка от его использования без атрибута src (источник изображения) не будет. Кроме этого атрибута, у <img /> есть и другие, такие как alt, задающий альтернативный текст при отсутствии изображения, align, задающий размещение картинки, как в следующем примере:

<img src="imagejpg" alt="Добро пожаловать на мой сайт!"

align="top" />

Теперь, кажется, должно быть понятно, что элементы могут быть и более сложными, иметь несколько атрибутов.

Если вы знакомы с предыдущими версиями HTML, этот код может показаться вам немного странным Дело в том, что примеры, приведенные в этой книге, соответствуют стандарту XHTML. Это означает следующее:

• XML является регистрозависимым, поэтому все имена элементов должны быть написаны строчными буквами: <р>, </р>, br /> и т д;

• все элементы должны иметь закрывающие теги либо закрывающую косую черту, даже если они являются пустыми, как <hr />;

• все атрибуты должны быть заключены в двойные кавычки: <img src="file.jpg" align="left" />.

Даже если вы в прошлом не имели дело с HTML, знайте, что XHTML легко читается и запоминается благодаря этим новым соглашениям.

Оформление с помощью таблиц стилей

Основные элементы разметки являются первым уровнем сложности HTML или XHTML. Вторым уровнем, особенно в отношении XHTML, является необходимость знания и понимания таблиц стилей. Таблицы стилей отвечают за то, чтобы веб-страницы имели свою индивидуальность и, простите за тавтологию, стиль. Они используются для изменения шрифтов, цветов, размеров и расположения текста и других элементов страницы.

Здесь есть одно важное отличие. Используя обычный XHTML для создания вебстраницы, вы на самом деле ничего не определяете и не изменяете во внешнем виде текста, по крайней мере, в терминах шрифтов, цветов, размеров и других подобных атрибутов. Вместо этого разметка XHTML используется для распределения текста по категориям и размещения его на экране.

В прошлом HTML и его расширения (то есть элементы, поддерживаемые браузерами, но не включенные в рекомендации W3C) позволяли напрямую изменять внешний вид текста или других компонентов, находящихся на странице, с использованием таких элементов, как <font>, или таких атрибутов, как color. Хотя многие страницы до сих пор продолжают строиться с учетом этих соглашений, переход на XHTML потребовал, по возможности, избегать этого, а использовать таблицы стилей.

Таблицы стилей не изменяют напрямую текст, находящийся на странице, а маркируют некоторые его части, затем сравнивают то, что получилось, с тем, что задано в таблице. Браузер может и не обращаться к таблице стилей, как в случае использования для доступа к Интернету мобильных телефонов. В этом случае XHTML-код является отдельной сущностью, а стилевое решение — отдельной. Таким образом, доступ к странице может получить максимальное число различных типов устройств, каждое из которых берет из таблицы стилей максимум того, на что оно способно.

Например, сугубо текстовый браузер, встроенный в мобильный телефон, может различать обычный текст, заголовок и ссылку, но не различает шрифты. Когда вы помещаете команды изменения стиля в таблицу стилей, то текстовый браузер может спокойно проигнорировать их, продолжая нормально воспроизводить страницу вместе со всеми ее элементами.

ПРИМЕЧАНИЕ

До десятой главы мы будем обсуждать в основном организационную разметку XHTML. В главе 10 вы увидите, как таблицы стилей хорошо вписались в общую структуру языка. Также мы обсудим разницу между таблицами стилей, использование которых рекомендуется, и прямой разметкой, использование которой не рекомендуется.

Добавление скриптов

Следующим уровнем сложности при создании веб-страницы являются скрипты. Современные браузеры поддерживают стандартные языки написания скриптов, что позволяет сделать веб-страницы менее статическими, более живыми и интерактивными. Возможности варьируются от обычных эффектов поведения, то есть изменения стиля текста при наведении на него указателя курсора, как показано на рис. 1.2, до включения в состав страницы сложных приложений, доступ к которым осуществляется через веб-браузер.

ПРИМЕЧАНИЕ

На рисунке 1.2 вы видите экран Macintosh. Веб-мастеринг является платформонезависимым, поэтому в тексте будут встречаться как экраны Windows, так и Macintosh. На самом деле, если у вас есть доступ к нескольким операционным системам: Windows, Unix, Macintosh и другим, то всегда полезно проверять, как выглядят созданные вами страницы на разных платформах.

Рис. 1.2 Эффект наведения получается комбинированием средств XHTML, таблиц стилей и скриптов

Написание скриптов — это настоящее программирование, но вскоре вы поймете, что овладеть этим искусством совсем несложно, особенно если вы понимаете логику программирования. Язык JavaScript (и его «родственники» ECMAScript и JScript) является самым распространенным средством, с помощью которого можно писать различные полезные скрипты.

Скрипты работают в сочетании как с XHTML, так и с таблицами стилей, делая веб-страницы интерактивными и объединяя все вместе в Dynamic HTML (или DHTML). Хотя XHTML заменил DHTML и стал самым популярным акронимом, касающимся веб-публикаций, создание динамических страниц — также полезное и интересное занятие.

Резюме

В этой главе мы осветили базовые вопросы, необходимые для того, чтобы предпринять следующий решительный шаг в деле освоения технологии веб-публикаций. Мы начали с краткого экскурса в историю Интернета, затем обсудили понятие World Wide Web, включая протоколы, языки и схемы адресации (URL). Мы определили и обсудили языки HTML n XHTML, вы узнали, что XHTML — это будущий веб-язык, и именно его спецификация рассматривается в нашей книге. XHTML бывает строгий и переходный, причем последний наиболее совместим со старыми спецификациями и старыми версиями браузеров. В книге больший упор будет сделан на строгом XHTML, однако переходные элементы и соответствующий синтаксис разметки тоже будут обсуждаться.

В конце главы мы рассмотрели различные уровни технологии веб-публикаций — от относительно простых приемов создания и организации веб-страниц до немного более сложных процессов применения стилей и добавления скриптов и других динамических элементов.

В главе 2, которая называется «Краткий курс веб-дизайна», мы познакомим вас с основами оформительского дела при публикации в Сети, коснемся вопросов организации страницы, планирования стабильно работающих сайтов и страниц, наилучшего применения стандартов XHTML.