Создаем Psd шаблон для сайта

Теперь начнем наш урок, по созданию Psd шаблона.

Создадим для начала новый документ размерами 1020x1020 px, фон выбираем белого цвета.



Выбираем основной цвет - #c5e0dc и цвет фона - #ece5ce



Затем я выбрал инструмент Градиент и в панели настроек выбрал первый тип градиентов.



Теперь залейте градиентом наше белое полотно, протащив линию от верхней грани полотна до нижней.



Вот что должно получится:



Создание навигации и поисковую форму

Выбираем инструмент “ Горизонтальный текст” (T) я воспользовался шрифтом Tahoma размером 24px и цветом # 895b41. Напишем этим шрифтом Stylish, затем для надписи Template изменю цвет на белый. Описание сайта написал шрифтом Tahoma размером 12 px.




Затем создадим поисковую форму.
Воспользуемся инструментом «Прямоугольник» . Для придания более лучшего вида применим следующие стили слоя.







Инструментом “ Горизонтальный текст” (T) внутри форму напишем надпись.

Выбираем Инструмент «Прямоугольник со скругленными углами» и создадим подобную кнопку




Я применил следующие стили слоя:






Инструментом “ Горизонтальный текст” (T) напишем текст кнопки.

Вот мой результат поисковой форму.



Создание навигации

Выбираем Инструмент «Прямоугольник со скругленными углами» и создаем будущую навигацию.



Применим следующие стили слоя:







Вот что должно получится:



Выбираем Инструмент «Прямоугольник со скругленными углами» и создаем элементы панели навигации.



Применяем следующие стили:









Добавляем надписи для панели навигации.



К надписям применяем следующие стили слоя:





Создадим область для вывода новых новостей.
Выбираем инструмент «Прямоугольник». Нарисуйте область, равную по ширине навигации. Созданный слой располагаем выше слоя с навигацией.



Примените следующие стили слоя:













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



Единственно чего не хватает это кнопки для прокрутки новостей. Её мы создадим с помощью знакомого инструмента «Прямоугольник со скругленными углами».



И применим к нему следующие стили слоя:





Это заключительный результат верхней части шаблона.



Создание области под текст.

При помощи инструмента “ Горизонтальный текст” (T) и некоторых картинок, Вы можете создать эту часть менее чем за 5 минут.
Вот что получилось у меня:



Создание подвала сайта

Для начала выберем инструмент «Эллипс» , и воспользовавшись цветом #c5e0dc, создадим 2 формы, так же на скриншоте ниже.



Заключительный этап: добавьте текст авторского правав подвал сайта.




Вот мой окончательный результат: