Создание дизайна сайта от А до Я. Часть 2



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

Приступим.

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

Первым чем мы займемся — это будет горизонтальное меню ака разделитель контента и шапки.

Снизу шапки рисуем горизонтальную полосу шириной примерно 25px. Вот, что доложно получится:

Горизонтальное меню

Стиль для меню можно найти в моей подборке стилей.

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

Лого

Мой логотип – это слово «2coders» написанное шрифтом «baveust» (который вы можете найти в прилагающимся архиве), немного украшенное фигурой из набора floristic_shapes, который также прилагается и небольшое описание сайта под основным логотипом.

На данный момент мы имеем следующие:

Шапка + лого

Перейдем к форме поиска. Я думаю нарисовать форму поиска у вас не вызовет затруднений. Вот мой вариант:

поиск

Осталось добавить иконку RSS. И наша шапка будет готова. Я решил сам её не рисовать и взял готовую:

RSS

Вот, что у меня получилось:

Шапка

В следующей статей займемся дизайном контент области, сайдбара и футера.

Файлы проекта на данный момент.



    None Found

Теги: ,

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