Графический дизайн и верстка страниц

Модуль 1. Практическое занятие на определение стартового уровня владения компетенцией

Модуль 2. Программное обеспечение для разработки растровой и векторной графики

2.1 Интерфейс программы. Панели инструментов. Слои. История. Навигация. Цвета

2.2 Работа с изображениями: наложение изображений, добавление маски, трансформация. Создание коллажей. Фотомонтаж. Корректировка цифровых фотографий. Создание текстовых объектов. Текстовые эффекты. Текстовый дизайн

2.3 Создание оригинал-макета сайта. Сохранение изображений в растровые форматы

Модуль 3. Разработка дизайна готовой веб-страницы в программе растровой графики

3.1 Создание блоков сайта

3.2 Добавление hover эффектов в макет

3.3 Создание остальных страниц сайта по шаблону

3.4 Создание адаптивной версии страницы сайта под экран планшета

3.5 Создание адаптивной версии страницы сайта под экран мобильного телефона

Модуль 4. Создание дизайна в графической программе

4.1 Работа с сервисом для создания wireframe сайта

4.2 Создание шапки сайта. Создание основной части сайта. Основные блоки в макете. Меню. Создание «подвала» сайта

4.3 Добавление hover эффектов в макет

4.4 Создание остальных страниц сайта по шаблону

4.5 Создание адаптивной версии страницы сайта под экран планшета, мобильного телефона

Модуль 5. Создание HTML страницы с применением каскадных таблиц стилей CSS

5.1 Общие сведения об HTML

5.2 Стандартная структура html документа.

5.3 Верстка шапки сайта и заголовка

5.4 Создание  html-страниц  сайта  на  основе  предоставленных  графических  макетов  их Дизайна

5.5 Верстка подвала сайта

5.6 Мобильная версия сайта

5.7 Встраивание  и  интеграция  анимации,  аудио,  видео  и  другой  мультимедийной информации, управление поведением остальных элементов на страниц

5.8 Применение  соответствующих  CSS  правил  и  селекторов  для  получения  ожидаемого результата

5.9 Корректное использование CSS для обеспечения единого дизайна в разных браузерах.

6. Итоговая аттестация