Web-дизайн для школьников
Результат / будет знать, уметь
- верстать сайты с помощью HTML и CSS
- обрабатывать графические изображения при помощи Photoshop
- встраивать изображения на сайт слайдеры и галереи
- выкладывать сайт на хостинг
Контакты
Программа
Раздел 1. Язык разметки гипертекста HTML
Введение в HTML:
– общие понятия
– структура HTML-документа
– понятие тега
Оформление текста:
– формирование абзацев и заголовков
– работа со шрифтами
Списки:
– концепция списков в HTML
– нумерованные списки
– маркированные списки
– параметры элемента списка
– многоуровневые списки
– списки определений
Графика на web-странице:
– характеристика графических стандартов
– вставка графики в HTML-документ
– описание графики в HTML-документе
– параметры тега <img>
– карты-изображения
Гипертекстовые ссылки:
– создание ссылок
– закладки
– ссылки-изображения
– простое меню. Иерархия.
Таблицы:
– создание таблиц
– создание сложных таблиц
– оформление таблиц
– вложенные таблицы.
Формы:
– структура пользовательских форм
– элементы форм и их связь с языками программирования
META-теги. DOCTYPE:
– Создание и типы META-тегов
Раздел 2. Каскадные таблицы стилей (Cascading Style Sheets, CSS)
Введение в CSS:
– принцип работы CSS
– подключение и 3 базовых селектора
Сложные селекторы:
– групповые селекторы
– селекторы потомков
– псевдоселекторы ссылок
Работа со шрифтами в CSS:
– семейство шрифтов
– размер шрифта
– жирный, курсив, подчеркивание
Оформление текста:
– выравнивание и красная строка
– высота строки, расстояние между строками. Сокращенная запись.
– рамки. Работа со списками.
Блочная модель:
– margin и padding
– ширина и высота блока, выравнивание
– блочные и встроенные элементы
Фоновый цвет и изображение:
– повтор фонового изображения
– позиционирование фонового изображения. Фиксация фона.
– краткая запись фоновых свойств
Свойство float:
– создание простого каркаса на основе float. Очистка обтекания.
– видимость элементов
Типы версток.
– табличная верстка
– блочная верстка. Другие виды версток.
– позиционирование (введение)
– абсолютное позиционирование
– относительное позиционирование
– фиксированное позиционирование
Хостинг, поддержка сайта.
Раздел 3. Графический пакет Photoshop
Работа с макетом сайта.
– создание и редактирование текста
– добавление графики
– нарезка макета на отдельные элементы веб-страницы
Характеристики, актуальность курса, программа могут меняться, поэтому всю необходимую информацию всегда уточняйте у организаторов. Нажмите, чтобы писать о неактуальной информации.