WEB-дизайн - Учебный центр открытого обучения

Орехово-Зуевский учебный центр открытого обучения
РАССМОТРЕНО
методической комиссией
Орехово-Зуевского учебного центра
открытого обучения
Протокол № 18
«05» октября 2009 г.
Программа курса
«WEB-дизайн»
Примерный срок обучения 1 месяц
Составитель: преподаватель О/З УЦОО А.В. Баранов
Исполнитель: методист О/З УЦОО Шатилова Н.А.
Web-дизайн
1
Орехово-Зуевский учебный центр открытого обучения
Пояснительная записка
к программе курса
«WEB-дизайн»
Изучение программы курса «Веб-дизайн» возможно как по групповой так и по
индивидуальной форме. При индивидуальной форме обучения содержание и сроки
определяются по заявке слушателя или работодателя. Данная программа является
примерной.
Данная учебная программа курсов по специальности «Web-дизайн» предназначена
для всех желающих изучить общие принципы работы Интернет-сайтов, приобрести
навыки создания и оформления страниц.
Необходимо, чтобы слушатели умели работать с ПК на уровне пользователя, знали
операционную систему Microsoft Windows.
Слушатели данного курса должны знать:



Язык разметки гипертекстовых документов HTML.
- Методы редактирования Интернет-страниц (визуальный и невизуальный).
- Общие понятия о ключевых словах (тегах) и их параметрах (атрибутах).
- Общую структуру (главные блоки) документа.
- Разновидности базового оформления документа (физическое и логическое).
- Разбивку текста на абзацы, добавление заголовков.
- Спецсимволы.
- Общие параметры для документа (тела) в целом.
- Принцип прикрепления внешних ресурсов (изображений) к странице.
- Разновидности гиперссылок (на другой документ, на электронный почтовый
ящик, на раздел документа).
- Вставку таблиц и их оформление, разбивку на смысловые блоки (группировка)
по строкам и столбцам.
Дополнительное оформление документа с помощью каскадных стилевых таблиц
(CSS).
- Дополнительные единицы измерения, введенные в CSS.
- Варианты прикрепления стилевых определений к конкретным элементам (один
или несколько тегов, контекстное определение, классы, назначение по
идентификатору).
- Размещение стилевых определений (в теге, как атрибут, в заголовочном блоке
страницы, вынос в отдельный CSS-документ).
- Методы базового оформления текста.
- Настройку полей, фона и рамок.
- Управление видимостью и размерами.
- Позиционирование.
- Псевдоклассы и псевдоэлементы.
Базовые основы языка программирования JavaScript
- Понятие переменных, стандартные виды переменных.
- Базовые математические операторы.
- Операторы сравнения.
Web-дизайн
2
Орехово-Зуевский учебный центр открытого обучения
- Общий вид функции.
- Основные принципы обращения к элементам страницы для изменения
атрибутов и стилей CSS.
Слушатели данного курса должны уметь:





Создавать разметку страницы в целом или отдельных элементов с помощью таблиц
или блоков (контейнеров) CSS.
Выполнять ввод и оформление текста страницы базовыми средствами HTML и
стилями CSS.
Добавлять и оформлять иллюстрации (изображения).
Создавать несколько страниц, связать их гиперссылками. Добавить возможность
перехода внутри документа.
Создавать меню сайта (вертикальное и горизонтальное, обычное и выпадающее).
Форма итогового контроля знаний по программе курса» - зачет.
Слушатели, успешно окончившие обучение, получают Удостоверение.
В тематический план изучаемого предмета преподавателем могут вноситься
изменения и дополнения в пределах часов, установленных учебным планом.
Web-дизайн
3
Орехово-Зуевский учебный центр открытого обучения
ПРОГРАММА КУРСА
«WEB-дизайн»
1. Определения языка HTML. Общие принципы редактирования документа. Виды
редакторов: визуальные и не визуальные. Примеры программ-редакторов. Общий вид
HTML-тега. Одиночные и парные теги. Добавление атрибутов. Общая структура
документа. Заголовочный блок. Возможные теги внутри него. Общие параметры
страницы: заголовок, язык, кодировка, авторские права, ключевые слова, краткое
описание сайта и пр. Теги физического форматирования текста. Теги логического
форматирования. Ввод спецсимволов. Создание заголовков. Разбивка текста на
абзацы. Принудительные разрывы внутри текста, запрет разрывов.
2. Создание различных видов списков: нумерованные, маркированные, многоуровневые,
списки определений. Настройка параметров списка: изменение типа нумерации и
маркировки, изменение общей нумерации и внутри списка. Вставка изображений в
документ. Общие принципы. Дополнительные настройки. Включение обтекания
текстом. Создание гипертекстовых ссылок. Ссылка на другой документ, ее открытие в
том же или новом окне. Ссылка на почтовый ящик. Частичное заполнение письма с
помощью ссылки. Ссылка на раздел документа. Обращение по якорю или по
идентификатору тега.
3. Настройка тела документа. Параметры фона и текста, ссылок, отступов. Таблицы.
Базовые теги и их атрибуты. Оформление таблицы. Фон и рамки. Выравнивание.
Внутренние и внешние отступы. Объединение ячеек. Дополнительные теги.
Заголовочные ячейки. Группировка таблицы по строкам. Группировка таблицы по
столбцам. Применение таблицы, как базового каркаса при создании Интернетстраницы.
4. Общая информация о каскадных стилевых таблицах. Единицы измерения. Общий вид
стилевого определения. Размещение стилевых определений: как атрибут у
конкретного элемента, стилевой блок внутри заголовочного блока страницы,
вынесение стилевых определений в отдельный документ и создание ссылки на него.
Назначение стилей одному тегу, нескольким тегам, вложенным тегам (контекстное
определение), с помощью класса, по идентификатору. Свойства, управляющие
шрифтом: гарнитура, размер, полужирное и курсивное начертание, малые заглавные
буквы. Настройки фона: цвет, текстура, блокирование прокрутки, заполнение,
повторение.
5. Настройки текста: цвет, зачеркивание и подчеркивание, выравнивание,
межсимвольный интервал, интервал между словами, междустрочный интервал,
отступ первой строки, изменение регистра, сохранение разрывов строк и пробелов.
Дополнительные настройки для списков и таблиц. Внутренние и внешние отступы.
Обрамление. Управление размерами элементов. Добавление полос прокрутки.
Обтекание текстом. Относительное и абсолютное позиционирование. Координаты.
Изменение уровня (слоя). Изменение вида указателя мыши. Псевдостили и
Web-дизайн
4
Орехово-Зуевский учебный центр открытого обучения
псевдоэлементы. Принципы создания каркаса страницы с помощью контейнеров CSS.
(примеры на плавающих и абсолютно позиционированных блоках).
6. Новые свойства, появившиеся в CSS3: округление углов, тень блока и текста,
трансформирование и т.д. Нестандартные свойства. Примеры работы с конкретными
элементами страницы в CSS: выравнивание главного контейнера относительно окна,
совмещение рисованных и текстовых заголовков, создание горизонтального
выпадающего меню.
7. Основы языка программирования JavaScript. Понятие событий браузера. Общий вид
скриптового блока. Общий вид функции. Понятие переменных. Базовые
математические операторы. Сравнение. Обращение к элементам страницы по тегу и
номеру (индексу) элемента. Обращение по идентификатору. Изменение атрибутов
тегов и стилей CSS с помощью JavaScript.
Web-дизайн
5