Наличие большого числа устройств отображения веб-контента ставит вопрос об адаптивности такого контента. То есть, о его удобной читаемости и возможности приемлемого восприятия на различных таких устройствах.
Это может быть монитор компьютера, планшета, мобильного телефона и.т.п. Различные размеры поля для отображения, его
конфигурация вынуждают веб-разработчиков предпринимать меры для достижения полиморфности веб-контекста. Веб-дизайн, рассчитанный лишь на один класс устройств, принято называть жестким, в отличие от гибкого (адаптивного, отзывчивого и т.п.) дизайна, который рассчитан на более широкий спектр использования.
Проблема адаптивности веб-контента упирается в позиционирование элементов веб -страницы на экранах различного размера и формы. Масштабирования элементов контента: текста, элементов управления, таблиц и проч. Также могут наблюдаться различия в цветовом поведении, но эта проблема характерна и для устройств отображения одного класса, например, мониторов. Следует учитывать также наличие отличий в программных средствах для отображения веб- содержимого - в браузерах.
Для достижения целей, поставленных перед гибким вариантом веб-дизайна, используется адаптивное позиционирование элементов на странице: так например, гибкая сетка.
Могут быть использованы масштабируемые контейнеры с сокрытием части элементов таким образом, чтобы видимая часть оставалась фиксированного размера, а скрытая - переменного, как вариант создания композитного изображения.
Программной основой гибкого веб-дизайна является применение скриптов и таблиц стилей. Управление страницей посредством JavaScript позволяет создавать альтернативные представления для контента. Применение альтернативных каскадных таблиц стилей CSS для каждого отображающего устройства повышает эти возможности еще больше.
Вы можете использовать различные таблицы стилей для горизонтального представления одного и того же фрагмента на экране компьютера и вертикального - на экране смартфона. Для экранов небольшого размера удобно использовать разбиение контента большего размера на несколько страниц меньшего, устанавливая взаимные связи с помощью гиперссылок. Всего этого можно добиться, используя CSS и скриптовые языки поддерживаемые браузерами.
Разумеется, построение гибкого дизайна требует от разработчиков большего профессионализма, времени на проектирование и реализацию. Но польза, извлекаемая из доступности интернет-ресурса с адаптивным дизайном на различных устройствах, в большинстве случаев, окупает расходы на его производство.
|
