Начиная с прошлого года ведётся активное изучения такого направления в веб-дизайне, как responsive web-design. На западе это направление уже давно активно разрабатывается, а российские специалисты рассказывают о нём на различных профессиональных форумах и конференциях.
Под responsive web-design подразумевается адаптивный дизайн. Этот термин уже прижился в среде разработчиков и дизайнеров. Но в этой статье речь пойдёт не о нём, а о контенте, который будет меняться вместе с появлением этой новой тенденции в разработке сайтов и их дизайне. Именно контент является основой любого сайта. Поэтому рациональный подход к веб-разработке подразумевает максимально точное отражение сути материалов сайта с помощью типографики, вёрстки, дизайна и других вспомогательных элементов.
Адаптивный дизайн в свою очередь требует ещё большего внимания к контенту, поскольку он должен быть, во-первых, структурирован под различные устройства, во-вторых, должен меняться, то есть сокращаться и расширяться. Поэтому прежде всего нужно ответить на вопрос: готов ли контент сайта к адаптации?
Куда должен перемещаться контент?
Типовой подход к концепции перемещения контента подразумевает, что если происходит сужение размеров экрана, то всё, расположенное в колонке сбоку, должно переместиться вниз под основной контент. Однако по мнению многих специалистов такой способ может нарушить иерархию, ведь не всегда боковая колонка может быть менее важной, чем основной контент.
Следовательно, при разработке сайтов с адаптивным дизайном необходимо учесть два момента:
- определить типы контента, исходя из составных элементов и задач, которые решает наполнение сайта. Тогда каждый тип контента будет перемещаться по разным правилам, а не только вниз страницы;
- разбить сайт на части, чтобы получилась микроструктура. Каждый тип контента должен быть приведён к единой структуре. При этом между отдельными частями информации должны быть установлены связи, которые имеют вполне конкретное назначение: вступительный абзац, броская цитата, тизер и так далее. Длинный текст также должен быть разделён на части, а элемент вставлен в середину. Такой метод называют "переплетением".
Чтобы создать несколько вариантов веб-страниц вручную, нужно потратить очень много времени и сил. Сэкономить ресурсы помогает структурирование и систематизация контента, а также формирование правил его построения.
Сначала мобильная версия сайта?
Дизайнеры считают, что проблемы со связями и иерархией можно решить просто, если сначала создать мобильную версию адаптивного сайта. Дополнительный контент просто-напросто окажется на месте, если увеличится ширина экрана. Ведь на маленьком экране с одной колонкой легче проследить правильный смысл концепции сайта и его посыл.
Структура важнее!
Контент можно сравнить со снежинкой, связи и смысл которой имеют уникальную структуру. Легко ошибиться тому, кто решит, что весь контент одинаков и не будет учитывать множество нюансов. Когда адаптивный дизайн используется не для создания элементарных сайтов: персональных портфолио, блогов или сайтов-визиток, - а применяется в разработке тысяч страниц с разными типами информации и большим количеством авторов, проработать все элементы вручную уже не представляется возможным.
В этом случае лучше всего использовать правила, которые основаны на выделении типов контента, обусловлены структурой и могут быть доработаны вручную. Чтобы знать контент сайта, необходимо представлять его структуру. Считается, что можно создать хороший продукт и при этом не знать контента, но это сделать не получится, если не знать из чего состоит контент.
Если вы легко можете определить типы контента, основываясь на их самых значимых элементах и знании о том, как эти элементы заставляют контент работать, то разработать систему, которая и сформирует структуру, у вас получится. Не так важно, сколько пространства требует контент. Важнее разработать такие правила, которые будут управлять перемещением контента, изменять размер и форму отображения в адаптивном дизайне.
Эксперты отмечают, что в ближайшие годы огромная часть интернета будет существовать по принципам адаптивного дизайна, поскольку это диктуется эволюцией посткомпьютерной эпохи. Поэтому дизайнеры и разработчики сайтов должны уже сегодня начинать мыслить несколько иначе.