Орехово-Зуевский учебный центр открытого обучения РАССМОТРЕНО методической комиссией Орехово-Зуевского учебного центра открытого обучения Протокол № 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