Ни для кого не секрет, что пользователи интернета пользуются самыми разными мониторами с различными разрешениями экрана. В связи с этим нередко встречается следующая задача у разработчиков web сайтов — создание и оптимизация сайта для корректного отображения на мониторе с любым разрешением. Опытные специалисты по оптимизации web сайта советуют протестировать отображение страниц при разных разрешениях уже на этапе создания дизайна сайта, так как переделка готового сайта может стать большой проблемой.
Один из наиболее простых способов решения проблемы, когда часть страницы не помещается на экране пользователя, — разработка дизайна при наименьшем используемом разрешении (800*600) и использование фиксированной верстки. Недостатком такого подхода является появление широких полей, особенно у пользователей, имеющих широкоформатные мониторы. В настоящее время фиксированные макеты используются все реже.
Другой способ оптимизации сайта под разные разрешения — использование «резинового» макета. В этом случае страницы как бы растягиваются по горизонтали на мониторах с большим разрешением, чем использованное при разработке. Однако, на большинстве страниц есть элементы, которые искажаются при изменении одного из размеров — например, изображения или сторонние компоненты. Резиновые макеты лучше использовать для сайтов с большим объемом текстовой информации и минимальным количеством графики.
Еще одна разновидность дизайна сайтов — адаптивный макет. Это усложненный вариант резинового макета, позволяющий с помощью программного кода менять количество колонок с информацией. В настоящее время адаптивный макет — наиболее грамотное решение проблемы оптимизации сайта для разных экранных разрешений, но, в то же время, и наиболее сложный с точки зрения реализации.
В любом случае, какой бы вид макета вы не выбрали, делать верстку сайта вы будете при конкретном разрешении экрана. Лучше всего выбрать наиболее распространенное на сегодняшний день разрешение 1024*768 пикселей.
При оптимизации web сайта для правильного отображения на других разрешениях необходимо руководствоваться несколькими правилами. Прежде всего, основное содержимое страницы должно помещаться на одном экране, чтобы пользователю не нужно было использовать прокрутку. Во-вторых, текстовая информация должна читаться комфортно: лучше сделать более узкую колонку, чем отображать небольшой текст во всю ширину страницы. Наконец, страница просто должна выглядеть красиво: на ней не должно быть неровных элементов, блоков, расположенных на разной высоте и т.д. Также специалисты рекомендуют при разработке дизайна нового сайта рассчитывать соотношение ширины и высоты страницы, исходя не из количественного соотношения, а из процентного. В этом случае страница будет пропорционально менять размер как на обычных мониторах, так и на широкоформатных.
Оптимизация сайта под разные разрешения монитора — верный способ не потерять посетителей из-за непродуманного дизайна.