«WEB – ДИЗАЙН»

УЧЕБНАЯ ПРОГРАММА КУРСА

Объем - 32 академических часа

Разработанная программа обучения предназначена для базовой подготовки специалистов в области рекламы и дизайна, владеющего начальными навыками работы на персональном компьютере.

Предлагаемый курс обучения содержит разделы ознакомления с сетью Интернет через протоколы НТТР и FTP с помощью языка описания WEB-страниц (HTML). По мере изучения курса слушатели составляют собственный WEB-сайт в Интернете, обмениваются необходимой информацией, изучают основы рисунка и мультипликации.

Методы обучения основаны на активном вовлечении слушателей в учебный процесс с использованием качественных методических материалов. Занятия проходят в живой и непринужденной атмосфере творческого подъема в удобное для абитуриентов время. Квалифицированные преподаватели, имеющие большой опыт практической работы, подробно объясняют процесс подготовки графики в редакторе Photo Shop и основы программы Java Script.

В дальнейшем это позволит слушателям самостоятельно создавать презентационные сайты, разрабатывать Интернет-проекты и работать экспертами по поддержке WEВ-сайта. Освоив курс данной программы, который пользуется неизменной популярностью у слушателей, Вы сможете усовершенствовать свои знания, изучив следующую по сложности программу «WEB-мастеринг».

По окончании обучения выпускники получают свидетельство установленного образца и могут трудоустроиться в рекламные агентства, отделы по развитию информационных технологий крупных компаний и холдингов, дизайн-студии по следующим специальностям: «WEB-дизайнер», «разработчик Интернет-проектов», «эксперт по разработке и поддержке WEB-сайта».

1. Основные понятия.

• 1.1. Дизайн в Internet: задачи, подходы, решения. Основные понятия и терминология.
• 1.2. Этапы разработки WEB-сайта. Уменьшение затрат ресурсов и сроков создания WEB-сайта. Основные формулировки в техническом задании на разработку сайта.
• 1.3. Возможности современных программ, используемых для создания WEB-страниц. Обзор программ Macromedia DreamWeaver, HomeSite и Microsoft FrontPage.
• 1.4. Основные возможности программы DreamWeaver. Задание цветового оформления. Выбор цветовой схемы.
• 1.5. Создание и использование каскадных таблиц стилей CSS. Практическая работа. Создание макета сайта в программе DreamWeaver.

2. Разработка информационной архитектуры.

• 2.1. Элементы информационной архитектуры.
• 2.2. Распределение информации по разделам сайта с учетом информационной, логической и визуальной взаимосвязи между разделами.
• 2.3. Основные компоненты WEB-страницы и способы их визуального представления на страницах сайта.
• 2.4. Разработка простого макета страницы и линейной системы навигации.
• 2.5. Использование шаблонов (templates) в DreamWeaver: создание шаблонов, применение к готовым страницам, модификация шаблонов.

Практическая работа. Создание сайта с линейной системой навигации с использованием шаблонов.

3. Эргономика WEB-сайта.

• 3.1. Эргономика сайта (web-usability). Факторы, которые затрудняют и факторы, которые облегчают восприятие пользователем информации на сайте.
• 3.2. Макетирование в WEB. Приемы макетирования. Создание фиксированных и адаптируемых страниц. Размещение информации на странице с учетом решаемых задач. Примеры удачных и неудачных решений.
• 3.3. Система навигации на сайте. Принципы построения системы навигации. Создание навигационных палитр.

Практическая работа. Создание сайта с двухуровневой системой навигации. Создание адаптируемого макета.

4. Подготовка иллюстраций для WEB.

• 4.1. Требования к иллюстрациям в Internet. Обзор форматов иллюстраций JPEG, GIF, PNG, SWF, SVG.
• 4.2. Подготовка графики в программах Adobe PhotoShop, Adobe ImageReady и Macromedia Fireworks. Способы уменьшения объема файла.
• 4.3. Использование коллекций изображений (clipart) векторных графических редакторов на примере CorelDraw.
• 4.4. Подготовка изображений, имеющих прозрачные области. Представление текстовой информации.

Практическая работа. Оптимизация заданных изображений и заготовок из Clipart. Размещение их на WEB-страницах.

5. Подготовка графических элементов.

• 5.1. Создание кнопок. Имитация различных состояний кнопки.
• 5.2. Создание фоновых иллюстраций. Техника создания бесшовных узоров в программах Adobe PhotoShop и Adobe ImageReady.
• 5.3. «Нарезка» изображений на фрагменты в программе Adobe ImageReady. Оптимизация фрагментов изображений.

Практическая работа. Добавление кнопок и фоновых элементов.

6. Gif-анимация и баннеры. Карта изображения ImageMap.

• 6.1. Что такое GIF-анимация. Способы создания и параметры анимации. Способы уменьшения объема файла.
• 6.2. Использование Adobe ImageReady и Ulead GifAnimator для создания gif-анимации. Преобразование в GIF-анимацию файлов двухмерной и трехмерной графики.
• 6.3. Баннеры: параметры, размещение на WEB-странице. Разработка сюжета баннера.
• 6.4. Использование GIF-анимации и роликов FLASH в баннерной рекламе. Воздействие баннерной рекламы на пользователя.
• 6.5. Применение карт изображений ImageMap в WEB-дизайне.

Практическая работа: создание баннеров.

7. Создание динамических элементов в DreamWeaver.

• 7.1. Основные сведения о программе DreamWeaver
• 7.2. Назначение палитр Behaviors и TimeLine.
• 7.3. Управление параметрами элементов в DreamWeaver. Обработка событий.
• 7.4. Типовые операции (модальные окна, открытие новых окон и управление ими), проверка данных формы, управление видимостью и содержанием слоев, проверка броузера.
• 7.5. Сложные операции: создание раскрывающихся меню, анимация слоев, создание эффекта «rollover».
• 7.6. Использование возможностей Macromedia Flash.

Практическая работа: создание эффекта «rollover» для кнопок.

8. Оценка сайта. Тестирование сайта.

• 8.1. Критерии оценок созданного сайта.
• 8.2. Способы снижения визуального шума и повышения четкости подачи материала.
• 8.3. Этапы стандартного тестирования сайта.
• 8.4. Методика тестирования сайта на аудитории. Выработка предложений по редизайну и обоснование необходимости редизайна.
• 8.5. Обзор ресурсов, связанных с вопросами WEB-дизайна и WEB-usability.

Практическая работа: выполнение тестирования заданного сайта и выработка предложений по редизайну.

Зачет (собеседование).