Фон - Backgorund для сайтов - Online сервисы

Тема в разделе "Веб-дизайн", создана пользователем WiZXaK, 20 дек 2012.

Статус темы:
Закрыта.
Модераторы: zek24
  1. WiZXaK

    WiZXaK Причиняю добро

    Регистр.:
    8 сен 2012
    Сообщения:
    580
    Симпатии:
    807
    Backgorund - один из первых элементов дизайна сайта. Создание фона для сайта должно происходить в совокупной прорисовке всего дизайна в графическом редакторе.
    Но иногда бывают случаи, когда срочно нужна фоновая подложка. Для таких случаев и для новичков в веб дизайне предлагаю подборку online сервисов по фонам (Backgorund).


    Генераторы фонов:
    http://www.stripegenerator.com/ - Один из самых известных "генераторов полос".
    http://www.stripemania.com/ - Для поклонников полосок.
    http://www.tartanmaker.com/ - Генерирует достаточно необычные узоры.
    http://www.ogim.4u2ges.com/gradient-image-maker.asp - Хороший редактор фона.
    http://secretgeek.net/GradientMaker.asp - Простой редактор фоновых подложек.
    http://lab.rails2u.com/bgmaker/ - фон из вашей картинки
    http://www.tilemachine.com/ - Редактор + База фонов.
    http://bgmaker.ventdaval.com/ - Пиксельный редактор в реальном времени. (удобно)
    http://bgpatterns.com/ - Фоны из иконок.
    http://www.colourlovers.com/patterns/add - Редактор красивых фонов
    http://stripedbgs.com/ - Очень простой редактор фонов
    http://www.pixelknete.de/dotter/ - Редактор с просмотром фона
    http://mudcu.be/bg/ - цветной генератор
    http://repperpatterns.com/tool/ - мультяшные bg


    Базы готовых фонов:
    http://www.patterncooler.com/ - Отличный выбор фонов.
    http://www.dinpattern.com/ - База фонов.
    http://patterns.ava7.com/ - Удобная база с фильтром цветам и узорам.
    http://thedesigninspiration.com/category/patterns/ - Большая база фонов.
    http://browse.deviantart.com/resources/applications/patterns/ - Есть интересные фоны.
    http://www.colourlovers.com/patterns - База "бесконечных" фонов.
    http://everydayicons.jp/patterns.html - Небольшая подборка хороших фонов.
    http://www.squidfingers.com/patterns/ - Бесконечные узорные фоны.
    http://alice-grafixx.de/patterns - База разнообразных фонов.
    http://www.kollermedia.at/pattern4u/ - Фоны по жанрам узоров.
    http://donbarnett.com/tiles/tile.htm - Оригинальный сайт с оригинальными фонами.
    http://www.pixeldecor.com/patterns.shtml - Небольшая подборка фонов.
    http://patterrific.com/category/patterns/ - База Бэкграундов
    http://www.noqta.it/dromoscopio/ - База фонов для сайта
    http://www.portfelia.com/ - база фонов
    http://www.brusheezy.com/patterns - Backgorund для сайты
    http://www.stm.dp.ua/web-design/color-site.html - Однотонный цветовой фон

    http://subtlepatterns.com/ - хороший набор паттернов
    http://hotbliggityblog.com/ - фоны для блогов
    http://patternhead.com/ - небольшая база фонов
    http://lostandtaken.com/gallery - Платные и Бесплатные фоны

    Background в CSS
    Свойство background позволяет установить одновременно до пяти характеристик фона: background: [background-attachment || background-color || background-image || background-position || background-repeat] | inherit

    background-attachment - привязка. По умолчанию задано scroll - фон перемещается при прокрутке вместе со страничкой. Можно зафиксировать его, задав fixed.
    background-color - цвет фона. Выбирается из обычной палитры цветов;
    background-image - картинка для фона. Указывается адрес файла изображения;
    background-position - расположение фонового рисунка: в центре, слева, справа, снизу или сверху.
    background-repeat - повторение выбранной картинки.
    background-size, появившееся в css3. позволяет растянуть фоновое изображение до нужного размера (можно задавать значения в пикселях, в процентах от контейнера, чьим фоном оно является, "уместить" его в данный контейнер (cover), а также растянуть по высоте или ширине контейнера(contain).


    "Если с фоновыми изображениями требуется задать цвет фона , он указывается в последнюю очередь."

    И на по следок рекомендации по background
    0) Используйте оригинальные (не cкаченные) фоны для сайта
    1) Фон должен сочетаться со всеми элементами сайта (ваш кэп)
    2) Не используйте яркие, ядовитые цвета фона.
    3) Не используйте сложный рисунок.
    4) Шрифт на фоне должен быть читабельным и не напрягать зрение пользователя.
    5) Совсем не знаете какой фон выбрать? - оставьте белый - это классика (или светлые тона).
    6) Цвет фона должен успокаивать зрения, (или хотя бы не напрягать его).
    7) Фон не должен отвлекать на себя много внимания от содержания (сверх красивый или необычный рисунок - не вариант для фона).
    8) Не используйте анимированный фон! - нет, нет это не красиво. Да я знаю о чем говорю =)
    9) Используйте простой, но оригинальный фон, который позволит легко воспринимать контент сайта.


    P.S: От фона зависит половина восприятия юзерами всего сайта, отнеситесь к выбору фона должным образом, удачи.

    *Не используйте ветку для набора постов - благодарю.*
     
    Последнее редактирование: 14 фев 2014
    sunteem, kabasik, Caro и 9 другим нравится это.
  2. Dj0n

    Dj0n Создатель

    Регистр.:
    5 окт 2010
    Сообщения:
    46
    Симпатии:
    8
    SkandaL и And90 нравится это.
  3. Новый ВебМастер

    Новый ВебМастер Постоялец

    Регистр.:
    26 фев 2013
    Сообщения:
    54
    Симпатии:
    8
    http://www.grsites.com/archive/textures/ - Free Background Textures Library - Бесплатная библиотека фоновых текстур

    удобный выбор текстур, они представлены в виде каталога. при наведении на изображение - это изображение становится background'ом страницы, то есть сразу же можно посмотреть фон на текущем сайте.
    это называется parallax effect (parallax scrolling) - когда разные слои на сайте двигаются с разной скоростью при прокручивании страницы, либо это слои по разному реагируют на движение мышью.

    вот пример с готовым скриптом уже - http://jalxob.com/cool-kitten/
     
    Последнее редактирование модератором: 1 окт 2013
    Caro нравится это.
  4. artefakt777

    artefakt777

    Регистр.:
    15 июл 2012
    Сообщения:
    487
    Симпатии:
    125
    Здесь можете скачать качественную подборку бесшовных фонов
     
    dimOk7 нравится это.
  5. intuitive

    intuitive Создатель

    Регистр.:
    16 янв 2013
    Сообщения:
    15
    Симпатии:
    5
  6. Cold_232

    Cold_232 Писатель

    Регистр.:
    21 июн 2013
    Сообщения:
    3
    Симпатии:
    0
    http://tools.dynamicdrive.com В основном градиенты, но есть и другие некоторые фичи онлайн.
     
  7. darthred

    darthred Писатель

    Регистр.:
    20 окт 2013
    Сообщения:
    1
    Симпатии:
    0
  8. lllmartylll

    lllmartylll Создатель

    Регистр.:
    19 апр 2012
    Сообщения:
    11
    Симпатии:
    0
  9. PanOK13

    PanOK13 Создатель

    Регистр.:
    15 дек 2013
    Сообщения:
    20
    Симпатии:
    8
  10. artefakt777

    artefakt777

    Регистр.:
    15 июл 2012
    Сообщения:
    487
    Симпатии:
    125
    Нигде не могу найти стальной фон для сайта, может кто-нибудь встречал?
     
Статус темы:
Закрыта.