воскресенье, 12 февраля 2012 г.

Создание дизайна сайта под разное разрешение


Исходя из статистики разрешений экрана, веб-дизайнеру важно создать  макет сайта и показать заказчику, как он будет иметь вид, используя разные разрешения.






Это очень важно. Если не сделать в начале, то большая вероятность того что после придется потратить больше времени.  Хорошо, если верстальщик профессионал, он может еще на этапе приема работы и изучения ТЗ, сразу сообщить о выявленных проблемах. Представьте себе, какой может возникнуть конфликт с клиентом, если сайт будет сверстан, и только после этого заказчик увидит, что в один экран почти ничего не помещается. Он может сказать, чтобы переделывали. Но за чей счет?

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


Примите такой совет. Изначально необходимо сделать макет и согласовать его с заказчиком, какой будет иметь вид сайт при минимальном разрешении 1024×768 пикселей и для оптимального разрешения ноутбуков: 1280×1024 и 1280×800 пикселей.




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

Дабы рассчитать необходимую область в каждом нужном разрешении, можно использовать  плагин Web Developer (подробнее об этом можно прочесть в таких постах: «Расширения Google Chrome для веб-разработчиков» и «Плагины Firefox для веб-разработчика»).

Ниже, в скобках, отображено значение видимой части экрана некоторых разрешений экрана:

1.  1024×768 (1014×662)
2.  1280×800  (1270×694)
3.  1280×1024 (1270×918)

О разрешении дизайна сайта  больше можно узнать тут:

http://www.fortress-design.com/sozdanie-dizajna-sajta-pod-raznye-razresheniya/


Комментариев нет:

Отправить комментарий