Адаптивная верстка сайта

Создание адаптивного сайта | Урок #1 - Что такое адаптивность?

Создание адаптивного сайта | Урок #1 - Что такое адаптивность?

Приветствуем в новом видеокурсе по созданию адаптивного веб сайта на HTML и CSS. В ходе курса мы рассмотрим правила создания адаптивного контента, а также изучим CSS media queries, что позволяют указывать разные стили для разных размеров экрана.

Видеоурок

Отзывчивый дизайн

Отзывчивый дизайн и адаптивный дизайн - это термины что характеризуют веб сайты с дизайном предназначенным для корректного отображения на всех устройствах и всех размерах экранов.


Современные веб сайты давно перестали делать ориентировку на ПК пользователей, так как по статистике больший процент пользователей приходить именно через мобильные устройства или планшеты.


Если сайт не адаптирован, то пользователю будет некомфортно находиться на сайте, а соответственно он покинет сайт и более на него не вернется.


План курса

За курс мы научимся адаптировать сайты под разные разрешения дисплеев. Мы научимся прописывать стили в зависимости от ширины экрана.


По итогу, в одном CSS файле мы сможем прописать стили для мобильной версии сайта, а также для десктопной версии сайта. При чём обе версии могут кардинально отличаться друг от друга.

Материалы для курса

Чтобы скачивать материалы к видеокурсам необходимо оформить подписку на сайт

Онлайн редактор кода

Загрузка...

Задание к уроку

Теория

Что такое адаптивный веб-сайт? Зачем создавать адаптивные сайты?

Посмотреть ответ

Адаптивный веб-дизайн — дизайн веб-страниц, обеспечивающий правильное отображение сайта на различных устройствах, подключённых к интернету и динамически подстраивающийся под заданные размеры окна браузера.


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

Также стоит посмотреть

Верстка сайта на HTML5 и CSS3
13 уроков
Современная вёрстка адаптивного веб-сайта
Создание сайта с нуля | Полноценная верстка сайта
11 уроков
Изучение технологии Bootstrap (верстка сайта)
16 уроков
Изучение ASP.NET Core MVC. Создание сайтов на C#
10 уроков
Изучение препроцессора SASS / SCSS
7 уроков
Комментарии для сайта Cackle