Фотошоп

При создании сайта удобно использовать программу Photoshop. Это графический редактор со множеством возможностей. В нем собрано очень большое количество инструментариев и элементов для работы с графикой, текстом и фотографиями. Именно это возможности очень удобно применять для создания красивых и удобных интернет сайтов.
Разработать такой интернет сайт можно, как говорится, «с нуля», то есть целиком его описывая, а можно использовать какую-либо стандартную форму, то есть «сайт на движке».

Исходя из этого, и работа в Фотошоп будет различаться.
Для сайта «с нуля» при помощи программы можно нарисовать макет общего фона, прорисовывать кнопки, флажки и другие элементы для удобства работы. Потом при помощи HTML кода можно будет расставить все эти элементы по своим местам и заставить их функционировать. Создать свой неповторимый дизайн сайта.

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

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

Важным фактором в процессе подготовки макета является уменьшение сайта в разрешение монитора 1024*768 без горизонтальной прокрутки. Это на данный момент минимальное разрешение, соответствующее 17-дюймовому монитору.

Итак, перейдем непосредственно к программе.
Первоначально создается новый файл, в котором собственно и будет рисоваться макет сайта. Отталкиваясь от влазимости в минимальное разрешение, ширина созданного файла должна быть не более 1000 точек, а вот высота может быть какой угодно (на вертикальную прокрутку не стоит обращать внимание).
В случае веб-дизайна параметр разрешение не играет никакой роли, установите оптимальное значение – 70. Однако если вы создаете макет, который в последующем планируете распечатать, то в таком случае разрешение должно равняться 300 пикс./дюйм.

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

Теперь остается правильно порезать макет дизайна сайта и грамотным образом сохранить в грамотные форматы.

Картинка на простом фоне

Если фон простой (одноцветный или белый), то изображение можно поставить прямо поверх заданного фона. Единственное условие – изображение должно иметь точно такой же фон, как и подложка. В таком случае оптимальным форматом сохранения является jpg.

Картинка на сложном или градиентном фоне

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

Как правильно вырезать

В случае, если необходимо замостить блок градиентным цветом, достаточно вырезать небольшой кусочек градиента высотой, равной высоте заполняемого блока и длинной в 1 пиксель. После этого посредством свойства background-repeat повторяем наше градиентное изображение вдоль оси X и замещаем фоном весь блок, отведенный под него. При этом картинка в 1 пиксель формата jpg в мгновение ока залетает на компьютер пользователя.

Поделиться в соц. сетях

Фотошоп
Фотошоп
Фотошоп
Фотошоп
Фотошоп
Фотошоп

Похожие записи

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

http://rabotalegko.com/wp-content/plugins/wp-monalisa/icons/wpml_bye.gif 
http://rabotalegko.com/wp-content/plugins/wp-monalisa/icons/wpml_good.gif 
http://rabotalegko.com/wp-content/plugins/wp-monalisa/icons/wpml_negative.gif 
http://rabotalegko.com/wp-content/plugins/wp-monalisa/icons/wpml_scratch.gif 
http://rabotalegko.com/wp-content/plugins/wp-monalisa/icons/wpml_wacko.gif 
http://rabotalegko.com/wp-content/plugins/wp-monalisa/icons/wpml_yahoo.gif 
http://rabotalegko.com/wp-content/plugins/wp-monalisa/icons/wpml_cool.gif 
http://rabotalegko.com/wp-content/plugins/wp-monalisa/icons/wpml_heart.gif 
http://rabotalegko.com/wp-content/plugins/wp-monalisa/icons/wpml_rose.gif 
http://rabotalegko.com/wp-content/plugins/wp-monalisa/icons/wpml_smile.gif 
http://rabotalegko.com/wp-content/plugins/wp-monalisa/icons/wpml_whistle3.gif 
http://rabotalegko.com/wp-content/plugins/wp-monalisa/icons/wpml_yes.gif 
http://rabotalegko.com/wp-content/plugins/wp-monalisa/icons/wpml_cry.gif 
http://rabotalegko.com/wp-content/plugins/wp-monalisa/icons/wpml_mail.gif 
http://rabotalegko.com/wp-content/plugins/wp-monalisa/icons/wpml_sad.gif 
http://rabotalegko.com/wp-content/plugins/wp-monalisa/icons/wpml_unsure.gif 
http://rabotalegko.com/wp-content/plugins/wp-monalisa/icons/wpml_wink.gif 
 

Goon Каталог сайтов Рейтинг@Mail.ru Яндекс.Метрика