Инструкция
1
Разработайте дизайн сайта с наименьшим используемым разрешением – 800*600 пикселей и используйте фиксированную верстку. Но при таком подходе существует один минус – у пользователей, которые имеют широкоформатные мониторы, на экране при просмотре вашего сайта появятся широкие поля.
2
Используйте «резиновый» макет. В этом случае страницы будут растягиваться по горизонтали на тех мониторах, разрешение которых больше, чем использованное при разработке. Но такой подход лучше использовать при создании сайтов с большим количеством текстовой информации и минимальным объемом графики. Это связано с тем, что при изменении одного из размеров на разных мониторах некоторые элементы, такие как картинки или сторонние компоненты, будут искажаться.
3
Наиболее правильным, но в тоже время и более сложным с точки зрения реализации, считается применение адаптивного макета. Это более сложный вариант резинового макета, который дает возможность при использовании программного кода изменять количество колонок с информацией.
4
Но какой бы макет ни был выбран для разработки сайта, делайте его верстку при разрешении экрана 1024*768 пикселей. Это наиболее распространенное разрешение.
5
Также для корректного отображения сайта на мониторах с другим разрешением руководствуйтесь некоторыми правилами. Старайтесь, чтобы основное содержимое страницы помещалось на одном экране во избежание прокрутки. Текстовую информацию размещайте в узкой колонке, чтобы он не «расплывался» во всю ширину экрана. Следите за общим оформлением страниц, чтобы все было пропорционально.
6
При разработке дизайна рассчитывайте процентное, а не количественное соотношение ширины и высоты страницы. Тогда страница будет менять размер пропорционально и на обычных мониторах, а на широкоформатных.
Видео по теме