С развитием ИТ-технологий и появлением стандартом HTML 5 и CSS 3 стало возможным создавать сайты, которые одинаково хорошо выглядят как на домашнем компьютере с большим монитором, так и не маленьком экране обычного смартфона. Это стало возможным благодаря появлению так называемого адаптивного дизайна. Такой подход обеспечивает правильное отображение сайта на различных устройствах – от смартфона до телевизора – и динамически подстраивается под фактические размеры окна браузера.
Адаптивные сайты основаны на «резиновом» макете – ширина сайта автоматически подстраивается под ширину экрана пользователя, занимая всё доступное пространство. При этом отдельные блоки могут перегруппировываться, а элементы управления скрываться или видоизменяться. Для этого на адаптивных сайтах широко используются так называемые медиа-запросы: браузер определяет ширину экрана конкретного устройства, и подстраивает под неё всю структуру сайта. Кроме того, при разработке такого сайта веб-дизайнер использует принцип «mobile first» («сначала мобильные»). Это означает, что вначале разрабатывается максимально простой макет, подходящий для мобильных устройств, который затем дополняется и усложняется.
Однако стоит отметить, что программирование «с нуля» адаптивного сайта – весьма дорогостоящая вещь, которая требует привлечения команды высококвалифицированных специалистов. Поэтому в последние годы стали очень популярны так называемые фреймворки – программные платформы, которые позволяют быстро разворачивать адаптивный дизайн на основе библиотеки готовых решений. Первенство в данном вопросе принадлежит фреймворку Bootstrap, разработанному компанией Twitter. Именно этот свободно распространяемый программный продукт лежит в основе сайтов, разрабатываемых Мастерской сайтов. Bootstrap обеспечивает полную адаптивность, при этом имеет поддержку и регулярные обновления – Ваш сайт будет работать стабильно и долго оставаться актуальным с точки зрения внешнего вида и используемых технологий.
