Поиск
Подписаться
Разное

Валидный XHTML 1.0 Transitional

Валидный RSS

Золотое сечение в веб-дизайне Категория: Веб-дизайн
Название: Золотое сечение в веб-дизайне
Дата добавления: 01-05-2012
Раз просмотрено: 2338
Комментарии: 4
Рейтинг: * * * * * * * * * * (1 голос)

Золотое сечение в веб-дизайне

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

Золотое сечение — это математическая концепция, восходящая корнями к древности. Она используется как основополагающий принцип во многих вида дизайна — от архитектуры до веб-дизайна. И хотя точное происхождение этой формулы не известно, ее примеры могут быть найдены во всей мировой истории: египтяне использовали золотое сечение при постройке пирамид, а греки использовали при постройке Парфенона.

Пожалуй самый известный пример золотого сечения появляется в работе Леонардо да Винчи «Витрувианский человек», рисунке, который впервые был опубликован в труде «De Divina Proportione». Золотое сечение очень часто встречается и в природе — соотношение частей тел насекомых, или в форме раковины моллюска наутилуса.

Витрувианский человек
Витрувианский человек

Золотое сечение имеет множество других названий — божественная пропорция, золотой прямоугольник и число φ (фи, не путать с числом π — пи). Но все эти названия относятся к одному и тому же — некоторой форме, которая считается самой приятной и гармоничной для человеческого глаза. Золотое сечение считается отношением формы как 1:1.618, хотя дизайнеры иногда предпочитают округлять это число до 1.61, для упрощения работы.

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

Создание сайта с золотым сечением

Чтобы создать сайт, учитывая особенности золотого сечения, необходимо измерить ширину контента и разделить на 1.618. Полученное число — это ширина главной части вашего сайта, а разница между этим числом и всей шириной — ширина боковой панели сайта. Используя немного математики, вы можете легко создать сетку сайта, отвечающую стандартам золотого сечения. Начнем с ширины контента (мы возьмем 1024 пикселей, ширину большинства лэптопов, планшетов и маленьких экранов).

1024 / 1.618 = 632.88
632.88 ≈ 633

Значит, наш контент будет шириной в 624 пикселя.

1024 — 633 = 391
Длина нашей боковой панели — 391 пиксель.

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

Онлайн калькулятор золотого сечения
Онлайн калькулятор золотого сечения

Сайты использующие золотое сечение

Твиттер, после редизайна в 2011 году, стал использовать золотое сечение, как основу сетки сайта. Основная часть и правая боковая панель справа относятся друг к другу как части золотого прямоугольника, т.е. 1:1.618:

Золотое сечение Твиттера

It's Numbered, известный онлайн магазин графики, использует идею золотого сечения, как отношение блоков с изображениями и текстом. Золотое сечение может использоваться не только в макете сайта, но и в общем дизайне сайта, при группировке объектов, и т.д.

Золотое сечение It's Numbered

Британская студия веб-дизайна MmDesign, также использует золотое сечение в дизайне своего сайта:

Золотое сечение MmDesign

Общий анализ

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

Это интересно: «Как создавать треугольные формы».

Понравился материал? Расскажи о нем всем:
Оцените эту статью:
Прокомментируйте:
Ваше имя:
Гость  •  2012-06-19 22:06:37
Есть ошибочки. 1024 / 1.618 = не 623.88, а 632.88 и
не 623.88 ≈ 624, а 632.88 ≈ 633

"Твиттер, после редизайна в 2011 году ... как части золотого прямоугольника, т.е. 1:1618:" - 1:1.618
Андрей  •  2012-06-20 18:25:47
Спасибо, исправил.
Гость  •  2013-02-01 16:11:06
Интересная статейка
Анна  •  2013-07-19 10:50:47
Хороший сайт, и замечательные, полезные, интересные статьи! Спасибо!