Free-Studio — создание сайтов

Высота браузера без вертикальной прокрутки

Часто бывает, что в дизайн закладывают идею отсутствия вертикальной прокрутки на сайте. В таком случае это сообщается верстальщику при поступлении макета в работу.
Однако, зачастую высота макета больше, чем высота активной области браузера при минимальном разрешении, заложенном в ТЗ. И вот тут начинаются проблемы…

Для избежания таких ситуаций были произведены вычисления высоты активной области браузера для разных разрешений. Высота приводится с допустимой погрешностью на пользовательские настройки браузера для развернутого на весь экран браузера с вкладками и Windows Vista со стандартной темой и некрупными иконками.
Итак, высота панели задач и меню «пуск» составляет 50px. К ней необходимо прибавить высоту верхней части браузера. Поехали:

  1. Mozilla Firefox: меню «файл» + адресная строка + панель закладок + вкладки + нижняя панель = 153px
  2. Safari 4.0.2 адресная строка + закладки + вкладки = 101рх
  3. Opera меню «файл» + адресная строка + вкладки + нижняя панель = 130px
  4. Google Chrome вкладки + адресная строка = 63рх
  5. Internet Explorer 6 меню «файл» + адресная строка + панель настроек + нижняя панель = 132рx
  6. Internet Explorer 7 адресная строка + вкладки + нижняя панель = 116px
  7. Internet Explorer 8 адресная строка + закладки + вкладки + нижняя панель = 143px

Вывод: высота активной области браузера меньше всех у Mozilla Firefox — 153px, от нее и будем отталкиваться.

Итак, на экране при развернутом на весь экран браузере «съедается» 153+50= 203px.
Значит, для следующих разрешений высота активной области браузера составляет:

1024*768 565px
1280*1024 821px
1280*800 597px
1440*900 697px
1680*1050 847px

Таким образом, если минимальное разрешение, на которое ориентирован сайт, — 1024*768, то для избежания вертикальной прокрутки необходимо в макете отталкиваться от высоты 565px



Добавить свой комментарий