WebDesign Master
Курсы
OptimizedHTML 4: Стартовый шаблон для верстки сайтов с Bootstrap 4 на борту

OptimizedHTML 4: Стартовый шаблон для верстки сайтов с Bootstrap 4 на борту

Всем привет, друзья! Сегодня мы познакомимся с новой версией стартового шаблона для верстки сайтов OptimizedHTML 4 с Bootstrap 4 на борту. Для тех, кто не знает, OptimizedHTML - это стартер, который подойдет для верстки практически любого проекта, значительно сэкономит ваше время в начале верстки и содержит набор базовых модулей. OptimizedHTML основан на использовании Gulp и его полезных модулей, таких, как BrowserSync (компонент для создания локального сервера и автоматического обновления страницы в процессе работы), Sass для быстрой и комфортной работы с CSS кодом, Uglify, CleanCSS и Autoprefixer для постобработки и Rsync для деплоя.

OptimizedHTML 4: Стартовый шаблон для верстки сайтов с Bootstrap 4 на борту - Видеоурок
Смотреть урок на YouTube
Создание контентного сайта на Jekyll от А до Я

Полезные материалы:

  • OptimizedHTML 4
  • Bootstrap 4. Сетка. Подробное руководство
  • Sass для самых маленьких
  • Gulp для самых маленьких
  • Документация Gulp на русском
  • Открыть окно Bash здесь (Скачать). Внимание! Для использования данной возможности, в системе Windows 10 должна быть установлена подсистема Ubuntu
  • Коллекция веб-шрифтов (300 шт.): Скачать

Размеры шрифтов в цифрах:

Размер шрифта в цифрах

В прошлом уроке мы знакомились с новой версией Bootstrap 4, которая вышла из беты совсем недавно и появилась потребность в обновлении ветки уже знакомого многим OptimizedHTML. Четвертая версия стартера содержит сам фреймворк Bootstrap 4, удобные инструменты для работы с фреймворком и множество других полезностей.

Данное видео понадобится нам для изучения уроков, в которых будем верстать с использованием сетки Bootstrap 4. Сразу отвечу на вопрос - содержатся ли компоненты Bootstrap в данном стартере или только сетка? В отличие от предыдущих версий OptimizedHTML, четвертая версия содержит полную копию Sass проекта Bootstrap, а значит содержит все компоненты Bootstrap 4. Однако по умолчанию в проект подключена только сетка и если вам необходимо использовать другие компоненты фреймворка, проблем с их подключением возникнуть не должно. Как это сделать мы разберем в этом уроке.

Премиум уроки от WebDesign Master

Курс по созданию сайта от А до Я на Jekyll

Создание сайта от А до Я. Комплексный курс

Курс по созданию интернет-магазина на OpenCart

Создание современного интернет-магазина от А до Я

Фриланс для начинающих

Я - фрилансер! Базовый курс для начинающих

Другие уроки по теме «Инструменты»

  • Настройка VS Code для верстки
  • Simple Starter - простой стартер для верстки | Материалы урока
  • Windows 11: Делаем вкладки в проводнике. Настройка QTTabBar от А до Я
  • Хостинг от А до Я: Сайты, базы, домены, SSL, SSH, sFTP, перенос, деплой, секреты, лайфхаки
  • Gulp 4 - Актуальное и исчерпывающее руководство для самых маленьких
  • Актуальный способ установки и настройки окружения Windows WSL 2 (Windows Subsystem for Linux)

Разделы сайта:

  • Курсы
  • Инструменты
  • Веб-дизайн
  • Вёрстка
  • CMS

Полезные ресурсы:

  • Установка WSL и окружения
  • Настройка окружения без WSL
  • Настройка VS Code
  • Lazy Load Placeholder
  • Документация Gulp 4
2023 © WebDesign Master