Масштабирование по горизонтали

На большом экране страница с фиксированными размерами может, теряться среди неиспользуемого пространства, выглядеть «прижатой» к углу. Для избежания этого эффекта, могут использоваться следующие приемы:

1. Центрирование страницы. При этом ощущение пустого пространства немного уменьшается, а дизайн выглядит более сбалансированным.

2. Размещение графического наполнителя в правой части сайта. Наполнитель необходимо выставить задним фоном, чтобы при уменьшении размеров экрана страница обрезалась справа, а не прокручивалась. В качестве наполнителя можно использовать сплошной контрастный цвет или неповторяющуюся текстуру.

3. Масштабирование структуры страницы – так называемая «эластичная» верстка. Содержимое сайта занимает все доступное ему пространство окна браузера. При этом обычно сохраняются пропорции областей, на которые сайт разбивается по горизонтали (например, зона навигации занимает 25% от ширины окна, зона контента – 75%, ширина плавающего новостного блока – 25% и т. д.).

Чаще всего этот вариант не используется в чистом виде, поскольку на сайте обычно присутствует левая или правая навигация, основанная на графических элементах, которая должна занимать пространство фиксированной ширины. Таким образом, зачастую масштабируется только зона контента.

4. Масштабирование всего содержимого страницы. Несложно написать JavaScript-сценарий, который будет изменять подгонять все элементы страницы к размерам окна браузера, включая шрифты и графику. В настоящее время возможность масштабирования всего содержимого страницы поддерживается непосредственно браузерами, поэтому использование данного варианта потеряло смысл.

5. Позиционирование блоков. Если контент сайта оформлен как множество относительно самостоятельных блоков, то их можно по-разному выстраивать при различных разрешениях мониторов: элементы, которые при небольшой ширине окна браузера располагались вертикально, могут располагаться горизонтально, когда доступно широкое пространство. В этом случае возможно добиться эстетической привлекательности и удобства восприятия независимо от размеров монитора, но далеко не у многих сайтов контент можно безболезненно разбить на самостоятельные блоки. Кроме того, верстка и тестирование такой структуры требуют множество застрат.

Выбор между «жесткой» и «эластичной» версткой сделать не всегда легко: оба варианта имеют как достоинства, так и недостатки. «Эластичная» верстка лучше всего подходит для сайтов, содержащих большое количество разнообразного контента (развлекательных порталах). «Жесткая» верстка обеспечивает более точное позиционирование содержимого и позволяет создать максимально удобный для чтения и восприятия макет. Следует отметить, что большинство англоязычных сайтов используют исключительно «жесткую» верстку.

9. Работа с текстовым контентом в web.


Понравилась статья? Добавь ее в закладку (CTRL+D) и не забудь поделиться с друзьями:  



double arrow
Сейчас читают про: