Уроки по Фотошопу, Иллюстратору, Флэшу и 3ds max. Статьи по дизайну и фотографии.

Создаем бизнес макет сайта за 10 минут (Часть 1).

Урок переведен автором сайта и при цитировании его на русском языке ссылка на сайт обязательна. Автор psdtemplate.com. Оригинал статьи на английском

макет сайта

Шаг 1. Создаем новый файл в Фотошопе, размером 960px на 900px и белым фоном. В верхней части макета рисуем прямоугольник (размер: 961px на 95px, цвет#303123).

создание сайта

Шаг 2. После этого добавляем логотип и навигацию. У нас для логотипа использовался шрифт Bauhaus93, но он не является свободнораспространяемым. Вы же можете использовать свои шрифты или воспользоваться одним из бесплатных шрифтов, например, с этого сайта dafont.com. Для навигации будем использовать серый цвет для текста и прямоугольник со скругленными краями для выделения пунктов меню. Для этого прямоугольника используем следующие Стили Слоя (Color Overlay, Outer Glow):

Color Overlay

Outer Glow

навигация на сайте

Шаг 3. Переходим к шапке сайта. Для этого опять рисуем прямоугольник (под серым прямоугольником) размером 960 на 234 пикселей со следующими Стиля Слоев: Inner Glow и Gradient Overlay (см. рисунок, для градиента используем цвета - #fc6200 и #ff9e40). Обратите внимание, что для при рисовании прямоугольной фигуры можно просто задать фиксированный размер фигуры (см. рисунок).

Inner Glow

Gradient Overlay

фиксированный размер

шапка сайта

1 | 2 | >