10.2. Разработка простой Web-страницы

Большинство Web-страниц представляют собой гипертекстовые документы, отформатированные с помощью специального языка разметки документов HTML (HyperText Markup Language).

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

Web-страница представляет собой обычный текстовый файл (то есть файл, содержащий только текст с символами, записанными в кодах ASCII[1]), в котором собственно текст страницы размечен инструкциями для Web-браузера. На основании этих инструкций браузер определенным образом отображает страницу в своем окне и при активизации гиперссылки осуществляет загрузку указанного ресурса.

Любой HTML-документ состоит из двух логических частей: заголовка и тела. Заголовок документа содержит основную информацию о документе, в том числе название HTML-документа, которое отображается в строке заголовка Web-браузера. Тело документа интерпретируется браузером как содержимое Web-страницы.

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

Вот пример "минимальной" Web-страницы:

Пример 10.1. "Минимальной" Web-страницы

	
<HTML> 1
<HEAD> 2
<TITLE> Информационное агентство 3</TITLE>4 
</HEAD> 5
<BODY> 6
Привет! Это моя личная страница!
</BODY>7
</HTML> 8
					
1 8

<HTML>…</HTML>- начальный и конечный теги всего HTML-документа. Данный тег предназначен для того, чтобы браузер определил тип документа (HTML) и соответствующим образом его отобразил.

2 5

<HEAD>…</HEAD> - начальный и конечный теги заголовка документа. Тег заголовка должен быть указан сразу после тега <HTML> и не должен присутствовать в теле документа. Он отмечает общее описание документа и позволяет HTTP-серверу получить информацию о документе.

3 4

<TITLE>…</TITLE> - начальный и конечный теги названия страницы. Название, заключенное в теги <TITLE>…</TITLE>, должно размещаться внутри тегов <HEAD>…</HEAD>. Название страницы не является ее содержимым, а отображается в заголовке окна браузера. Название документа используется программами поиска информации в Web для построения индексов, поэтому должно быть информативным.

6 7

<BODY>…</BODY> - начальный и конечный теги тела документа.


Здесь представлены парные теги:

Для создания HTML-документа можно воспользоваться любым текстовым редактором. Лучше всего использовать приложение Блокнот, которое создает файлы в текстовом формате. Редакторы WordPad и MS Word по умолчанию создают файлы в формате документа Word, который содержит не только текст, но и описание его форматирования. При разработке в них HTML-текста требуется особое внимание. В этом случае сохраняйте HTML-документ как текстовый файл, указав в имени файла одно из общепринятых расширений HTML-документов .htm или .html.

Загрузите текстовый редактор Блокнот. Введите HTML-текст Документа Пример 10.1, «"Минимальной" Web-страницы» и сохраните его как First.htm. Загрузив страницу в Internet Explorer, вы увидите ее изображение (рис.2.2).

Рисунок 10.2. Пример простой Web-страницы

Пример простой Web-страницы

Название страницы, заключенное в теги <TITLE>…</TITLE>, отобразилось в заголовке окна браузера, имя файла страницы - в строке адреса, а содержание страницы, ограниченное тегами <BODY>…</BODY>, - в окне просмотра.



[1] ASCII - Американский стандартный код по обмену информацией