Продвинутый онлайн-интенсив «Создание веб-интерфейсов с помощью HTML и CSS»
В чём отличие от базового интенсива?
Начальный уровень: средний
Интенсив предназначен для тех, кто прошёл базовый интенсив или для людей уже владеющих вёрсткой.
Профессиональный рост
Этот интенсив предназначен для «прокачки» от верстальщика-новичка до полноценного специалиста, востребованного на рынке.
Продвинутые инструменты
В процессе обучения на интенсиве будут постоянно использоваться те инструменты, которыми должен владеть каждый верстальщик-профессионал. Практическая часть будет завязана на GitHub, будут активно использоваться средства автоматизации.
Почему мы?
- Мы являемся работодателями, постоянно ищем технических специалистов и знаем, что они должны уметь и как их этому научить.
- Уже сейчас интерактивные курсы на HTML Academy с удовольствием проходят более 150 000 учеников, которые выполнили более двенадцати миллионовзаданий.
- Нас знают на рынке.
- 9 вебинаров длительностью 2 часа.
- 5 часов индивидуальных консультаций персонального наставника.
- Методические материалы: видео записи лекций, презентации, интерактивные пошаговые руководства.
- Отдельный форум для общения и взаимопомощи.
- Сертификат при успешном прохождении интенсива.
1 раздел: Организация рабочего процесса (workflow)
- Как будет организован учебный процесс на интенсиве.
- Введение в Git.
- Базовый рабочий процесс в Git: фиксация изменений и синхронизация репозиториев.
- Работа с ветками: создание, синхронизация, слияние.
- Конфликты и их разрешение.
- Инструменты для работы с Git.
- Обзор GitHub.
- Вёрстка независимыми блоками — БЭМ.
- Альтернативная методология — SMACSS.
- Работа с инспектором.
- Как верстать, чтобы не ломалось.
- Вёрстка с препроцессорами LESS и SASS.
- Возможности препроцессоров: переменные, вложенность правил, импорты, миксины и другие полезные функции.
- Сборка файлов препроцессора в стилевой файл.
- Автоматизация сборки препроцессоров.
- Резиновые сетки. Переход от «фикса» к «резине».
- Принцип «перестройки сетки».
- «Проблема двух вьюпортов» на мобильных.
- Мета-тег <viewport>.
- Медиавыражения, макро- и микробрейкпоинты.
- Как организовать код разных версий: мобильной, планшетной, десктопной.
- Единицы измерения vh и vw: примеры использования, проблема «100vw».
- Адаптивность с фиксированными и резиновыми сетками.
- Основные понятия: флекс-контейнер и флекс-элемент, главная и поперечная оси.
- Управление осями, выравнивание и распределение флекс-элементов.
- Многострочный флекс-контейнер.
- Управление размерами и «гибкостью» флекс-элементов.
- Изменение порядка флекс-элементов.
- Экранные и CSS-пиксели.
- «Ретина» или экраны с повышенной плотностью пикселей.
- Приёмы ретинизации содержимого веб-страницы.
- Адаптивная графика, тег <picture>.
- Типовые случаи использования <picture>.
- Векторная графика в вебе, формат SVG.
- Внешний и встроенный SVG, адаптивный SVG, SVG-спрайты.
- Горькая правда об иконочных шрифтах: достоинства и недостатки.
- Какие CSS-свойства тяжёлые, а какие быстрые.
- Что нужно знать, когда пользуешься CSS-анимацией и плавными переходами.
- Что нужно знать о перерисовке (repaint) и перекомпоновке (reflow) страниц.
- Отличается ли быстродействие сайта на десктопе от мобильного.
- Разберёмся, что лучше для автоматизации Grunt или Gulp.
- Оптимизация кода и графики.
- Следуем кодгайду автоматически.
- Как держать код для разработчика удобным, а для остальных — быстрым.
- Что помогает верстать быстрее.
- Обзор фреймворков, использование на любых проектах.
- Кросспроектные библиотеки компонентов.
Продажник:
Для просмотра скрытого контента необходимо Войти или Зарегистрироваться.
Для просмотра скрытого контента необходимо Войти или Зарегистрироваться.