- Регистрация
- 26.05.2022
- Сообщения
- 26 711
- Реакции
- 180
- Баллы
- 63
Для кого этот курс
Для тех, кто хочет стать веб-разработчиком
Основная задача курса - подготовить вас к профессии. После обучения вы сможете найти работу и уже в рамках компании быстро развивать свои навыки
Для тех, кто хочет попробовать новую сферу
Веб-программирование остаётся одной из самых востребованных профессий и не собирается сдавать позиции. Это перспективная сфера, в которую ещё есть время попасть, чтобы успешно конкурировать на рынке труда
Актуальные знания в курсе
Вы научитесь
HTML/HTML5, CSS/CSS3
Сетевые технологии и протоколы TCP/IP, HTTP, HTTPS, FTP
Многоколоночные макеты с flexbox
Вёрстка адаптивных версий сайтов
Анимация с помощью HTML5 и CSS3
Основы JavaScript
Фреймворк jQuery
Основы PHP программирования
Знание основ Adobe Photoshop/Figma для верстальщика
Мы провели аналитику вакансий и будем учить вас только тому, что нужно для трудоустройства
Программа курса
1 БЛОК: Основы веб-технологий
Постановка личных целей на курс
Типы сайтов, функциональность
Этапы создания сайта, основные профессии индустрии
Сетевые технологии и протоколы Интернета: TCP/IP, HTTP, HTTPS, FTP
Хостинг и домен, система DNS
Модель «Клиент и сервер»
Роль браузера и редакторов кода
Настройка рабочей области
2 БЛОК: Знакомство с HTML
Знакомство с HTML: Понятие тега и атрибута
Кодировка текста HTML
Теги для формирования текста
Гиперссылки и адреса файлов
Якорные ссылки
Ссылка на вызов и отправку email
Таблицы в HTML
Тег img и его атрибуты. Правила размещения картинок. Форматы изображений: какие выбрать
3 БЛОК: Модуль: погружение в CSS
Основы синтаксиса CSS
Основные виды селекторов: идентификаторы, классы, псевдоклассы
Баллы специфичности и приоритеты правил
Каскад и наследование свойств
Контекстный и универсальный селектор
Свойства текста и шрифта в CSS
Подключение внешних шрифтов
Цвета HEX и RGB. Добавление однородного фона к элементам. Фоновая картинка для страницы, настройка фона
4 БЛОК: Блочная модель и макет веб-страницы
Понятие блочных и строчных элементов
Ключевые свойства блоков
Как рассчитывается размер блока и box-sizing: border-box
Что такое блочная модель
Применение блоков для построения макета
Строчно-блочные элементы
Свойство display
Устаревшие способы построение макета: знать, нельзя использовать
5 БЛОК: Многоколоночные макеты с Flexbox
Семантические теги для вёрстки макета
Основы Flexbox: контейнеры и элементы
Выравнивание элементов по основной и поперечной оси
Смена осей и вертикальное выравнивание элементов
Проблемы применения flexbox
6 БЛОК: Основы Adobe Photoshop для верстальщика
Работа с картинками: кадрирование, тримминг
Сохранение: формат, качество, вес
Как узнать код цвета
Инструменты для работы со шрифтом
Копирование готового CSS
Измерение расстояний: инструменты, настройки
Эффекты и их копирование
Встраивание карт и видео
7 БЛОК: Позиционирование
Виды позиционирования: статическое, абсолютное, относительное, фиксированное
Особенности разных видов позиционирования
z-index и контекст наложения
Когда и как использовать позиционирование
Пример выпадающего многоуровневого меню
Решение типовых задач с позиционированием
8 БЛОК: Формы обратной связи
Основные элементы формы: input, select, textarea, button
Состояние полей и псевдоклассы
Элементы выбора checkbox, radio, select
Группировка элементов: fieldset и legend
Стили для псевдоэлемента placeholder
Правила написания стилей для форм
Стилизация кнопок
9 БЛОК: Отзывчивый и адаптивный веб-дизайн
Понятие адаптивного и отзывчивого веб-дизайна
Медиа-запросы
Параметры области просмотра и тег Meta viewport
Проблемы кроссбраузерной верстки
Валидность кода, валидаторы
Особенности многостраничных сайтов
Правила вёрстки для seo-продвижения
10 БЛОК: Анимация с помощью HTML5 и CSS3
Плавные переходы для создания анимационных эффектов
Анимация с помощью keyframes
Трансформация элементов
Добавление базовых элементов анимации на сайт
11 БЛОК: Основы JavaScript и jQuery
Какие задачи решает JavaScript
Основы программирования: переменные, условия, функции
Внедрение скриптов на сайт для создания интерактивных элементов
Знакомство с jQuery: когда он нужен, а когда нет
Подключение плагинов: слайдер, галерея, всплывающие окна, аккордеон
Работа с более сложными front-end технологий
12 БЛОК: Основы PHP-программирования
Назначение серверных технологий
Локальный веб-сервер и домен
Создание динамических веб-страниц
Понятие CMS-систем
Размещение сайта на хостинге
Протокол FTP для загрузки файлов
Подведение итогов и завершение проекта
О Бруноям
Бруноям — это практический подход к образованию. Мы делаем курсы для тех, кто хочет получить новую профессию, сменить сферу деятельности или решить свою бизнес-задачу. На собеседовании стали спрашивать не наличие диплома, а навыки, которыми человек обладает. Мы в Бруноям как раз и даём те самые навыки и умения, которые позволяют попробовать себя в новой профессии или совершенствоваться. Мы делаем образование для тех, кто хочет и готов пробовать новое, меняться, искать себя и свою работу мечты
Для тех, кто хочет стать веб-разработчиком
Основная задача курса - подготовить вас к профессии. После обучения вы сможете найти работу и уже в рамках компании быстро развивать свои навыки
Для тех, кто хочет попробовать новую сферу
Веб-программирование остаётся одной из самых востребованных профессий и не собирается сдавать позиции. Это перспективная сфера, в которую ещё есть время попасть, чтобы успешно конкурировать на рынке труда
Актуальные знания в курсе
Вы научитесь
HTML/HTML5, CSS/CSS3
Сетевые технологии и протоколы TCP/IP, HTTP, HTTPS, FTP
Многоколоночные макеты с flexbox
Вёрстка адаптивных версий сайтов
Анимация с помощью HTML5 и CSS3
Основы JavaScript
Фреймворк jQuery
Основы PHP программирования
Знание основ Adobe Photoshop/Figma для верстальщика
Мы провели аналитику вакансий и будем учить вас только тому, что нужно для трудоустройства
Программа курса
1 БЛОК: Основы веб-технологий
Постановка личных целей на курс
Типы сайтов, функциональность
Этапы создания сайта, основные профессии индустрии
Сетевые технологии и протоколы Интернета: TCP/IP, HTTP, HTTPS, FTP
Хостинг и домен, система DNS
Модель «Клиент и сервер»
Роль браузера и редакторов кода
Настройка рабочей области
2 БЛОК: Знакомство с HTML
Знакомство с HTML: Понятие тега и атрибута
Кодировка текста HTML
Теги для формирования текста
Гиперссылки и адреса файлов
Якорные ссылки
Ссылка на вызов и отправку email
Таблицы в HTML
Тег img и его атрибуты. Правила размещения картинок. Форматы изображений: какие выбрать
3 БЛОК: Модуль: погружение в CSS
Основы синтаксиса CSS
Основные виды селекторов: идентификаторы, классы, псевдоклассы
Баллы специфичности и приоритеты правил
Каскад и наследование свойств
Контекстный и универсальный селектор
Свойства текста и шрифта в CSS
Подключение внешних шрифтов
Цвета HEX и RGB. Добавление однородного фона к элементам. Фоновая картинка для страницы, настройка фона
4 БЛОК: Блочная модель и макет веб-страницы
Понятие блочных и строчных элементов
Ключевые свойства блоков
Как рассчитывается размер блока и box-sizing: border-box
Что такое блочная модель
Применение блоков для построения макета
Строчно-блочные элементы
Свойство display
Устаревшие способы построение макета: знать, нельзя использовать
5 БЛОК: Многоколоночные макеты с Flexbox
Семантические теги для вёрстки макета
Основы Flexbox: контейнеры и элементы
Выравнивание элементов по основной и поперечной оси
Смена осей и вертикальное выравнивание элементов
Проблемы применения flexbox
6 БЛОК: Основы Adobe Photoshop для верстальщика
Работа с картинками: кадрирование, тримминг
Сохранение: формат, качество, вес
Как узнать код цвета
Инструменты для работы со шрифтом
Копирование готового CSS
Измерение расстояний: инструменты, настройки
Эффекты и их копирование
Встраивание карт и видео
7 БЛОК: Позиционирование
Виды позиционирования: статическое, абсолютное, относительное, фиксированное
Особенности разных видов позиционирования
z-index и контекст наложения
Когда и как использовать позиционирование
Пример выпадающего многоуровневого меню
Решение типовых задач с позиционированием
8 БЛОК: Формы обратной связи
Основные элементы формы: input, select, textarea, button
Состояние полей и псевдоклассы
Элементы выбора checkbox, radio, select
Группировка элементов: fieldset и legend
Стили для псевдоэлемента placeholder
Правила написания стилей для форм
Стилизация кнопок
9 БЛОК: Отзывчивый и адаптивный веб-дизайн
Понятие адаптивного и отзывчивого веб-дизайна
Медиа-запросы
Параметры области просмотра и тег Meta viewport
Проблемы кроссбраузерной верстки
Валидность кода, валидаторы
Особенности многостраничных сайтов
Правила вёрстки для seo-продвижения
10 БЛОК: Анимация с помощью HTML5 и CSS3
Плавные переходы для создания анимационных эффектов
Анимация с помощью keyframes
Трансформация элементов
Добавление базовых элементов анимации на сайт
11 БЛОК: Основы JavaScript и jQuery
Какие задачи решает JavaScript
Основы программирования: переменные, условия, функции
Внедрение скриптов на сайт для создания интерактивных элементов
Знакомство с jQuery: когда он нужен, а когда нет
Подключение плагинов: слайдер, галерея, всплывающие окна, аккордеон
Работа с более сложными front-end технологий
12 БЛОК: Основы PHP-программирования
Назначение серверных технологий
Локальный веб-сервер и домен
Создание динамических веб-страниц
Понятие CMS-систем
Размещение сайта на хостинге
Протокол FTP для загрузки файлов
Подведение итогов и завершение проекта
О Бруноям
Бруноям — это практический подход к образованию. Мы делаем курсы для тех, кто хочет получить новую профессию, сменить сферу деятельности или решить свою бизнес-задачу. На собеседовании стали спрашивать не наличие диплома, а навыки, которыми человек обладает. Мы в Бруноям как раз и даём те самые навыки и умения, которые позволяют попробовать себя в новой профессии или совершенствоваться. Мы делаем образование для тех, кто хочет и готов пробовать новое, меняться, искать себя и свою работу мечты
