Что такое адаптивный дизайн и адаптивная верстка
На заре интернета, только начали создаваться первые сайты, дизайн сайтов делался также, как делался дизайн полиграфической страницы. Важно было, чтобы при открытии веб-страницы бросалась в глаза самая важная информация. Поэтому больше всего внимания уделялось шапке сайта – то, что человек видел в первый момент. Она должна была быть яркой, красочной, должна была привлекать и удерживать внимание.
Постепенно, с развитием компьютерной техники, стали появляться и другие мониторы – широкие, с высоким разрешением. И производители сайтов должны были обращать внимание на то, чтобы сайт хорошо смотрелся и на маленьком, и на большом мониторе. Так появилось понятие «резиновая верстка», или «резиновый сайт» - это такой способ верстки, при котором страница занимает всю ширину монитора. Этот способ имеет свои плюсы и минусы. С одной стороны, при равномерном заполнении страница выглядит более сбалансированной. С другой стороны, если сильно увеличивается в ширину текстовая часть, строка становится длинной и неудобочитаемой.
При разработке дизайна все эти особенности надо учитывать. Дизайнер при разработке сайта должен предусмотреть, как будет выглядеть страница при разном разрешении экрана.
В настоящее время даже этих мер уже недостаточно. Развитие мониторов двигается не только в сторону увеличения экрана, но и в сторону уменьшения. Появились компактные устройства – планшеты, смартфоны, и пользователи хотят на своих мобильных устройствах видеть ту же информацию, что и на больших мониторах. Кроме того, устройства отличаются не только размерами, но и пропорциями – появились широкоформатные мониторы, устройства с книжной и альбомной ориентацией. Такое количество разномастных устройств и привело к необходимости нового подхода к созданию сайтов. Появилось понятие адаптивного веб-дизайна – это такой подход к разработке сайтов, который не только обеспечивает корректное отображение сайта на любых устройствах, но и дает возможность динамически подстраивать веб-страницу под заданные размеры окна браузера.
Адаптивный веб-дизайн включает в себя как собственно дизайн сайта, так и верстку. То есть дизайнер уже на этапе создания макета сайта должен представлять, как будет выглядеть страница на устройствах разного размера и разной геометрии. Но кроме того, дизайнер должен хотя бы в общих чертах представлять технологию создания веб-страницы, чтобы его гениальные задумки были в принципе воплотимы в жизнь.
Существует несколько технологических подходов к верстке страницы, и каждый из них предъявляет свои специфические требования к макету. Поэтому необходимо тесное сотрудничество дизайнера и верстальщика на всех этапах прорисовки дизайна, чтобы не случилось ситуации, когда то, что нарисовано дизайнером выглядит очень красиво, но в принципе не может быть создано в рамках существующих технологий, либо очень дорого. К сожалению, нередко возникают ситуации, когда заказчик сайта сначала заказывает дизайн в одной компании, долго и скрупулезно утверждает его, но потом никакая веб-фирма не соглашается создавать по этому макету сайт.
Чтобы не оказаться в подобной ситуации, идеальный вариант – это заказывать разработку сайта полностью, включая макет и верстку, в одной компании. Либо, если вам очень приглянулся стиль какого-то одного дизайнера, по крайней мере убедитесь, что он имеет представление об адаптивном дизайне, и может удовлетворить требованиям верстальщиков.