Верстка web-страниц: HTML и CSS

 

Код курса: 005-1.

Продолжительность обучения: 40 уч. часов.

Сроки проведения: по мере поступления заявок.

 

Курс предназначен для разработчиков web-ресурсов, web-дизайнеров, HTML-верстальщиков и других специалистов в области Internet-технологий.

Курс обеспечивает необходимый объем теоретических знаний и практических навыков по использованию базовых технологий HTML и CSS. Эти технологии лежат в основе разработки web-ресурсов, отвечающих требованиям соответствия спецификациям и корректного представления различными браузерами. Уделяется внимание новым возможностям HTML5 и CSS3. Изучаются приемы подготовки изображений для web-страниц в Adobe Photoshop.

Для успешного освоения материала необходима предварительная подготовка:

  • знания в области дизайна;
  • базовые знания и навыки работы на ПК в среде Windows;
  • основы работы в Adobe Photoshop.

Программа курса:

1.  Основные положения языка HTML. Структура HTML-документа
1.1. HTML как основа web-технологий
1.2. История HTML. W3C. Спецификации HTML
1.3. Теги, параметры, значения. Основные правила синтаксиса
1.4. Заголовок и «тело» web-документа
1.5. DOCTYPE
1.6. Проверка валидности HTML-документов
2. Раздел HEAD. Элемент META
2.1. Назначение раздела HEAD
2.2. Элемент TITLE
2.3. Обзор тегов в заголовке типичного HTML-документа
2.4. Примеры META-тегов
3. Теги физического и логического форматирования текста. Элементы блочной и строчной разметки
3.1. Размещение текста в документе
3.2. Разметка абзацев и заголовков
3.3. Теги физического форматирования текста
3.4. Теги логического форматирования текста
3.5. Специальные символы
3.6. Элементы блочной и строчной разметки. Корректность вложения тегов
3.7. Создание web-страницы в текстовом редакторе
4. Использование Adobe Dreamweaver для создания и редактирования HTML-документов
4.1. Создание нового HTML-документа с помощью Adobe Dreamweaver
4.2. Панели инструментов, палитры и настройки Adobe Dreamweaver для создания HTML-документов
4.3. Приемы форматирования текста в Adobe Dreamweaver
5. Каскадные таблицы стилей (CSS)
5.1. Основные цели и задачи CSS. Спецификации CSS. Способы встраивания таблиц стилей в документ
5.2. Способы определения стилей. Правила и свойства CSS
5.3. Классы. Универсальные классы
5.4. Каскадирование и наследование
5.5. Основные типы селекторов
5.6. Псевдоклассы и псевдоэлементы
5.7. Свойства шрифтов
5.8. Свойства текста
5.9. Свойства цвета и фона
5.10. Использование Adobe Dreamweaver для создания и редактирования стилей
6. Гиперссылки
6.1. Создание гиперссылок. URL ссылки. Относительные и абсолютные URL
6.2. Внутренние гиперссылки документа
6.3. Отображение документа ссылки в новом окне
6.4. Ссылки на файлы различных типов
6.5. Ссылки на различные ресурсы Internet
6.6. Создание начальной страницы сайта и ссылок на внутренние страницы сайта
6.7. Форматирование ссылок с помощью CSS. Псевдоклассы
7. Изображения. Элемент IMG
7.1. Размещение изображений в HTML-документе
7.2. Атрибуты тега IMG. Варианты размещения изображения относительно текста
7.3. Обтекание изображений текстом
7.4. Прерывание обтекания
7.5. Изображения-ссылки
7.6. Свойства CSS для изображений
7.7. Спрайты и ролловеры
8. Использование Adobe Photoshop для оптимизации изображений и нарезки фрагментов
8.1. Изменение размера, обрезка изображения
8.2. Сохранение и оптимизация изображений для Web
8.3. Создание изображения кнопки
8.4. Анализ графического макета страницы. Установка направляющих в соответствии с планируемой разрезкой макета
8.5. Разметка фрагментов с помощью инструмента Slice Tool
8.6. Сохранение фрагментов графического макета
9. Списки маркированные, нумерованные, списки определений
9.1. Создание маркированных списков
9.2. Создание нумерованных списков
9.3. Списки определений
9.4. Многоуровневые списки
9.5. Свойства CSS для списков
10. Таблицы
10.1. Основные элементы таблицы
10.2. Заголовок таблицы
10.3. Объединение ячеек таблицы
10.4. Логические группы ячеек в таблицах
10.5. Форматирование таблиц средствами CSS
10.6. Понятие о табличной верстке
11. Свойства CSS для макетирования
11.1. Свойство POSITION
11.2. Свойство DISPLAY
11.3. Управление размерами, границами, местоположением блоков
11.4. Видимость элемента
11.5. Переполнение блока: свойство OVERFLOW
11.6. Плавающие элементы
11.7. Элементы HTML5 для макетирования: секции, выноски, статьи, навигационные, «шапка», «подвал»
12. Макеты страниц
12.1. Макеты с фиксированной шириной блоков
12.2. Разработка «резиновых» макетов
12.3. Центрирование
12.4. Понятие о фреймах. Плавающий фрейм
13. Использование свойств CSS3
13.1. Медиа-запросы (построение мобильных версий сайтов, адаптивная верстка)
13.2. Многоколоночная верстка
13.3. Новые свойства фона, градиенты
13.4. Скругление углов
13.5. Анимация, трансформация (2D и 3D), переходы
14. Формы
14.1. Элемент FORM и его атрибуты. Методы отправки информации на сервер
14.2. Многострочное текстовое поле
14.3. Элемент INPUT. Атрибуты элемента INPUT
14.4. Создание полей выбора из списка. Элемент SELECT
14.5. Применение CSS к элементам форм
14.6. Почтовые формы
14.7. Новые элементы форм HTML5
15. Размещение сайта в Internet
15.1. Вопросы хостинга
15.2. Размещение сайта на сервере
 

Поиск курса

Бронирование курса

Если у Вас не получается отправить форму - напишите нам на почту training@muk.by.