Web-страница представляет собой гипертекстовый документ. Гипертекст - это текст, в котором имеются ссылки для автоматического перехода на другие тексты – гиперссылки. Для создания Web-страниц используется язык разметки HTML (HyperText Markup Language). Он представляет собой набор команд определяющих, в каком виде информация будет отображаться в окне браузера. Команды состоят из заключённых в угловые скобки (< >) тэгов и их атрибутов. Почти все команды языка HTML парные и состоят из открывающего (< >) и закрывающего (< / >) тэгов, между которыми располагается содержимое тэга. Они подразделяются на структурные, которые организуют текст и на форматирующие, которые задают его стиль. Файл, содержащий Web-страницу должен иметь расширение .htm или .html. Для его компоновки можно использовать любой текстовый редактор, сохраняющий "только текст", т.е. текст без символов форматирования, установки шрифтов и т.д. Картинки и другие нетекстовые компоненты не вставляются в документ непосредственно и хранятся отдельно. Вместо этого в текст Web-страницы вставляется ссылка, указывающая программе просмотра имя файла, содержащего нетекстовый компонент.
Минимальная (пустая) Web-страница имеет вид:
<html>
<body>
тело страницы
</body>
</html>
В настоящее время применяется стандарт языка HTML 4.0., теги которого одинаково восприниматься любыми браузерами. Однако фирмы, разрабатывающие браузеры, включают в них свои собственные тэги, не согласуя между собой введение этих новшеств. Поэтому Web-страницы могут по-разному отображаться браузерами различных фирм.
Для создания динамичных, интерактивных страниц, включающих в себя массу нестандартных возможностей, необходимо не только знание языка HTML, но и основ написания специальных приложений – Java-апплетов, Java-скриптов и элементов управления ActiveX. В Internet можно найти бесплатно распространяемые приложения и использовать их на своих страницах (н-р.: http://www.caravan.ru/~javaapp/, http://gif.al.ru/java.html).
Организация фона на странице.
<body - в данный тэг необходимо вставить атрибуты
bgcolor="#??????" - для однотонного фона, ?????? - шестнадцатиричный код цвета или специальное слово
background="имя.[jpg][gif]"> - для фона в виде графического изображения
Оформление текста
<center>текст</center> - расположение текста посередине страницы
<p> - пустая строка
<br> - новая строка
<b>текст</b> - жирный текст
<i>текст</i> - курсив
<u>текст</u> - текст с подчеркиванием
<nobr>текст</nobr> - текст размещается на одной строке
<hr - горизонтальная черта и ее атрибуты
width=[число][%] - ширина
color="#??????" - цвет
size=число - размер
align=[left][center][right]> - размещение на странице
<ol type=[1][A][a][I][i]> - нумерованный список
<li> текст
<li> текст
</ol>
<ul type=[disc][circle][square]> - ненумерованный список
<li> текст
<li> текст
</ul>
Вставка графических изображений
<img src="имя.[jpg][gif]" - в данный тэг можно добавлять атрибуты
border=число - для задания рамки вокруг изображения
hspace= число - для задания горизонтального отступа
vspace= число - для задания вертикального отступа
align=[left][center][right]> - для задания размещения на странице
<br clear=all> - завершить обтекание графического изображения текстом.
Организация гиперссылок
<a href="имя.[htm][gif][jpg]">[текст][<img src=...>]</a> - гиперссылка на другую страницу или графическое изображение.
<a href="url">[текст][<img src=...>]</a> - гиперссылка на другой сервер по тексту или изображению.
Организация ссылки с одной страницы на конкретное место другой
Страница "откуда": <a href="файл.htm#имя">[текст][<img src=...>]</a> |
Страница "куда": <a name="#имя">[текст][<img src=...>]</a> |
Таблицы
<table> | ||||||||||||||||||
<tr> |
|
</tr> | ||||||||||||||||
<tr> | </tr> | |||||||||||||||||
<tr> | </tr> | |||||||||||||||||
<tr> | </tr> | |||||||||||||||||
</table> |
Фреймы (пример фреймовой структуры)
имя кадра1 файл - имя1.htm |
|
имя кадра2 файл |
имя кадра3 файл |
Существует множество программ для создания Web-страниц. В своей основе все они делятся на две категории: программы автоматизирующие вставку тэгов, т.е. редактирующие исходный код и программы, работающие по методу WYSIWYG (What you see is what you get) - что видишь, то и получишь, когда разработчик редактирует визуализированный конечный продукт, не видя исходного кода. Создавать страницы редактором более простой способ, однако получаемый при этом HTML-код не всегда будет оптимальным. Для упрощения работы по написанию страниц многие разработчики используют созданные заранее типовые шаблоны исходных кодов документов, а более опытные мастера прибегают к помощи редакторов с тем, чтобы потом придать коду надлежащий вид, удалив из него все лишнее руками. Поэтому для создания профессиональных Web-сайтов знание языка HTML обязательно.