Описание

Для кого этот курс

Для тех, кто хочет стать веб-разработчиком
Основная задача курса – подготовить вас к профессии. После обучения вы сможете найти работу и уже в рамках компании быстро развивать свои навыки

Для тех, кто хочет попробовать новую сферу
Веб-программирование остаётся одной из самых востребованных профессий и не собирается сдавать позиции. Это перспективная сфера, в которую ещё есть время попасть, чтобы успешно конкурировать на рынке труда

Актуальные знания в курсе

Вы научитесь

• HTML/HTML5, CSS/CSS3
• Сетевые технологии и протоколы TCP/IP, HTTP, HTTPS, FTP
• Многоколоночные макеты с flexbox
• Вёрстка адаптивных версий сайтов
• Анимация с помощью HTML5 и CSS3
• Основы JavaScript
• Фреймворк jQuery
• Основы PHP программирования
• Знание основ Adobe Photoshop/Figma для верстальщика

Мы провели аналитику вакансий и будем учить вас только тому, что нужно для трудоустройства

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

• Постановка личных целей на курс
• Типы сайтов, функциональность
• Этапы создания сайта, основные профессии индустрии
• Сетевые технологии и протоколы Интернета: TCP/IP, HTTP, HTTPS, FTP
• Хостинг и домен, система DNS
• Модель «Клиент и сервер»
• Роль браузера и редакторов кода
• Настройка рабочей области

• Знакомство с HTML: Понятие тега и атрибута
• Кодировка текста HTML
• Теги для формирования текста
• Гиперссылки и адреса файлов
• Якорные ссылки
• Ссылка на вызов и отправку email
• Таблицы в HTML
• Тег img и его атрибуты. Правила размещения картинок. Форматы изображений: какие выбрать

• Основы синтаксиса CSS
• Основные виды селекторов: идентификаторы, классы, псевдоклассы
• Баллы специфичности и приоритеты правил
• Каскад и наследование свойств
• Контекстный и универсальный селектор
• Свойства текста и шрифта в CSS
• Подключение внешних шрифтов
• Цвета HEX и RGB. Добавление однородного фона к элементам. Фоновая картинка для страницы, настройка фона

• Понятие блочных и строчных элементов
• Ключевые свойства блоков
• Как рассчитывается размер блока и box-sizing: border-box
• Что такое блочная модель
• Применение блоков для построения макета
• Строчно-блочные элементы
• Свойство display
• Устаревшие способы построение макета: знать, нельзя использовать

• Семантические теги для вёрстки макета
• Основы Flexbox: контейнеры и элементы
• Выравнивание элементов по основной и поперечной оси
• Смена осей и вертикальное выравнивание элементов
• Проблемы применения flexbox

• Работа с картинками: кадрирование, тримминг
• Сохранение: формат, качество, вес
• Как узнать код цвета
• Инструменты для работы со шрифтом
• Копирование готового CSS
• Измерение расстояний: инструменты, настройки
• Эффекты и их копирование
• Встраивание карт и видео

• Виды позиционирования: статическое, абсолютное, относительное, фиксированное
• Особенности разных видов позиционирования
• z-index и контекст наложения
• Когда и как использовать позиционирование
• Пример выпадающего многоуровневого меню
• Решение типовых задач с позиционированием

• Основные элементы формы: input, select, textarea, button
• Состояние полей и псевдоклассы
• Элементы выбора checkbox, radio, select
• Группировка элементов: fieldset и legend
• Стили для псевдоэлемента placeholder
• Правила написания стилей для форм
• Стилизация кнопок

• Понятие адаптивного и отзывчивого веб-дизайна
• Медиа-запросы
• Параметры области просмотра и тег Meta viewport
• Проблемы кроссбраузерной верстки
• Валидность кода, валидаторы
• Особенности многостраничных сайтов
• Правила вёрстки для seo-продвижения

• Плавные переходы для создания анимационных эффектов
• Анимация с помощью keyframes
• Трансформация элементов
• Добавление базовых элементов анимации на сайт

• Какие задачи решает JavaScript
• Основы программирования: переменные, условия, функции
• Внедрение скриптов на сайт для создания интерактивных элементов
• Знакомство с jQuery: когда он нужен, а когда нет
• Подключение плагинов: слайдер, галерея, всплывающие окна, аккордеон
• Работа с более сложными front-end технологий

• • Назначение серверных технологий
  • Локальный веб-сервер и домен
  • Создание динамических веб-страниц
  • Понятие CMS-систем
  • Размещение сайта на хостинге
  • Протокол FTP для загрузки файлов
  • Подведение итогов и завершение проекта

О Бруноям
Бруноям — это практический подход к образованию. Мы делаем курсы для тех, кто хочет получить новую профессию, сменить сферу деятельности или решить свою бизнес-задачу. На собеседовании стали спрашивать не наличие диплома, а навыки, которыми человек обладает. Мы в Бруноям как раз и даём те самые навыки и умения, которые позволяют попробовать себя в новой профессии или совершенствоваться. Мы делаем образование для тех, кто хочет и готов пробовать новое, меняться, искать себя и свою работу мечты