HTML & CSS

Описание курса

Курс HTML/CSS —  это обучение работе с языком разметки веб-страниц. Программа предназначена для новичков, которые желают изучить основы работы с front-end разработкой.

 

На курсе вы сможете освоить HTML с нуля: ознакомиться с теоретическими основами верстки и структурой HTML документа, порядком публикации документов в web и сможете создавать полноценные страницы. HTML для начинающих является базисом для веб-разработчиков, а после его изучения уже можно начинать работать над реальными проектами. Уже первый урок даст возможность попрактиковаться в создании несложных HTML-страниц, работе с мультимедиа и таблицами стилей CSS.

 

После курса ты сможешь верстать простые страницы, работать с различными элементами HTML и ориентироваться в инструментах WordPress. Ты будешь понимать обязательную структуру веб-страницы и работать с разными видами верстки.

После курса вы сможете:

• Создавать веб страницы;
• Наполнять их содержимым (текстом, ссылками,спецсимволами, изображениями, фонами, подключать иконочные и обычные шрифты и тд );
• Добавлять стили всем элементам веб страницы;
• Выгружать сайты на хостинг;
• Понимать и разбираться в адаптивной, кроссбраузерной, попиксельной, резиновой, cмешаной и статичной верстками;
• Работать с WORDPRESS (Создавать и подключать базу данных к WP, загружать темы и работать с плагинами);
• Сверстать одностраничный сайт и выгрузить его на хостинг для общего доступа пользователей по ссылке.

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

• 1. Введение в веб-технологии
  • Предназначение технологий
  • Стек разработки для сайта
  • Принцип работы «клиент-сервер»
  • Консоль разработчика
  • Текстовый редактор и IDE
  • Что такое HTML, CSS, JS и их взаимодействие
• 2. HTML
  • Базовые принципы верстки
  •  Знакомство с понятием тега и атрибута
  •  Обязательная структура любой веб-страницы
  •  Понятия строчных и блочных элементов веб страницы
  •  Понятия парных и непарных тегов;
  •  Семантические теги
  •  Спецсимволы
  •  Работа с тегами и атрибутами
  •  Работа с ссылками и якорями
  •  Работа с текстом и комментариями
  •  Работа с различными системами цветов в HTML
  •  Работа с изображениями
  •  Нумерованные и маркированные списки
  •  Работа с блоками (div)
  •  Таблицы
  •  Формы
  •  Элементы форм (инпуты)
  •  Айфреймы
  •  Подключение разных модулей к документу HTML
  • Форматирование элементов HTML
• 3. CSS
  •  Что такое CSS?
  •  Базовые принципы написания стилей
  •  3 способа добавления CSS на HTML-страницу
  •  Внешние таблицы стилей
  •  Относительные и статичные единицы измерения
  •  Работа со шрифтами (семейства, стили, размеры, насыщенность)
  •  Работа с границами элементов (бордер, радиус, тени)
  •  Работа с отступами и размерами элементов
  •  Градиенты
  •  Работа со свойствами float и clear
  •  Flex box
  •  Работа с фоном (изображения и цвет, размеры, прозрачность)
  •  Селекторы
  •  Продвинутые селекторы
  •  Приоритеты стилей
  •  Перезапись стилей
  •  Псевдоклассы, псевдоэлементы
  •  Работа с анимацией элементов
  •  Валидация
  •  Медиазапросы
• 4. Работа с браузером
  • Установка полезных расширений для верстки
  • Отладчик кода
• 5. Хостинговые и доменные панели
  • Работа с Git и хостинг на Git
• 6. Разные виды верстки
  • Адаптивная верстка
  • Резиновая верстка
  • Pixel perfect верстка
  • Статичная верстка
  • Кроссбраузерная верстка
  • Смешанная верстка
• 7. Figma для разработчика
  • Понятие растровой и векторной графики
  • Преимущества и особенности Figma
  • Обзор панелей и инструментов
  • Сетки
  • Слои и компоненты
  • Экспорт параметров и графики
  • Редактирование элементов
• 8. Grid Layout
  • Построение сетки
  • Работа с горизонтальным и вертикальным выравниванием
  • Объединение элементов
  • Методы работы с ячейками
• 9. Правила именования классов по BEM
• 10. Библиотека Bootstrap
• 11. SASS
  • Подключение
  • Правила и дерективы
  • Управляющие директивы и выражения
  • Использование миксинов
  • Применение на практике

Минимальные требования:

• Наличие собственного ноутбука для занятий в аудиториях
• Установленные Sublime Text, Figma и файловый менеджер

* Указанные скидки не суммируются с другими действующими акциями и специальными предложениями. Если у Вас возникли вопросы, обращайтесь за консультацией к нашим менеджерам!