Общие принципы создания web — страниц

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

HTML (Hyper Text Markup Language) — это специальный язык форматирования текстовых электронных документов. Например, для печатного документа задаются такие параметры, как размер бумаги и полей, шрифты и их размеры и тому подобное. Поскольку электронные Web-документы предназначены для пересмотра на экране, причем заранее не известно, на каком компьютере это будет делаться, а, следовательно, неизвестны размеры окна программы — просмотрщика, шрифты, которые установлены на компьютере, и т. д., то язык HTML назначен как раз для того, чтобы оформлять электронные документы в расчете на то, что средства, которыми они будут пересматриваться, заранее неизвестны. Формирование документов языком HTML подобное программированию. Исходный текст документа состоит из последовательности команд, которые называют тэгами (tag). Во время пересмотра тэги срабатывают, и благодаря ним на экран выводятся запрограммированные элементы изображения. Например, если в начале абзаца стоит тэг, то весь абзац будет уровнен по центру окна, независимо от того, в каком окне осуществляется пересмотр документа и каким шрифтом он изображается. Тэги HTML позволяют выравнивать строки документа, руководить цветом фонона цветом текста, позволяют вставлять в текст иллюстрации, задавать заглавия разных уровней, строить таблицы, создавать гипертекстовые ссылки на другие документы.

Web-документ сохраняется и пересылается как файл с расширением html или htm (HTML-файл). Это обычные текстовые файлы-программы, написанные языком HTML. Отображаются такие файлы на экране иначе, чем они выглядят в HTML-файле. Для отображения HTML-файлов используют браузеры.

Типичный Web-документ состоит из текстовых блоков, рисунков, таблиц, линий, гиперссылок. Более сложные Web-документы содержат фреймы (вложены Web-страницы), элементы управления и вводу информации (кнопки, переключатели, поля вводу текста), динамические объекты (Java Applet, Java Script, ACTIVEX).

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

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

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

Тэги и ограничивают WWW-документ и записываются лишь ради формы. Команды и ограничивают заглавие страницы. Эти тэги также не являются обязательными, они помогают лучше структурировать страницу. Наконец, появляется в браузере в строке заглавию. Еще более важным является тэг, который позволяет описать собственно Web-документ. В этом месте размещается определенное количество параметров, которые определяют внешний вид документа. Эти параметры, например, определяют, как выглядит фон и цвет текста и какое изображение должно быть на заднем плане Web-страницы.

В завершение обращу внимание, что для создания Web-страниц дизайнеры используют гипертекстовые редакторы, например, Macromedia Dreamweaver, Microsoft FrontPage и другие, хотя при достаточном владении языком HTML можно писать Web-страницы в любом текстовом редакторе, например, Блокнот (NotePad). После написания программ файл нужно сохранить на диске с определенным названием и расширением .html ли .htm. Современные текстовые процессоры, например, MS Word, Lotus WordPerfect дают возможность создать Web-страницы методом конструирования без применения команд HTML, поскольку они генерируют эти команды автоматически. Общее название таких программ, которые имеют возможность автоматизированного создания Web-страниц без явного приложения пользователем языка HTML — Web-конструкторы.

Рассмотрим кое-что детальнее возможности конструктора, которые имеет программа MS Word. Чтобы создать Web-страницу или целый Web-сайт, нужно во время создания нового документу перейти на закладку Web-страницы и воспользоваться Мастером Web-страницы или создать новую страницу. Во втором случае алгоритм действий дизайнеров таков:

• · Командой меню Формат->Фон задают цвет фона определенной текстурой.
• · Удалять текст, выбирая шрифт, его размер, цвет, выравнивание и тому подобное.
• · Создают списки, как в обычном текстовом редакторе.
• · Вставляют горизонтальные линии командой меню Вставка>Горизонтальная линия, и выбирают тип линии.
• · С помощью команды Таблица создают и форматируют таблицы.
• · Используют команду Вставка для вставления картинок, фотографий, звука, гиперссылок и тому подобное.
• · Записывают созданный файл как Документ HTML, и просматривают его браузером.