RSS-лента

Лучшие CMS интернета бесплатно для создания сайта

Апр
25

Как выбрать фон для сайта

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

В интернете огромное количество различных фонов для сайта, все фоны очень симпатичные, но к различным сайтам следует подбирать совершенно разные фоны или как по другому их называют Паттерн (англ. pattern – образец, шаблон, система). По сути фон это просто картинка, а в применении к сайту их можно разделить на несколько разновидностей: бесшовные, анимационные, маркетинговые или Html фоны и простые изображения  выступающее в виде фона для сайта. Дизайн сайта не зависимо от целей создания, должен по максимуму влиять на посетителей, поэтому правильный подбор цветовых решений, является ключом к повышению эффективности поставленных задач. Давайте рассмотрим каждую из разновидностей паттернов, и в итоге выберем необходимую для нас.

Фон для сайта бесшовный

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

Примеры бесшовных фонов:

фон для сайта бесшовный

Большое количество бесшовных паттенов имеется на зарубежном сайте subtlepatterns.com. И не переживайте, что это иностранный ресурс, там все очень понятно, и доступно.

 Анимационные фоны для сайта

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

Примеры анимационных фонов для сайта: 

фоны для сайта

demodownload

фон для сайта

demodownload

фон для сайта

demodownload

Маркетинговые фоны для сайта

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

Html фон для сайта

Для того чтобы указать в качестве фона для сайта картинку, в теге BODY используется атрибут background, значением которого является URL-адрес графического файла.

Пример Html фона картинки:

<body  style="background-image url(http://sitename.ru/images/bg.jpg)">
...
</body>

Соответственно, файл bg.jpg это картинка нужного размера.

Пример Html фона одного цвета:

<body  style="background-color: #83C5E9;">

...
</body>

Различные коды цветов можно посмотреть на этой странице.

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

Получай первым обновления блога!

Введите Ваш e-mail:

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


вверх