OPFI / 09-OPFI_VI_Vvedenie_v_web-dizayn_rus
.pdf
Алгоритм разработки Web-сайта
Постановка целей и определение основных задач
Создание списка будущих тематических разделов
Разработка логической и физической структуры ресурса
Подготовка эскиза дизайна, компоновка сайта
Подготовка текстовых материалов
Подготовка графических материалов и оптимизация картинок
Создание шаблонов Web-страниц
Сборка и отладка кода
Проверка идентичности отображения Web-страниц с различным экранным разрешением и цветовой палитрой и в различных браузерах
Общая структура HTML-документа
HTML определяет стандартизированную структуру построения программы, которая определяет очередность следования ряда обязательных блоков, которые содержат программный код
Директивы HTML называются “тегами”. Синтаксис в общем виде выглядит так <тег>
Все объекты, не заключенные в угловые 
скобки, интерпретатор воспринимает как
текстовые элементы
Упрощенная структура HTML-документа выглядит следующим образом
Типовая WWW страница
Что бы лучше понять каким образом, используя спецификации языка HTML, создается Webстраница, необходимо сравнить 
исходный текст
страницы с ее изображением в окне браузера
Исходный HTML код страницы
Команды языка HTML
Команды языка HTML задают правила, по которым браузер выводит документ на экран: размещение текста в окне, представление графических объектов, а также вывод звуковых, видео клипов
Большинство команд языка HTML, такие как <HTML>, <TITLE>, <HEAD>, или <FONT>, требуют соответствующую команду </...>, для ее "закрытия" (тег – “конец команды”). Существуют команды, такие как <P> (команда отделяющая друг от друга абзацы), для которых “конец команды” ставить не обязательно и команды типа <BR> (жесткий перевод строки), для которых “конец команды” не нужен. Многие команды имеют параметры, называемые атрибутами, которые модифицируют действие команды
Помимо команд в языке HTML используется специальный управляющий символ “амперсанд” (&). Этот символ используется для вывода специальных символов и символов из расширенной кодовой таблицы (Code Page), которые нельзя ввести с клавиатуры, например, вывод символа амперсанд (&) осуществляется посредством последовательности символов “&”, для вывода угловых скобок используются последовательности “<” для “<“ и “>” для “>”. Символ номер 176 (°) из кодовой таблицы, может быть задан последовательностью “°”
Формат команд
Команды или теги языка HTML как правило имеют следующую структуру:
Язык HTML не чувствителен к регистру. Команды языка могут набираться как прописными так и
строчными буквами, т.е. команда |
<title> |
эквивалентна команде <TITLE> или |
<TiTlE> |
Не все теги поддерживаются всеми WWW браузерами. Если браузер не поддерживает команду, он ее просто игнорирует
Форматирование HTML документа
Язык HTML является однопроходным языком и в стандартном варианте, когда не используются технологии SSI (Server Side Include), DHTML (Dinamic HTML), или ASP (Active Server Page) или
PHP, не содержит циклов и переходов. Браузер посматривает документ один раз с начала до конца, сразу же форматируя страницу
Команда <HTML> означает начало HTML документа, а команда <HEAD> определяет начало заголовка документа, содержащего метаинформацию о документе
Строка примера 
определяет название документа - "WEB Pages", которое будет выведено в заголовке окна браузера
Форматирование HTML документа
Строки
состоят из комментария, в котором указывается, что здесь начинается документ и первая команда "тела документа" <BODY>
Далее идет гиперссылка и загрузка картинки:
Строка 
определяет новый параграф и горизонтальную линию без теней ширины 2 пикселя
Атрибуты команд
Команды могут иметь параметры, которые называются атрибутами. Атрибуты модифицируют исполнение команды или переопределяют ее стиль
Атрибуты ставятся сразу после команды и имеют следующий формат: 
Если значение атрибута состоит из одного слова, то ставить кавычки не обязательно, но рекомендуется. Если же значение атрибута содержит пробелы или небуквенные символы, то кавычки обязательны
В качестве |
примера, |
использования атрибутов |
|
рассмотрим |
команду |
BODY, |
определяющую |
содержательную часть документа
Пример использования атрибутов
Команда BODY определяет начало и конец тела документа. При помощи атрибутов эта команда позволяет определить:
Цвет (BGCOLOR) или рисунок (BACKGROUND) фона
Цвет (TEXT) текста
Верхний (TOPMARGIN) и левый (LEFTMARGIN) отступ
Цвет, которым обозначаются непросмотренные (LINK), просмотренные (VLINK) и активные (ALINK) гиперсвязи в документе
Атрибуты для команды BODY могут принимать следующие значения:
BACKGROUND=url - адрес или путь к файлу
BGCOLOR=color - имя или номер цвета
BGPROPERTIES=FIXED
LINK=color - имя или номер цвета
VLINK=color - имя или номер цвета
TEXT=color - имя или номер цвета
TOPMARGIN=n - значение отступа в пикселях или в процентах
LEFTMARGIN=n - значение отступа в пикселях или в процентах