ДИЗАЙН САЙТА СТРОИТЕЛЬНОЙ КОМПАНИИ

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

В этой работе я выступал как дизайнер, идеолог, верстальщик и копирайтер.

Приятного ознакомления.

скриншоты сайта строительной компании

ГЛАВНЫЙ ЦВЕТ
ВСЕЙ КОМПАНИИ
КРАСНЫЙ

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

Каждая страница сайта выполнена в виде некой рекламной газеты, и, как и следует любой газете сайт не подпадает ни под одну шаблонную заготовку. Иными словами, для каждой страницы сайта моей работой было разработка определенного “бренда” для всех страниц сайта, а также создание индивидуального дизайна для каждой страницы в отдельности.

ОРИЕНТИР
ПЕЧАТНАЯ
ГАЗЕТА

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

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

газетные развороты

Что нам нужно знать о дизайне газет в общем?
- В любом печатном издании будь то газета или журнал, тщательно подбираются фотографии, которые в дальнейшем проходят стилистическую обработку.
- Иерархия на странице. все должно быть последовательно и логично! Читателю должно быть удобно!
- В каждой газете применяются приемы “ломаной верстки”, стремясь оживить подачу материала.
- Для выделения наиболее важной информации газеты и журналы выделяют информацию либо размером шрифта, либо цветом.
- Основные статьи в газетах и журналах стараются верстать ассиметрично. чтобы информация из длинных статей не казалась однообразной.

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

РАЗБИРАЕМ
ДИЗАЙН
САЙТА



ДИЗАЙН ШАПКИ САЙТА

Каждая страница начинается со своей индивидуальной картинки (шапки). Это всегда черно-белая фотография с выделенным красным цветом рабочих или технику выполняющих тематическую работу.
Дизайн шапки сайта для раздела строительные работы Дизайн шапки сайта для раздела подготовительные работы Дизайн шапки сайта для раздела строительный контроль Дизайн шапки сайта для раздела земляные работы Дизайн шапки сайта для раздела фасадные работы Дизайн шапки сайта для раздела кровельные работы Дизайн шапки сайта для раздела о компании Дизайн шапки сайта для заглавной страницы строительной компании Дизайн шапки сайта для раздела прокладки коммуникаций Дизайн шапки сайта для раздела производство окон
Дизайн шапки сайта для раздела строительные работы Дизайн шапки сайта для раздела подготовительные работы Дизайн шапки сайта для раздела строительный контроль Дизайн шапки сайта для раздела земляные работы Дизайн шапки сайта для раздела фасадные работы Дизайн шапки сайта для раздела кровельные работы Дизайн шапки сайта для раздела о компании Дизайн шапки сайта для заглавной страницы строительной компании Дизайн шапки сайта для раздела прокладки коммуникаций Дизайн шапки сайта для раздела производство окон

ОСОБЫЕ БЛОКИ

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


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

ЛОМАНАЯ ВЕРСТКА

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

Моя же задача была упростить восприятие информации до минимума и постараться уместить текст так чтобы он не стоял ордой вражеских отрядов принуждая себя читать.

Весь текст на страницах тщательно разобран на смысловые группы и имеет свой уникальный заголовок для быстрой навигации пользователя на страницы. А так же он размещен в нестандартных формах, чтобы информация не казалась однообразной. Приди, купи и возвращайся!

Скриншоты ломаной верстки на сайте Ломаная верстка для сайта Необычное предоставление информации на сайте
Скриншоты ломаной верстки на сайте Ломаная верстка для сайта Необычное предоставление информации на сайте

В ЗАВЕРШЕНИЕ
МОЕГО РАССКАЗА
О ДИЗАЙНЕ.

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

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

Ознакомиться с моей работой вы можете по ссылке