Навигация
2.1 HTML
Для публикации информации и её глобального распространения необходим универсальный язык типа основного всеобщего языка, который потенциально понятен всем компьютерам. Таким языком, используемым в World Wide Web, является HTML (от HyperText Markup Language/Язык Гипертекстовой Разметки).HTML даёт авторам средства для того, чтобы:
· публиковать online-документы с оглавлением, текстом, таблицами, списками, фотографиями и т.д.;
· запрашивать online-информацию, переходя по гиперссылкам, нажимая кнопки;
· создавать формы для взаимодействия с удалённым сервисом, для поиска информации, создания архивов, продажи товаров и т д.;
· включать таблицы данных, видео и аудиоклипы и другие приложения прямо в документы.
Отличительный признак HTML-документа. Одним из принципов языка является многоуровневое вложение элементов. HTML является самым внешним, так как между его стартовым и конечным тегами должна находиться вся Web-страница.
Также основным тегом является <HEAD></head>
Область заголовка Web-страницы. Иными словами, ее первая часть. Так же как и HTML, HEAD служит только для формирования общей структуры документа.
<BODY></body>
Этот элемент заключает в себе гипертекст, который определяет собственно Web-страницу. Эта та часть документа, которую разрабатывает автор страницы и которая отображается броузером. Соответственно, конечный тег этого элемента надо искать в конце HTML-файла. Внутри BODY можно использовать все элементы, предназначенные для дизайна Web-страницы. Внутри стартового тега элемента BODY можно расположить ряд атрибутов, обеспечивающих установки для всей страницы целиком.
Если сравнить исходные тексты различных Web-страниц, можно легко увидеть сходство их структур. Это объясняется тем, что документы создаются по определенным правилам. В основу синтаксиса языка HTML лег стандарт ISO 8879:1986 “Information processing. Text and office systems. Standard Generalized Markup Language (SGML)”. Правда, существует большое различие между стандартом официальным и стандартом фактическим.
Ниже приведен шаблон типичного Web-документа. На его примере мы рассмотрим общие принципы построения HTML-страниц.
Для того чтобы понять структуру Web-страницы, нам необходимо подробно рассмотреть все элементы, входящие в приведенный листинг.
<COMMENT> Комментарий к документу </comment>
<HTML><HEAD>
<TITLE> Структура Web-страницы</title>
<STYLE> H2 {font-family: Arbat;}
CODE {font-family: Arbat;} </style>
<META
name=’’Author’’
content=’’Irina’’>
<META
name=’’Keywords’’
content=’’WWW, HTML, document, element’’>
</head>
<BODY bgcolor=#FFFFFF>
<A name=’’top’’></a>
Переход в <A href=’’#bottom’’> конец </a> документа <P>
Переход к <A href=’’#S001’’><B> ссылке 1 </b></a><P>
<P><HR>
<H1>Заголовок1<h1>
<H2>Заголовок2<h2>
<H3>Заголовок3<h3>
<H4>Заголовок4<h4>
<H5>Заголовок5<h5>
<H6>Заголовок6<h6>
<HR>Здесь расположена <B>ссылка 1</b><A name=’’S001’’></a>
<HR><P>Здесь должен располагаться оригинальный текст Web-страницы
<HR><A name=’’bottom’’></a><P>
Переход в <A gref=’’top’’> начало </a> документа
</body></html><COMMENT></comment>
Текст комментария. В любом языке программирования есть конструкции, позволяющие создавать произвольные ремарки. HTML в этом смысле - не исключение. Текст, помещенный внутри COMMENT, игнорируется броузером. COMMENT может располагаться в любом месте кода Web-страницы. Без конечного тега, здесь, по-видимому, не обойтись: комментарий должен быть отделен от основного текста.
Существует, правда, одно ограничение: внутри комментария не должны располагаться другие элементы. Так должно быть, разумеется, только в том случае, когда необходимо, чтобы все содержимое элемента COMMENT не отображалось на экране монитора. Если в комментарии будет присутствовать другой элемент, то его содержимое будет выведено на экран, отформатированное соответствующим образом. С этой проблемой связана другая, похожая: обычный текст не может содержать фрагменты, имеющие вид тегов. Для того чтобы включать в текст подобные конструкции, существует элемент PLAINTEXT, о котором речь пойдет ниже.
Существует и другой способ обозначения комментария. Он заключается в использовании восклицательного знака и обрамлении текста комментария двойным тире. Например:
<!--Строка комментария-->
<!--Комментарий- -Не комментарий- -Снова комментарий-->
Внутри подобной конструкции можно помещать и теги: они не будут восприниматься браузером.
<HTML></html>
Отличительный признак HTML-документа. Одним из принципов языка является многоуровневое вложение элементов. HTML является самым внешним, так как между его стартовым и конечным тегами должна находиться вся Web-страница. В принципе, этот элемент можно рассматривать как формальность. Он имеет атрибуты version, lang и dir, которыми в данном случае мало кто пользуется и допускает вложение элементов HEAD, BODY и PLAINTEXT, определяющих общую структуру Web-страницы. Естественно, что конечным тегом </html> заканчиваются все гипертекстовые документы.
<HEAD></head>
Область заголовка Web-страницы. Иными словами, ее первая часть. Так же как и HTML, HEAD служит только для формирования общей структуры документа. Этот элемент может иметь атрибуты lang и dir и допускается вложение элементов TITLE, ISINDEX, BASE, META, LINK, NEXTID.
<TITLE></title>
Элемент для размещения заголовка Web-страницы. Строка текста, расположенная внутри, отображается не в документе, а в заголовке окна броузера. Эта особенность часто используется для организации поиска в WWW. Поэтому авторы, создающие Web-страницы, должны позаботиться о том, чтобы строка внутри TITLE, не будучи слишком длинной, достаточно отображала назначение документа.
<STYLE></style>
Описание стиля некоторых элементов Web-страницы. В выше приведенном примере назначены шрифты для элементов Н2 и CODE. Естественно, что для каждого элемента существует стилевое оформление по умолчанию, поэтому употребление STYLE не обязательно.
<META>
Этот элемент содержит служебную информацию, которая не отображается при просмотре Web-страницы. Внутри него нет текста в обычном понимании, поэтому нет и конечного тега. Каждый элемент META содержит два основных атрибута, первый из которых определяет тип данных, а второй - содержание. Далее приведены несколько примеров meta-данных.
Дата, обозначающая “срок годности”документа:
name=’’Expires’’ content=’’Дата’’
Адрес электронной почты:
name=’’Reply-to’’ content=’’Имя@Адрес’’
Указание приложения, в котором был создан Web-документ:
name=’’Generator’’ content=’’Название HTML-редактора’’
Атрибут name используется приложением-клиентом для получения дополнительной информации о Web-страницах и их упорядочения. Этот атрибут часто заменяют атрибутом http-equiv. Он используется сервером для создания дополнительных полей при выполнении запроса.
Кроме этого, элемент МЕТА может содержать URL. Шаблон соответствующего атрибута таков:
URL=’’http://адрес’’
<BODY></body>
Этот элемент заключает в себе гипертекст, который определяет собственно Web-страницу. Эта та часть документа, которую разрабатывает автор страницы и которая отображается браузером. Соответственно, конечный тег этого элемента надо искать в конце HTML-файла. Внутри BODY можно использовать все элементы, предназначенные для дизайна Web-страницы. Внутри стартового тега элемента BODY можно расположить ряд атрибутов, обеспечивающих установки для всей страницы целиком. Рассмотрим их по порядку.
Один из самых полезных для дизайна - атрибут, определяющий фон страницы. Его появление можно уподобить маленькой революции в WWW, так как одинаковые серые Web-страницы благодаря нему расцвели яркими цветными узорами: background=’’Путь к файлу фона’’
Более простое оформление фона сводиться к заданию его цвета: bgcolor=’’#RRGGBB’’
Цвет фона задается тремя двухразрядными шестнадцатеричными числами, которые определяют интенсивность красного, зеленого и синего цветов соответственно.
Оба вышеперечисленных атрибута не являются альтернативными и часто используются совместно.
Поскольку фон страницы может изменяться, необходимо иметь возможность подбирать соответствующий цвет текста. Для этого имеется следующий атрибут: text=’’#RRGGBB’’
Для задания цвета гиперссылок используется атрибут: link=’’RRGGBB’’
Также можно задать цвет для использованных гиперссылок: vlink=’’RRGGBB’’
Гипертекст, расположенный внутри элемента BODY, может иметь произвольную структуру. Ее определяют в первую очередь назначение Web-страницы и фантазия разработчика.
<A></a>
HTML-документ может быть очень большим, и в этом случае пользователю должна быть предоставлена возможность быстро перемещаться к нужному разделу страницы. Для этого можно использовать механизм гиперссылок. Необходимо также в нужных местах текста расставить соответствующие метки. Подробно. Рассмотрим только шаблон для создания меток:
<A name=’’Метка’’></a>
В этом случае для перехода внутри документа можно использовать следующую конструкцию:
<P>Переход к <A href=’’#Метка’’>метке</a></p>
Несколько подобных строк могут образовать своеобразное оглавление Web-страницы, которое можно разместить в начале и в конце документа.
<BASE>
Элемент для установки базового адреса (URL) для ссылок. Это позволяет опускать их начальную часть. Для использования элемента необходима следующая конструкция:
<BASE href=’’http://компьютер/путь1’’>
Фрагмент путь1 не является обязательным. При форматировании полного адреса он будет отброшен.
В том случае, когда надо задать базовый адрес для локального диска (например D:), должна быть использована такая конструкция:
<BASE href=’’file://D:\путь\’’>
Тогда при указании относительной ссылки можно задать не только имя файла, но и имена папок, в которых он находиться. Иными словами, путь к файлам может быть разбит на две части: абсолютную и относительную. Это полезно в том случае, когда для файлов указанных в документе, есть общий начальный фрагмент пути.
В выражении абсолютной ссылки можно также опустить указание на схему доступа (file://). В этом случае будут учитываться только левая часть абсолютной ссылки до первого левого символа “\”, то есть имя локального диска.
Похожие работы
... . Но большое количество горизонтальных линий неприятно для посетителя вашей Веб-страницы, поэтому после каждого абзаца их ставить не следует. Они больше подходят для выделения целых разделов. 3. Программы для создания Web-страниц 3.1 HTML-редакторы Каждый выбирает свой инструмент для создания Web-страниц. Это может быть MS FrontPage или Macromedia DreamWeaver, ...
... слов и т.д. Эти данные используются также поисковыми серверами при индексации документов. 1.2 СОЗДАНИЕ И ОФОРМЛЕНИЕ WEB-СТРАНИЦ Для создания Web-страниц понадобится любой браузер - Internet Explorer или Netscape Communicator, а лучше оба, так как многие элементы HTML по-разному отображаются в разных программах просмотра и весьма желательно контролировать эту разницу. Кроме того, нужен любой ...
... сервисами из командной строки и дистанционно с локальной машины получение статистических данных на отдельной машине; · может работать и с протоколом FTP; · системная поддержка UNIX и Windows. Сравнительный анализ сред создания Web-приложений В настоящее время во всемирной паутине размещено несколько миллионов Web-сайтов и их число постоянно растет. У каждого есть возможность не только ...
... Web-страниц в Word используются те же средства форматирования текста, что и для документов Word. Например, можно присвоить тексту полужирное начертание с помощью кнопки полужирный и т.д. При создании страницы требуется только отформатировать текст надлежащим образом, т.к. исходный код Web-страницы обрабатывается в неявном виде. Тип шрифта также может быть изменен, однако нужно учитывать, что ...
0 комментариев