5 Ноя 2010 10

Виды сайтов

Рубрика: Дизайн сайтов

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

Виды сайтов, какие они бывают и почему именно так.

Я делю сайты на три категории:

  1. Информационный
  2. Промо
  3. Корпоративный

Все, эти три категории полностью охватывают в себе все виды и подвиды и помеси.

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

http://www.lenta.ru

http://autorambler.ru

http://www.panasoniceplaza.ru

http://www.championat.ru

Особенности информационных сайтов:

  1. Большой объем контента, как правило часто обновляемого
  2. Постоянная аудитория, которая приходит за обновлениями
  3. Сложная структура вложенности (страницы, рубрики, метки)
  4. Очень часто контент генерируют пользователи: текст, видео или картинки

Что должен знать дизайнер и заказчик при разработке сайта:

  1. Такие сайты читают люди, обычные водители, домохозяйки, юристы, врачи…
  2. Объем графики не должен превышать 10-20% всего сайта, при этом графика используется для подчеркивания принадлежности сайта к той или иной нише (медицина, наука, школа, строительство…), чаще всего какие то элементы в шапке
  3. Графика должна быть максимально качественно, так как её мало
  4. Обязательно должны быть акценты на сайте, к примеру выделены самые важные новости,популярные картинки, акции и скидки или специальные предложения, делается это для разгрузки «однообразной массы» содержания
  5. Хорошо различимые заголовки, текст, навигация
  6. При разработке информационных сайтов необходимо детально прорабатывать структуру рубрик и страниц, стараться её сократить не в ущерб удобству
  7. Поиск, хорошо заметный поиск, желательно с возможность фильтрации, — то есть расширенный вариант

Хотелось бы остановится на распространенном заблуждении, «на сайте должно быть мало графики, потому что, много долго грузится» — на дворе 21 век, интернет развивается сумасшедшими темпами и не стоит забывать, что большая часть пользователей живет в крупных городах, где скоростным каналом никого не удивишь. Плюс ко всему сайты кешируются браузерами и повторная загрузка происходит намного быстрее. Много графики на информационных сайтах нельзя использовать по одной простой причине, там постоянная аудитория, да пришел первый раз подрочил на красивые картинки, все. Дальше я прихожу на сайт читать и смотреть. Графика по отношению к тексту в сотни раз визуально сильнее. Поэтому со временем даже постоянная графика начинает надоедать и элементарно отвлекает от чтения текста и просмотра материалов. Информационный сайт от слова «информация» — взять тот же Хабр,что у него плохой дизайн из-за отсутсвия картинок? нет! lastfm.ru — может тут плохой дизайн? нет! championat.ru — а может тут? нет! Эти сайты сделаны людьми и для людей — постоянных читателей и слушателей. Или у ластфма нет денег на «крутого» дизайнера, студию, которая за пару десятков килопрезидентов отпидорасит сочных картинок? На эти сайты хочется вернуться, потому что там поставили во главу — информацию и её удобную подачу.

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

http://www.nikesnowboarding.com

http://www.sovbut.ru

http://maulnet.ru/tools/ — да, да, своего рода промо-сайт, дальше слава Чак Норрису, графика не пошла.

Особенности промо-сайтов:

  1. Использование большого количества графики
  2. Как правило изначально есть концепция, идея
  3. Очень часто используются флэш-технологии для «сочности», домохозяйки любят когда вдруг менюшка двигается под курсором мышки и неожиданно сверкает, писают кипятком, инфа 100%
  4. Как такового контента нет и он не обновляется, все внимание приковано к товару за счет красивой обертки
  5. Чаще всего это одноразовые сайты под конкретный товар или услугу, а не для бренда в целом

Что должен знать дизайнер и заказчик при разработке промо-сайта:

  1. Должен быть концепт, идея, как пример тулзы маула, то есть был придуман бордель для оптимизаторов :-) идея прижилась и была реализована, при этом не надо тупить и штамповать: если это миниральная вода, то обязательно горы и лёд. Подумать, подумать
  2. Графика, много и разной должно быть: 80-100%, на него как правило не возвращаются, посмотрел, слюну пустил, заказал или пошел купил товар
  3. Изначально согласовать и проработать с заказчиком все заголовки и тексты

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

http://www.my-homes.ru

http://www.abs-stroy.ru

http://starkgroup.ru

Особенности корпоративных сайтов:

  1. Графика и контент делят сайт пополам, то есть необходимо группу товаров или услуг подать красиво, при этом не забывая про содержание
  2. Четко выраженная направленность и ниша сайта за счет графических элементов
  3. Контент обновляется, но исключительно контент-менеджером или администратором, например новости или новые товары

Что должен знать дизайнер и заказчик при разработке корпоративного сайта:

  1. Графика соответствующая нише сайта, что бы клиент зашел и сразу понял о чем сайт, что он предлагает
  2. Хорошо заметная контактная информация, куда и как можно позвонить, в какое время, куда писать, где находится организация и как туда проехать
  3. Блок с описанием преимуществ компании, почему именно у нас самые лучшие дома или почему наши охранники самые охранные из всех охранников
  4. Хорошо структурированный каталог товаров или услуг с подробным описанием

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

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

Комментарии: 10

  1. Я обыденно делю на:
    блоги
    партнерки
    социалки
    форумы
    СМИ
    прочее
    :)

    ОтветитьОтветить
  2. kyoks
    все что ты назвал, информационные сайты за исключением, партнерок — это корпоративные сайты, вот мы такие вот мы предлагаем такие условия работы, то же красиво нужно подать

    ОтветитьОтветить
  3. Посмотрел предложенные сайты, особенно понравился сайт с радио-ностальгия по ушедшему.

    ОтветитьОтветить
  4. весьма куцая классификация. к чему например отнести фотохостинг или интернет магазин?

    ОтветитьОтветить
  5. webpavilion, как то вы не внимательно читали :-)
    интернет магазин,если большой объем товаров http://www.panasoniceplaza.ru/ или там Эльдорадо, СпортМастер… — это все информационные сайты, если это элитные редкие товары, как правил оформляют промосайтом

    Фотохостинг? Информационный сайт, люди его используют для загрузки и просмотра фото\изображений, то есть сервис для непосредственного обмена информацией между пользователями.

    Вроде все просто.

    ОтветитьОтветить
  6. Спасибо, статья действительно полезная, особенно для начинающих.
    Кстати, уже где-то читал подобную классификацию, освежил память.
    Подписался на блог ;-)

    ОтветитьОтветить
  7. «Кстати, уже где-то читал подобную классификацию, освежил память.»
    Оказывается вебмозг тоже статьи подворовывает :-) .

    А сокращалка ссылок типа bit.ly это какая категория ?

    ОтветитьОтветить
  8. tanatos
    все что относится к обмену информацией,а тем более по схеме пользователь-пользователь, а не сайт-пользователь, в том числе и сокращение ссылок, это информационный сайт,в данном случае обмен идет ссылками.
    Ты когда нибудь видел сайт сокращалку в виде охуенного промо-сайта? Нет потому что важна информация и удобство сервиса, на картинки всем похуй :-) , тем более сайт вообще не участвует визуально в данной цепи обмена

    ОтветитьОтветить
  9. Я бы все-таки добавил такой класс как сервисы. Всякого рода стартапы, оказывающие узкоспециализированные услуги, этого добра развелось в последние годы немеряно. Тот же bit.ly можно отнести туда.

    ОтветитьОтветить
  10. Артём:

    Спасибо, будет теперь что показать заказчику перед работой и нормально объяснить, какой лучше дизайн для его сайта использовать.

    ОтветитьОтветить

Ваш комментарий: (Leave a Comment)