Сегодня:
Блог: "Основы сайтостроения и веб дизайна"
сайтостроение

Переход на: Главная / Макет сайта /

Этапы создания макета сайта. Часть 1 Определение размеров макета сайта.

АвторАвтор: aklychin

Дата добавленияДата добавления: 05.06.2013

Число просмотровЧисло просмотров: 17347



Здравствуйте уважаемый читатель блога "Основы сайтостроения и web дизайна".


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


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


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


Если вы читали мои статьи на тему «Виды макетов сайта», то вы должны помнить, что современные web-разработки предусматривают разработку сайтов, которые меняют свои размеры в зависимости от разрешения экрана монитора. Именно поэтому выбор размеров макета сайта является одной из основных задач в донесении общего дизайна сайта до людей, которые продолжат создание сайта.


Определение размеров макета сайта


И так вы решили создавать макет сайта с фиксированной шириной. Как показывает практика разрешение монитора 1024х768рх – это-то разрешение, которое на сегодняшний день остается одним из преобладающих. Поэтому, что бы избежать горизонтальной полосы прокрутки, ширина макета не должна превышать размер 1024рх. Однако если мы поставим 1024рх, то при появлении вертикальной полосы прокрутки сразу же появится и горизонтальная, потому что к 1024рх добавится 24рх, а именно ширина той самой вертикальной полосы прокрутки. Исходя из всего этого и учитывая, что вы можете поместить в рамку свой макет или добавить внешнюю тень, общепринятой шириной макета является 960 – 980рх.


При этом начальная высота макета сайта не столь критична, потому что в любое время вы можете ее изменить. Увеличить или уменьшить в зависимости от объема информации, которую необходимо разместить на странице сайта. За основу берется 500 – 600рх. Таким образом, при создании макета для сайта с фиксированной шириной при выборе размеров нового изображения можно остановиться на размере 980х550рх.


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


Определение размеров макета сайта


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


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


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


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


Определение размеров макета сайта


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


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


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


Поделиться

Добавьте Ваш комментарий и оцените статью:

+ Добавлять комментарии и оценивать статью могут только зарегистрированные пользователи. Если Вы регистрировались, то просто авторизируйте свой аккаунт.


Комментарии к данной статье:


Подписаться на обновления блога

монетизация сайтаРеклама
заработок на сайтеПомощь

Понравился проект?

Внесите вклад в его развитие, пожертвовав любую сумму на один из кошельков:

Z255632435111

R174106546724

Деньги пойдут на оплату серверов, зарплату авторам уроков и развитие ресурса.

В примечании к платежу укажите Ваш email или логин на нашем проекте.

Администрация.

Статистика блога:

Статей: 107

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

Зарегистрировано: 13

Все права защищены сopyright © Блог - "Основы сайтостроения и веб дизайна" 2012 - 2017