Отправляет email-рассылки с помощью сервиса Sendsay

Технологии эффективного Интернета

Рассылка закрыта

При закрытии подписчики были переданы в рассылку "Как сделать популярный сайт." на которую и рекомендуем вам подписаться.

Вы можете найти рассылки сходной тематики в Каталоге рассылок.

←   Февраль 2006   →
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
Автор
Vladimir N Abramov

Статистика

3.524 подписчиков
0 за неделю
←   Все выпуски   →

Основы web-технологий


Информационный Канал Subscribe.Ru
Общие принципы создания Web-узла
Основные понятия: World Wide Web, сайт, язык гипертекстовой разметки, тег, HTML.
Информация о выпуске: Вы узнаете о принципах построения гипертекстовых информационных систем, о роли языка гипертекстовой разметки HTML в построении сайтов, о формате и структура HTML-документов.

== Часть 2 ==

Создание технологии HTML

В 1989 году Тим Бернерс-Ли предложил проект распределенной гипертекстовой системы, которую он назвал World Wide Web (WWW), Всемирная паутина. Первоначально идея системы состояла в том, чтобы при помощи гипертекстовой навигационной системы объединить все множество информационных ресурсов CERN (международного центра высоких энергий) в единую информационную систему. Технология оказалась настолько удачной, что дала толчок к развитию одной из самых популярных в мире глобальных информационных систем. Практически в сознании большинства пользователей глобальной компьютерной сети Internet сама эта сеть ассоциируется с тремя основными информационными технологиями:

  • электронная почта (e-mail);
  • файловые архивы FTP;
  • WWW документы.

Причем последняя технология постепенно перемещается на первое место.

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

При разработке языка HTML (HyperText Markup Language, язык разметки гипертекста) и сопутствующих технологий предполагалось, что квалификация авторов информационных ресурсов и их оснащенность средствами вычислительной техники будут минимальными. Разработчик языка (Тим Бернерс-Ли) создал его на основе SGML (Standard Generalised Markup Language, стандартный обобщенный язык разметки). Дэниел В. Конноли написал для него Document Type Definition — формальное описание синтаксиса HTML в терминах SGML.

Разработчики HTML смогли решить две задачи:

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

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

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

Сейчас World Wide Web Consortium (W3C) — международная организация, которая занимается подготовкой и распространением документации версий HTML — уже опубликовала материалы спецификации HTML 4.01. Кроме возможностей разметки текста, включения мультимедиа и формирования гипертекстовых связей, уже существовавших в предыдущих версиях HTML, в версию 4.01 включены дополнительные средства работы с мультимедиа, языки программирования, таблицы стилей, упрощенные средства печати изображений и документов. Для создания динамических страниц используются языки программирования сценариев, например JavaScript, Java и VBScript.

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

Принципы гипертекстовой разметки

HTML является описательным языком разметки документов, в нем используются указатели разметки теги. Теговая модель описывает документ как совокупность контейнеров, каждый из которых начинается и заканчивается тегами, то есть документ НТМL представляет собой не что иное, как обычный текстовый файл, с добавленными в него управляющими НТМL-кодами ( тегами).

Теги НТМL-документов в большинстве своем просты и понятны, ибо они образованы с помощью общеупотребительных слов английского языка, понятных сокращений и обозначений. НТМL-тег состоит из имени, за которым может следовать необязательный список атрибутов тега. Текст тега заключается в угловые скобки ("<" и ">"). Простейший вариант тега — имя, заключенное в угловые скобки, например <HEAD> или <I>. Для ряда тегов характерно наличие атрибутов, которые могут иметь конкретные значения, устанавливаемые автором для изменения функции тега.

Например, при описании таблицы открывающий тег с атрибутами может выглядеть так:

<TABLE WIDTH="570" ALIGN="center" CELLPADDING="10" CELLSPACING="2" BORDER="1">

Эта запись означает следующее: таблица шириной 570 пикселов, выровнена по центру, поле между рамкой и содержимым ячеек 10 пикселов, поле рамки 2 пиксела, ширина бордюра 1 пиксел.

Атрибуты тега следуют за именем и отделяются друг от друга одним или несколькими знаками табуляции, пробелами или переходом на новую строку. Порядок записи атрибутов в теге значения не имеет. Значение атрибута, если таковое имеется, следует за знаком равенства, стоящим после имени атрибута. Если значение атрибута — одно слово или число, то его можно просто указать после знака равенства, не выделяя дополнительно. Все остальные значения необходимо заключать в одинарные или двойные кавычки, особенно если они содержат несколько разделенных пробелами слов. Длина значения атрибута ограничена 1024 символами. Регистр символов в именах тегов и атрибутов не учитывается, чего нельзя сказать о значениях атрибутов. Например, особенно важно использовать нужный регистр при вводе URL (Universe Resource Locator, унифицированный указатель ресурса), других документов в качестве значения атрибута HREF.

Чаще всего элементы разметки HTML или HTML-контейнеры состоят из начального и конечного компонентов, между которыми размещаются текст и другие элементы документа. Имя конечного тега идентично имени начального, но перед именем конечного тега ставится косая черта ( /) (например, для тега стиля шрифта — курсив <I> закрывающая пара представляет собой </I>, для тега заголовка <ТIТLЕ> закрывающей парой будет </ТIТLЕ>). Конечные теги никогда не содержат атрибутов. По своему значению теги близки к понятию скобок "begin/end" в универсальных языках программирования, которые задают области действия имен локальных переменных и т.п. Теги определяют область действия правил отображения HTML документа.

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

Некоторые элементы разметки не имеют конечного компонента, поскольку являются автономными элементами. Например, тег изображения <IMG>, который служит для вставки в документ графического изображения, конечного компонента не требует. К автономным элементам разметки также относятся разрыв строки ( <BR>), горизонтальная линейка ( <HR>) и теги, содержащие такую информацию о документе, которая не влияет на его отображаемое содержимое, например теги   <META> и <BASE>.

В некоторых случаях конечные теги в документе можно опускать. Большинство браузеров устроено так, что при обработке текста документа начальный тег воспринимается как конечный тег предыдущего. Самый распространенный тег такого типа — тег абзаца <Р>. Поскольку он используется в документе очень часто, его обычно ставят только в начале каждого абзаца. Когда один абзац заканчивается, следующий тег   <Р> сигнализирует браузеру о том, что нужно завершить данный абзац и начать следующий. Большинство авторов тегом конца абзаца не пользуются.

Есть и другие конечные теги, без которых браузеры отлично работают, например конечный тег   </HTML>. Тем не менее, рекомендуется включать по возможности больше конечных тегов, чтобы избежать путаницы и ошибок при воспроизведении документа.

Общая схема построения контейнера в формате HTML может быть записана в следующем виде:

<имя_тега список_атрибутов> содержание контейнера </имя_тега>

Следует отметить, что в литературе кроме термина "контейнер" еще используется и термин "элемент". Следует быть внимательным, чтобы не путать контейнер (например, тег BODY вместе с его содержимым) и тег (BODY), используемый при формировании контейнера.

Кроме тегов, элементами HTML являются CER (Character Entity Reference), они предназначены для представления специальных символов в документе HTML. Например, чтобы представить символ "<" в документе HTML, нужно заменить его на &lt;, а символ ">" — на &gt;. То есть, если набрать в документе HTML строку:

&lt;BODY&gt;

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

Обозначения специальных символов CER начинаются с амперсанта "&". В отличие от наименований тегов HTML, наименования CER чувствительны к регистру символов. Также наименования CER могут задаваться не в виде имени, а с помощью трехзначных кодов символов в виде &#nnn;. В таблице приведены наиболее часто используемые CER и соответствующие им числовые коды.

Числовой код обозначение Символ Описание
&#034; &quot; " Кавычка
&#038; &amp; & Амперсант
&#060; &lt; < Меньше
&#062; &gt; > Больше
&#160; &nbsp;   Неразрывный пробел
&#161; &iexcl; ¡ Перевернутый восклицательный знак
&#162; &cent; ¢ Цент
&#163; &pound; £ Фунт
&#164; &curren; ¤ Валюта
&#165; &yen; ¥ Йена
&#168; &uml; ¨ Умляут
&#169; &copy; © Копирайт
&#171; &laquo; « Левая угловая кавычка
&#174; &reg; ® Зарегистрированная торговая марка
&#177; &plusmn; ± Плюс или минус
&#187; &raquo; » Правая угловая кавычка

Группы тегов НТМL

Элементы НТМL разметки по их назначению и области действия можно разделить на следующие основные группы:

  • определяющие структуру документа;
  • оформление блоков гипертекста (параграфы, списки, таблицы, картинки);
  • гипертекстовые ссылки и закладки;
  • формы для организации диалога;
  • вызов программ.

Структура гипертекстовой сети задается гипертекстовыми ссылками. Гипертекстовая ссылка — это просто адрес другого HTML-документа в Сети, который с ним связан. Механизм адресации основанный на URI (Uniform Resource Identifier, универсальный идентификатор ресурса), называется URL, и пользователи WWW имеют дело именно с ним.

Пример использования такого адреса:

Для своего сайта я выбрал хостинговую компанию: <A HREF="http://www.aho.ru/index.php" target="_blank"> AHO.Ru</A> - надежный и недорогой хостинг.

Выглядит это так:

Для своего сайта я выбрал хостинговую компанию: AHO.Ru - надежный и недорогой хостинг.

В приведенном выше примере тег "A", который в HTML называют якорем (anchor), использует атрибут HREF, обозначающий гипертекстовую ссылку (Hypertext Reference), для записи этой ссылки в форме URL. Данная ссылка указывает на документ с именем "index.php" на сервере "www.aho.ru", доступ к которому осуществляется по протоколу HTTP.

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

В заключение отметим, что при подготовке документов HTML используется идентификатор текста DTD (Document Type Declaration, определение типа документа) в качестве первой строки. Это позволяет браузеру идентифицировать документ как соответствующий стандарту HTML. Обычно (но не обязательно) каждый документ HTML начинается со строки типа:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

Здесь содержится информация о том, что документ соответствует версии HTML 4.0, разработанной W3C. Используемый язык — английский.

Спасибо за внимание, встретимся через неделю.

cайт рассылки: web.aho.ru
Subscribe.Ru
Поддержка подписчиков
Другие рассылки этой тематики
Другие рассылки этого автора		 Подписан адрес:
Код этой рассылки: inet.webbuild.myweb
Архив рассылки		 Отписаться Вебом Почтой
Вспомнить пароль
В избранное