Макет веб-страницы следует одному из двух разных подходов:
- Макеты с фиксированной шириной: Это макеты, в которых ширина всей страницы задается определенным числовым значением.
- Жидкие макеты: Это макеты, в которых ширина всей страницы может изменяться в зависимости от ширины браузера пользователя.
Есть веские причины для использования обоих методов компоновки, но без понимания относительного преимущества и недостатки каждого метода, вы не можете принять правильное решение о том, какой из них использовать в своей сети. страница.
Макеты с фиксированной шириной
Фиксированные макеты - это макеты, которые начинаются с определенного размера, указанного веб-дизайнером. Они остаются такой ширины независимо от размера окна браузера, просматривающего страницу. Макеты с фиксированной шириной позволяют дизайнеру более непосредственно управлять тем, как страница будет выглядеть в большинстве ситуаций. Их часто предпочитают дизайнеры с печатным фоном, поскольку они позволяют дизайнеру вносить мелкие корректировки в макет и сохранять их единообразие в браузерах и компьютерах.
Жидкие макеты
Жидкие макеты - это макеты, основанные на процентах от размера текущего окна браузера. Они изменяются в зависимости от размера окна, даже если текущий зритель изменяет размер своего браузера во время просмотра сайта. Макеты с жидкой шириной позволяют эффективно использовать пространство, предоставляемое любым заданным окном браузера или разрешение экрана. Их часто предпочитают дизайнеры, у которых есть много информации, которую можно передать на минимальном пространстве. возможно, поскольку они остаются неизменными по размеру и относительному весу страницы независимо от того, кто просматривает страница.
Что на кону?
Ваш Дизайн сайта влияет на ваш отзывчивость и адаптивность сайта. В зависимости от того, что вы выберете, способность ваших читателей сканировать ваш текст, находить то, что они ищут, или иногда даже использовать ваш сайт, может быть облегчена или затруднена. Общая идентичность бренда вашего сайта также может быть под угрозой, особенно если стандарты вашего бренда следуют логической модели, ориентированной на печать.
Преимущества макетов фиксированной ширины
Макет фиксированной ширины полезен в некоторых случаях.
- Макет фиксированной ширины позволяет дизайнеру создавать страницы, которые будут выглядеть одинаково независимо от того, кто на них смотрит.
- Элементы фиксированной ширины, такие как изображения, не будут перекрывать текст на мониторах меньшего размера, потому что ширина всей страницы будет включать эти элементы.
- На длину сканирования не повлияют большие фрагменты текста, независимо от ширины браузера.
Преимущества жидких макетов
Жидкий макет лучше всего работает в других обстоятельствах.
- Макет жидкой ширины расширяется и сжимается, чтобы заполнить доступное пространство.
- Используется все доступное пространство, что позволяет дизайнеру отображать больше контента на больших мониторах, но при этом остается жизнеспособным на небольших дисплеях.
- Жидкие макеты обеспечивают единообразие относительной ширины, позволяя странице более динамично реагировать на ограничения, накладываемые заказчиком, такие как более крупные размеры шрифта.
Недостатки макетов фиксированной ширины
Однако фиксированный формат не обходится без затрат.
- Макеты с фиксированной шириной вызывают горизонтальную прокрутку в небольших окнах браузера. Большинство людей не любят горизонтальную прокрутку.
- Они оставляют большие пустые пространства на больших мониторах, что приводит к большому количеству неиспользуемого пространства и большему количеству прокрутки по вертикали, чем могло бы потребоваться в противном случае.
- Макеты с фиксированной шириной плохо справляются с изменениями размеров шрифтов, внесенными пользователем. При небольшом увеличении размера шрифта они могут быть нормальными, но при более крупном увеличении макет может быть нарушен.
Недостатки жидких макетов
Жидкие макеты тоже не лишены недостатков.
- Жидкие макеты позволяют очень мало точно контролировать ширину различных элементов страницы.
- Они могут привести к тому, что столбцы текста будут либо слишком широкими для удобного сканирования, либо в небольших браузерах слишком маленькими для четкого отображения слов.
- Ошибка жидких макетов, когда элемент фиксированной ширины, например изображение, помещается внутри жидкого столбца. Если столбец отображается без достаточного места для изображения, некоторые браузеры увеличивают ширину столбца, игнорируя инструкции дизайнера, в то время как другие браузеры принудительно перекрывают текст и изображения для достижения правильного проценты.
Предпочтение макета и смешанные подходы
Некоторые дизайнеры предпочитают смешивать эти концепции. Им не нравится использовать жидкие макеты для больших блоков текста, поскольку такая структура делает текст либо нечитаемым на маленьком мониторе, либо не сканируемым на большом. Поэтому они, как правило, делают основные столбцы страниц фиксированной ширины, но делают верхние, нижние и боковые колонтитулы. столбцы более гибкие, чтобы занимать оставшуюся недвижимость и не терять емкость более крупных браузеры.
Некоторые сайты используют сценарии для определения размера окна вашего браузера, а затем соответствующим образом изменяют отображаемые элементы. Например, если вы откроете такой сайт в очень широком окне, вы можете получить дополнительный столбец ссылок с левой стороны, который посетители с меньшими мониторами могут не увидеть. Кроме того, обтекание рекламным текстом зависит от ширины окна вашего браузера. Если он достаточно широкий, сайт будет обтекать его текстом, в противном случае текст статьи будет отображаться под объявлением. Хотя большинству сайтов не нужен такой уровень сложности, он демонстрирует способ использовать преимущества больших экранов, не влияя на отображение на экранах меньшего размера.