как разработать сайт?

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

1. Имиджевый сайт — создание/поддержание имиджа компании/продукта. Как правило, имиджевые сайты не содержат сложного функционала, однако при этом они часто имеют интересное графическое решение, различные интерактивные элементы развлекательного характера, анимацию, звуковые эффекты. Часто имиджевые сайты являются краткой интернет-презентацией компании. Так как обычно объём страниц такого сайта невелик, его часто называют «сайтом-визиткой».
2. Корпоративный информационный сайт — предоставление информации о продуктах или услугах компании её клиентам и партнёрам. Также содержит информацию о компании. Такие сайты всегда содержат интерактивный каталог продукции или услуг, в котором каждый продукт компании имеет подробное описание с фото, часто такие каталоги могут быть выполнены по функционалу интернет-витрины, т.е. содержат в описании товара возможность его заказа или запроса подробной информации о нём. Кроме каталога, у подобного сайта имеется многоуровневое меню, с различной информацией о компании. Например, меню часто содержит разделы Услуги с детальным описанием услуг которые предоставляет компания, раздел Прайс-лист с ценами на товары/услуги, раздел Новости с информацией о последних событиях (скидках, акциях) в компании. Примером может служить сайт нашего креативного агентства.
3. Интернет-магазин — активные продажи через интернет. Сайт с функциями интернет-магазина содержит каталог товаров и функцию дистанционных оплат. Это может быть интеграция с банковскими платёжными системами (для оплаты товаров кредитными картами), системами интернет-платежей (Web-Money, Яндекс.Деньги, PayPal), а также интерактивное выставление счетов на безналичную оплату. Также интернет-магазин часто интегрируется с программами складского учёта (например, 1C), что позволяет синхронизировать информацию о наличии товара на складе и информацию о совершённых покупках, постановку товара в резерв и т.п.
4. Корпоративная информационная система — управление бизнес-процессами компании, управление проектами, организация рабочих групп, организация совместной работы удалённых офисов. В большинстве случаев, сайт является лишь верхушкой «айсберга» информационной системы. Большая часть функционала информационной системы может быть вынесена в интранет (внутреннюю сеть компании) — это позволяет увеличить быстродействие системы, а также сделать её частично независимой от наличия доступа в интернет.
5. Социальная сеть — общение и обмен информацией между пользователями. Подобные ресурсы являются многопользовательскими, основной упор при их создании делается на механизмы авторизации пользователей и защиты их аккаунтов. Как правило, такие ресурсы включают в себя какую-либо систему обмена сообщениями между пользователями, почтовый сервер, личные кабинеты/личные страницы пользователей, систему рейтинга пользователей. Коммерческий функционал социальных сетей основан на управлении рекламными блоками, размещаемыми на страницах пользователей и биллинговой системе (в случае наличия платных услуг/аккаунтов).

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

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

• обязательные пункты меню — это пункты общие для всех сайтов, которые вы сразу можете включить в меню, например, страница Контакты (содержит телефоны, адрес, схема проезда) обязательна практически для любого сайта, страница О компании (может содержать краткую справку о компании, её историю), страница Новости, Карта сайта и т.п.
• специальные пункты меню — пункты непосредственно связанные с деятельностью вашей компании. Чтобы определить их мы рекомендуем собрать воедино информацию, которую вы предполагаете представить на сайте и логически упорядочить её по разделам. Например, наука -> [физика, математика, химия], станки -> [слесарный, столярный, фрезерный] или Контакты -> [филиал Москва, филиал Киев, филиал Нью Йорк]

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

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

Чтобы избежать подобной ситуации необходимо начать готовить текстовый и графический контент заранее. На момент сдачи проекта у вас должно быть готово не менее 70% от общего объёма контента. Ниже мы приводим небольшие правила по подготовке контента.

• графические файлы предоставляются в форматах JPG, PNG или GIF. Важно знать, что файлы JPG более подходят для фотографий, файлы GIF для относительно простой графики — рисунков, диаграмм и т.п. графики с небольшим количеством цветов в палитре. Разрешение графики, если она не будет использоваться для вывода на печать типографского качества должно составлять 72 точки на дюйм (dpi). Высота и ширина графики и фотографий диктуются дизайном сайта и размером его текстовых полей. В любом случае, помните, что «вес» не должен превышать в общем случае 60 килобайт. Поэтому не увлекайтесь высококачественной графикой — лучше выложить полновесные презентации и поставить на них ссылку, чем заставить посетителя каждый раз загружать ненужные ему файлы огромного размера.
• текстовые файлы предоставляется в формате .DOC, .TXT или .RTF, если в документе присутствуют рисунки — они прилагаются к файлу отдельно, в тексте же даётся коментарии вида (здесь вставить filename.jpg) или подобный. В тексте должно быть минимум форматирования, цветных пометок, разнокалиберных заголовков и сносок, т.к. при переносе текста на сайт должен быть отформатирован в соответствии с дизайном сайта и его концепцией. Хорошо, если все текстовые документы приведены к единому знаменателю, например — название в меню, заголовок страницы, абзацы текста с графикой, заключительный абзац. Это существенно ускоряет работу верстальщика и контент-менеджера, т.к. они освобождаются от необходимости вылавливать нужные фрагменты в документах разных типов, с разным форматированием и структурой.

Конечно, контент при размещении подвергается дополнительной обработке. Для фотографий это может быть кадрирование, цветокоррекция, адаптация размеров, для текстов — поисковая оптимизация, корректорская и редакторская правка, рерайтинг (адаптация к стилю сайта текстов, которые были написаны заказчиком). Однако от его первоначального качества зависит стоимость этой обработки.

Если клиент не может справиться с задачей написания текстов для сайта, а также подготовки фотографий (а такие ситуации возникают довольно часто, особенно при размещении каталогов продукции, когда фотографии товаров могут измеряться десятками тысяч), креативное агентство Ad Once может взять на себя эту задачу. Стоимость каждого проекта обсуждается отдельно, ввиду того, что задачи могут быть разнообразными — от сканирования и распознавания текстов, до написания PR-статей или постановочной фото и видеосъёмки.

1. Составление сметы
   На этом этапе мы получаем запрос на разработку сайта с пожеланиями относительно его функционала. заказчик заполняет бриф на разработку и высылает его нам. Мы прорабатываем фирменный стиль заказчика, его положение на рынке, анализируем его безнес-процессы, конкурентов, их сайты и на основе этих данных предлагаем функционал сайта, наличие/отсутствие определённых элементов, предположительную цветовую гамму и дизайнерское решение. На основе этих данных составляется смета разработки и её тайминг (календарный план выполнения работ).
2. Разработка модульной сетки
   Опираясь на структуру меню и функционал дизайнер интерфейсов разрабатывает технический дизайн сайта. Т.е. определяет места основных элементов на страницах сайта. Результатом этой работы является таблица, в которой все элементы сайта представлены в виде ячеек определённого размера.
3. Разработка дизайна
   Дизайнеры разрабатывают дизайн сайта на основе фирменного стиля заказчика. На этом этапе может быть разработано несколько вариантов дизайна. После утверждения заказчиком разрабатывается дизайн для всех страниц сайта.
4. Привязка дизайна к системе управления
   Программисты осуществляют установку системы управления на тестовом хостинге агентства. Дизайн превёрстывается в HTML-код и интегрируется с системой управления.
5. Дополнительные модули
   На этом этапе программируется дополнительный функционал, который разрабатывается исключительно для нужд этого сайта. Он устанавливается в виде модулей системы управления.
6. Тестирование на хостинге Ad Once
   Контент-менеджер осуществляет начальное наполнение нескольких страниц сайта контентом, уделяя особое внимание работе дополнительных модулей. Бета-тестер анализирует работу всех программных модулей сайта, качество и быстродействие системы в целом. Обнаруженные проблемы и неисправности оперативно исправляются программистами.
7. Наполнение контентом на хостинге Ad Once
   Контент-менеджер(ы) наполняет все страницы сайта содержимым. SEO-эксперт осуществляет начальную поисковую оптимизацию.
8. Перенос на хостинг заказчика, тестирование
   Копирование сайта на хостинг заказчика и тестирование всего функционала сайта, а также быстродействия системы в целом. SEO-эксперт вносит сайт в рейтинги поисковых систем.
9. Сдача проекта
   Предоставление доступа к системе управления сотрудникам заказчика. Инструктаж сотрудников заказчика.

В разработке участвуют: