
- •Язык разметки гипертекста html. Назначение html
- •Язык разметки гипертекста html
- •Краткая история html
- •Программы для просмотра электронных документов
- •Лабораторная работа № 1. Язык разметки гипертекста html. Основные понятия языка
- •Основные понятия
- •Структура документа html
- •Задания к лабораторной работе № 1 Задание 1. Создание простейшей Web-страницы.
- •Контрольные вопросы
- •Лабораторная работа № 2. Форматирование текста.
- •Форматирование абзаца
- •Форматирование шрифта
- •Физические стили
- •Размер шрифта
- •Логические стили
- •Горизонтальные линии
- •Escape последовательности (символьные объекты)
- •Контрольные вопросы
- •Лабораторная работа № 3. Управление цветом
- •Цветовая гамма html-документа
- •Сочетание цветов
- •Задания к лабораторной работе № 3 Управление цветом
- •Контрольные вопросы
- •Лабораторная работа № 4. Гиперссылки
- •Относительные адреса ссылок
- •Задания к лабораторной работе № 4 Гипертекстовые ссылки Задание к лабораторной работе №4
- •Контрольные вопросы
- •Лабораторная работа № 5. Работа со списками
- •Маркированный (ненумерованный - Unordered List) список
- •Нумерованные списки
- •Вложенный список
- •Списки определений
- •Список-меню
- •Список-указатель (список-индекс)
- •Теплым.
- •Круглым.
- •Желтым.
- •Контрольные вопросы
- •Лабораторная работа № 6. Вставка графических изображений
- •Роль графики
- •Характеристика графических стандартов
- •Вставка графических изображений
- •Использование карт изображений
- •Преимущества и недостатки карт-изображений
- •Область применения
- •Конфигурация карт-изображений
- •Типы карт-изображений
- •Серверный вариант
- •Клиентский вариант
- •Задания к лабораторной работе № 6 Вставка графических изображений
- •Примеры карт
- •Карта 2
- •Контрольные вопросы
- •Лабораторная работа № 7. Таблицы html-документов
- •Основные методы создания таблиц
- •Цветные таблицы
- •Группировка данных
- •Колонтитулы таблицы
- •Прорисовка структуры таблицы
- •Вложенные таблицы
- •Преимущества вложенных таблиц
- •Задания к лабораторной работе № 7.
- •Задание 3. Форматирование таблицы
- •Контрольные вопросы
- •Лабораторная работа № 8. Формы
- •1. Организация обратной связи
- •2. Авторизация
- •3. Проведение исследований
- •4. Пользовательский профиль
- •Структура пользовательских форм
- •Параметры текстовой строки
- •Параметры опции выбора
- •Параметры кнопки с рисунком
- •Параметры текстового поля
- •Параметры
- •Параметры текстового поля
- •Задания к лабораторной работе № 6 Формы
- •Индивидуальное задание
- •Контрольные вопросы
- •Лабораторная работа № 9. Фреймы
- •Синтаксис фреймов
- •Атрибуты:
- •Планирование фреймов и взаимодействия между фреймами
- •Зарезервированные имена фреймов
- •Бегущая строка (элемент marquee)
- •Фиксация информации на экране (элемент banner)
- •Задания к лабораторной работе № 9. Фреймы
- •Контрольные вопросы
- •Справочник
- •Приложение 1. Таблица спецсимволов
- •Литература
Цветовая гамма html-документа
Цветовая гамма HTML-документа определяется атрибутами, размещенными внутри метки <BODY>. Вот список этих атрибутов:
bgcolor – определяет цвет фона документа;
Пример.
<BODY bqcolor=“#FFFFFF"> ...</body>
Насыщенность красным, зеленым и синим – одинакова – FF (это шестнадцатеричное представление числа 255). Результат — белый цвет.
text – определяет цвет текста документа;
Пример.
<body text="#0000FF ">
Это значит, что весь текст страницы будет синим, кроме текста, для которого мы специально прописали <font></font> (если цвет в <body> не задавать, то по умолчанию он будет черным).
link – определяет цвет выделенного элемента текста, при нажатии на который происходит переход по гипертекстовой ссылке.
vlink – определяет цвет ссылки на документ, который уже был просмотрен ранее.
alink – определяет цвет ссылки в момент, когда на нее указывает курсор мыши и нажата ее правая кнопка, то есть непосредственно перед переходом по ссылке.
link = “#FF0000” - цвет гипертекстовой ссылки. Насыщенность красным — FF (255), зеленым и синим — 00 (ноль). Результат — красный цвет.
Кроме того, метка <BODY> может включать атрибут background = "[имя файла]", который задает изображение, служащее фоном для текста и других изображений. Как и любое другое изображение, фон должен быть представлен в формате GIF (файл с расширением *.gif) или JPEG (файл с расширением *.jpg или *.jpeg).
Браузеры заполняют множественными копиями изображения-фона всё пространство окна, в котором открыт документ, подобно тому, как при строительстве большие пространства стен покрывают маленькими (и одинаковыми) плитками.
Важно отметить, что цвет фона и изображение-фон никак не отображаются на бумаге при выводе HTML-документа на печать. Из этого есть одно важное практическое следствие: старайтесь не использовать текст белого цвета.
Сочетание цветов
Сочетать можно любой цвет с любым. Ну, кроме тех, которые нельзя сочетать. Для большинства людей всегда очевидно – удачен ли подбор оттенков, однако многие страдают страшной, почти неизлечимой болезнью – они рисуют ярко-желтым по ярко-бирюзовому:
Можно прописать несложное лекарство – больному рекомендуется проверять цветосочетание в монохромном режиме:
Не читается. Цвета одинаковой интенсивности вообще плохо читаются друг на друге.
Впрочем, рано радоваться. Попробуем поставить эти два цвета рядом:
Ничего вам это сочетание не напоминает, кстати? Данный пример (вполне приемлемого союза) является иллюстрацией того, что любые цвета могут употребляться с любыми другими. Дело в другом – не в возможности поставить два цвета рядом, а в пропорции сочетания. Критерием оценки должно служить только одно – читаемость. Если результат не читается, не надо убеждать себя в том, что цвета отлично подходят друг к другу.
Подбор цветовой гаммы всегда должен начинаться с вопроса – «для чего?». Если вы оформляете сайт, то, вероятно, у вас есть некий объем текста, который на сайте нужно разместить. Если есть текст, то нужно позаботиться о его читаемости.
Исследования показывают, что человеческий глаз лучше всего воспринимает черным по белому. Настолько хорошо воспринимает, что в случае, если кто-то все-таки не увидел, ему незамедлительно сообщают: «Написано же черным по белому!!!».
Белый на черном тоже имеет право на существование, но это худший вариант. Для больших текстов такое сочетание точно не подходит.
С каждым из этих прекрасных цветосочетаний можно сделать отличный дизайн. Точно с таким же успехом можно сделать и отвратительный. Оказывается, не все зависит от цветов.