Создание сайтов на HTML5 и CSS3 «Zaman»

compare_arrows

1. Введение и основные понятия. Анатомия страницы. 

• - Вступление. 
• - Кто такой веб-дизайнер. Что необходимо знать для успешной работы в этой профессии. 
• - Классификация веб-сайтов. Статические и динамические сайты. 
• - Способы создания веб-сайтов: верстка на языке HTML5, использование редактора, CMS, популярные сайты-конструкторы. 
• - Программы для работы с кодом HTML5. Виды и применение. 
• - Работа в визуальных редакторах типа WYSIWYG. 
• - Что такое WorldWideWeb. Виды языков гипертекстовой разметки. Знакомство с языком HTML. Версии и стандарты языка HTML. Последняя версия HTML 5 и её преимущества. 
• - Обзор программ (браузеров) для просмотра веб-сайтов. Их сходства и отличия. Война браузеров. 
• - Корневая папка сайта. Почему важно хранить все файлы сайта в одной папке. Что такое главная страница и её роль в построении сайта. 
• - Команды HTML5. Виды тегов. 
• - Создание страницы сайта. Структура страницы HTML5. Теги, обязательные для создания сайта. Объявление типа документа. 
• - Служебная и основная части страницы HTML5. Объявление темы (заголовка) страницы. 
• - Теги блочной верстки. Работа с текстом. Создание заголовков текста и их назначение. Создание абзацев. Перенос текста. 
• - Теги форматирования. Размер и имя шрифта. 
• - Что такое CSS. Стили CSS3 для форматирования текста. Внедрение стилей CSS3 в теги HTML5. 
• - Управление цветом в HTML5. Заливка. 
• - Создание горизонтальной линии. 
• - Практическая работа. 
• - Рекомендуемая литература по теме. 
• 
  

2. Списки. Изображения. Гиперссылки. 

• - Создание списков. Нумерованный и маркированный списки. 
• - Работа с изображениями. Виды и типы изображений, используемые в WWW. Программы для создания и подготовки изображений. 
• - Оптимизация размера изображений. 
• - Позиционирование изображений на странице сайта. 
• - Теги HTML5 для вставки изображений. 
• - Создание рамок и полей для изображений, страниц и блоков текста. 
• - Параметры и свойства для форматирования изображений. 
• - Гиперссылки и их виды. 
• - Теги HTML5 для создания гиперссылки. 
• - Особенности написания url – адреса в тегах. Картинки – гиперссылки. Гиперссылки для отправки электронной почты. 
• - Способы открытия гиперссылок в окнах. 
• - Свойства и параметры гиперссылок. 
• - Абсолютная и относительная адресация. 
• - Создание оглавления для перехода к различным частям одной страницы. Создание быстрой прокрутки в верхнюю часть страницы. 
• - Установка плавающих фреймов на странице. 
• - Практическая работа. 
• - Рекомендуемая литература по теме. 
• 
  

3. Таблицы. Формы. 

• - Создание таблиц, их роль в управлении тегами и текстом. 
• - Строки и столбцы таблиц. 
• - Параметры и свойства тегов для управления таблицей, столбцами и строками. 
• - Абсолютные и относительные размеры таблиц. 
• - Таблица внутри таблицы. Добавление в таблицы текста и изображений. 
• - Объединение ячеек таблицы. 
• - Способы группировки столбцов и строк. Стили CSS3, применяемые к группам столбцов и строк. 
• - Управление границами таблицы. 
• - Формы для введения пользователями информации на сайте. Их создание. 
• - Теги и параметры для создания форм. 
• - Взаимодействие форм с таблицами. 
• - Виды форм: многострочные и однострочные поля, списки, кнопки, переключатели и др. 
• - Надписи. 
• - Новые формы в HTML5. Особенности их отображения в различных браузерах. 
• - Проверка полей, обязательных для заполнения. 
• - Активные и неактивные поля. 
• - Взаимодействие работы веб-дизайнера и веб-программиста для создания HTML-форм. 
• - Практическая работа. 
• - Рекомендуемая литература по теме. 

4. Каскадные таблицы стилей: основные свойства 

• - Основные понятия CSS. 
• - Способы определения стилей. 
• - Каскадирование и наследование. 
• - Единицы измерения в CSS3. 
• - Основные типы селекторов. 
• - Свойства шрифтов. 
• - Свойства текста. 
• - Свойства цвета и фона. 
• - Оформление границ элемента 
• - Внутренние отступы элемента 
• - Наружные отступы элемента 
• - Практическая работа. 
• - Рекомендуемая литература по теме. 

5. Использование CSS3 для макетирования, создания плавающих окно, раскрывающихся списков, меню. 

• - Оформление фрагментов текста с помощью CSS3. 
• - Абсолютное и относительное позиционирование элементов на странице. 
• - Размеры элемента. Абсолютные и относительные размеры. 
• - Сочетание позиционирования и трёхмерности в CSS3. 
• - Псевдоклассы и псевдоэлементы в CSS3. 
• - Параметры наведения для гиперссылок. 
• - Создание декоративных эффектов в HTML5 (прозрачность, градиенты, скругленные уголки, тени, проч. возможности). 
• - Плавающие элементы. Обтекание элементов. 
• - Практическая работа. 
• - Рекомендуемая литература по теме. 

6. Верстка сайта с помощью HTML5. 

• - Создание макета сайта. Виды макетов. 
• - Фиксированные и резиновые макеты. 
• - Юзабилити. 
• - Семантические теги HTML5, упрощающие верстку макетов. 
• - Верстка трёх-колоночного макета сайта. 
• - Создание верхней части страницы: логотип, панель навигации. 
• - Создание правого и левого блоков сайта. Размещение ленты новостей в правом блоке. Размещение навигации и рекламных ссылок в левом блоке. 
• - Формирование центральной части сайта, добавление контента. 
• - Создание нижней части сайта. Добавление информации об авторских правах на сайт. 
• - Где взять готовые шаблоны сайтов. 
• - Как создать красивое раскрывающееся меню со ссылками онлайн. 
• - Практическая работа. 
• - Рекомендуемая литература по теме. 

7. Анимация в CSS3. 

• - Знакомство с анимацией в CSS3. Возможности CSS3 в создании анимации. 
• - Ключевые кадры. 
• - Особенности построения ключевых кадров. 
• - Имя анимации. 
• - Количество повторов и зацикливание анимации. 
• - Время проигрывания анимации. 
• - Задержка в проигрывании анимации. 
• - Способы проигрывания анимации (с конца, линейное, с замедлением, с ускорением). 
• - Вращение в анимации. 
• - Различные эффекты и способы анимации. 
• - Практическая работа. 
• - Рекомендуемая литература по теме. 

8. Вставка в страницу элементов видео- и аудио-записи. Выгрузка сайта в Интернет. Кроссбраузерность 

• - Теги для вставки на страницу сайта аудио- и видео- контента. 
• - Понятие и использование кроссбраузерности сайта 
• - Использование мета-информации. 
• - Элемент meta и его атрибуты. 
• - Поясняющая мета-информация. 
• - Мета-информация для роботов. 
• - Эмуляция заголовков ответа сервера. 
• - Понятие доменного имени. Покупка доменного имени. 
• - Понятие хостинга. 
• - Поиск хостера. 
• - Услуги хостера. 
• - Использование FTP-клиента 
• - Доступ к ftp-серверу. 
• - Полезная информация для «раскрутки» сайта. 
• - Практическая работа. 
• - Рекомендуемая литература по теме.