Лучшие статьи категории «Веб-сайты»

Подписка

Дизайн сайтов в стиле гранж

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

Сегодня мы остановимся на одном из них, а именно — гранж, расскажем о его характерных особенностях и покажем примеры сайтов этого направления. Но прежде, рекомендуем прочитать статьи о других стилях. Они собраны в рубрике «Стили». Это позволит вам сравнить направления и лучше понять их.

Что такое гранж?

Гранж (от англ. Grunge — нечто отвратительное, неприятное, отталкивающее), как правило, использует элементы из рваных и грязных изображений, таких как кусочки бумаги, пятна, кляксы, рваные края, изношенные или потертые иконки, блеклые или шероховатые текстуры и т.п. Текстуры к слову — главная особенность стиля. Они применяются как в качестве основного фона, так и для «раскрашивания» меню или подложек под блоки с контентом. Так же дизайнеры намеренно используют изображения или блоки с неправильной формой.

Гранж позволяет делать дизайн менее однородным, более органичным и, если так можно выразиться, немного хаотичным. Однако нельзя путать слова гранж и грязь. Как в случае с минимализом нельзя путать минимализм и пустоту. И в том и в другом случает должна быть гармония и сбалансированность. Чрезмерное использование гранжевых элементов «захламит» страницу и лишит ее своего стиля.

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

Примеры сайтов

Ниже мы собрали коллекцию из 20 превосходных примеров гранжа в дизайне. Надеемся вы найдете в них вдохновение.

Дизайн сайтов в стиле гранж
Дизайн сайтов в стиле гранж
Дизайн сайтов в стиле гранж
Дизайн сайтов в стиле гранж
Дизайн сайтов в стиле гранж
Дизайн сайтов в стиле гранж
Дизайн сайтов в стиле гранж
Дизайн сайтов в стиле гранж
Дизайн сайтов в стиле гранж
Дизайн сайтов в стиле гранж
Дизайн сайтов в стиле гранж
Дизайн сайтов в стиле гранж
Дизайн сайтов в стиле гранж
Дизайн сайтов в стиле гранж
Дизайн сайтов в стиле гранж
Дизайн сайтов в стиле гранж
Дизайн сайтов в стиле гранж
Дизайн сайтов в стиле гранж
Дизайн сайтов в стиле гранж
Дизайн сайтов в стиле гранж
Категория: Веб-сайты Рубрики: , Автор: Илья Федотов (G+)


Комментарии (8)

Игорь / 22 Октябрь 2011 в 14:15

Красота. Спасибо за подборку.

Домейнер / 23 Октябрь 2011 в 16:32

Красиво — потому что необычно, что не приелось.

Jj / 24 Октябрь 2011 в 17:09

Вполне вписывается в список сайт OpenCinema, вполне себе гранж-дизайн.

Максим / 11 Декабрь 2011 в 14:57

Отлично, все таки красивая графика и минимализм играют свою роль.

Alex (AJxKorsar) / 29 Январь 2012 в 06:44

Очень стильно. Только Последний под определение «Гранж» не подходит, нет там ничего из перечисленного.

Павлик / 23 Март 2012 в 13:30

Классные сайты (:

Канат / 2 Январь 2015 в 17:53

Красиво, а во сколько может обойтись сайт в таком стиле?

Илья Федотов / 5 Январь 2015 в 12:01

Канат, этот вопрос лучше задать какой-нибудь дизайн студии. Они ответят Вам более точно, чем я.

Комментирование этой статьи закрыто ...

Поиск

Популярные статьи

Комментарии

  • Павел Тимощенко: Аналогично скриню картинки для некоторых...
  • Зенков Андрей: Учитывая, что иконки служат для подсказки тем,...
  • Зенков Андрей: Дизайнер должен ответственно подойти к...
  • Оля: DizGraf, вот отличный русскоязычный бесплатный фотобанк.
  • V.V: В копилку еще один типограф Дениса Селезнёва на JavaScript.
  • Сергей: Спасибо за примеры инфографики. Для тех, кому нужны еще...
  • Андрей Зенков: Спасибо автору. Хорошая подборка. Аж стыдно за то,...
  • Адениум: Наука даром не дается — наука трудом берется....

Друзья

Нашли ошибку?

Если вы нашли грамматическую ошибку на сайте, выделите ее и нажмите сочетание клавиш Ctrl+Enter.

Система Orphus