Друзья, всем привет! Сегодня предлагаю рассмотреть вопрос: Как правильно создать сайт. Речь пойдет про этапы, которые необходимы для достижения результата в виде, «это тот сайт, что я хотел получить», а не «что за говно для меня сделали».
Но для начала давайте разберемся в общей типологии сайтов и их предназначении.
Типы сайтов и их предназначении
Нам необходима правильная постановка задачи. Каждый сайт решает определенную задачу:
Landing page – да друзья, это тоже веб сайт, хоть и одностраничник. Отлично подходит, если у вас есть отдельно взятый товар/услуга. На лендинге можно проработать основные возражения потенциального клиента.
Например:
- Возражение №1 – Это не для меня
- Решение – создаем блок, где описываем для кого подходит данный товар/услуга с тем расчетом, чтобы наш потенциальный клиент смог отождествлять себя с нашим продуктом / услугой.
- Возражение №2 – Я не доверяю этой фирме
- Решение – Добавляем на сайт отзывы, сертификаты и другие наши знаковые отличия, которые располагают к нам клиента.
- Возражение №3 – Еще успею купить
- Решение – создаем акцию, ограниченную во времени.
И так далее. Главное это составить список наших потенциальных клиентов и затем на сайте расположить решения, благодаря чему мы сможем добиться значительной конверсии.
Сайт компании – веб сайт, подходящий для позиционирования услуг компании в сети интернет. Как правило, эти сайты имеют следующую структуру:
- О нас
- Услуги
- Акции
- Отзывы
- Сотрудничество
- Контакты
Это базовый перечень разделов и, в зависимости от задачи, которую должен решать такой сайт, и от сферы работы компании, могут быть предложены какие угодно разделы!
Так же, для лучшего представления каждой услуги на сайте, ее можно оформить как отдельный лендинг, т.е. получится несколько лендингов услуг в рамках одного сайта компании.
Вообще, проработанная подача материала на странице, очень помогает в навигации клиентам и увеличивает общую конверсию сайта
Интернет магазин – онлайн витрина, в которой помимо информации о компании, уже присутствуют:
- Категория товаров с возможностью фильтрации товаров
- Карточка товаров – с информацией о товаре, характеристиках, отзывах и т.д.
- Корзина товаров и страница оформления товаров.
- Личный кабинет пользователя
- Другие инфо-страницы
По сути интернет магазин – это инструмент аналогичный оффлайн магазину, только более удобный и функциональный.
Так вот, как правило, клиенту сложно определится, какие решения ему требуются и это нормально. Поэтому необходимо:
- Заполнение брифа на разработку сайта, это такой опросник, чтобы понять, какой сайт для вас необходимо сделать.
- Разработка ТЗ, которое включает в себя:
- Составление ответственности – кто и какие работы будет проводить. Например: программирование – исполнитель, а предоставление информации – заказчик.
- Составление общих требований к сайту – т.е. надо указать:
- Кроссбраузерность сайта.
- Рабочую область дизайна ( 1280px).
- Размеры для адаптивного дизайна (767px и 375px).
- Подключение API компании доставки.
- Подключение онлайн консультанта и так далее.
- Составление структуры сайта – исходя из услуг/ товаров необходимо сгруппировать какие разделы будут, сопоставить с данным поисковых систем о ключевых словах, т.к. структура должна быть «понятна» пользователям и поисковым системам. Например, при формировании структуры сайта по продаже Рюкзаков, нужно подобрать категории по семантике «Рюкзак спортивный» «Рюкзак ортопедический», «Рюкзак для мальчиков», «Рюкзак для девочек» и др., т.к. подобные запросы люди вводят в поисковую систему и следовательно мы сможем их кластеризовать (распределить) по категориям, что позволит нам шире охватить целевую аудиторию сайта.
- Описание в ТЗ логики работы элементов сайта. Например, при нажатии в раздел Акции – мы переходим в рубрику акций, где каждая акция будет отдельной записью. Или при нажатии кнопки «Купить» мы увидим попап, который содержит кнопки «Продолжить покупки» «Оформить заказ» «Оформить в 1 клик» и далее описываем что происходит при нажатии каждого из этих элементов.
Важно помнить, что составление ТЗ – это залог хорошо сделанного сайта. В сети на эту тему есть хорошая пословица: «Без ТЗ и результат ХЗ». Техническое задание должно трактоваться однозначно, кто бы его не прочитал, только так можно добиться того результата, который вы хотели получить изначально!
- Создание дизайна. Этап, при котором дизайнер сделает визуализацию всех элементов согласно ТЗ. Как и где они будут расположены, как выглядят всплывающие формы, как работают элементы при наведении и при нажатии – все это должно быть учтено в дизайне и так же реализована адаптивная верстка. Как правило дизайн нужен в 3х разрешениях:
- ПК – 1280px
- Планшет -767px
- Мобилка – 375px
- Внесение правок в дизайн и окончание работ по дизайну. Дизайн – это дело вкуса и он должен помогать пользователю в навигации по сайту. Нам нужно убедиться, что дизайнер нарисовал все элементы по ТЗ и что сделал он это хорошо. Критерии, по которым можно оценить дизайн – это качественная проработка элементов. Элементы сайта должны быть современными и красивыми. Что бы было с чем сравнить, есть хороший сайт, где размещают самые крутые дизайны в сети https://www.awwwards.com/
- Реализация функционала из ТЗ программистом –делается независимо от верстки сайта. Если делается сайт на движке, важно, чтобы программист «не лепил костыли» и не переделывал ядро CMS, на которой делаете сайт, иначе вы попросту не сможете нормально обновить движок и будущему разработчику будет намного сложнее разобрать после «попередникив», что увеличит стоимость работ или усложнит поиск специалиста.
- Верстка адаптивного дизайна по макету – т.е. интеграция дизайна на сайт. Верстальщик выполняет работу после программиста. Например программист сделал главную по функционалу, реализовал на главной слайдер, блоки текста и картинки «О нас», вывел меню – после этого верстальщик его сможет взять в верстку.
- Тестирование и сдача работ по ТЗ – необходимо проверить, чтобы сайт работал так, как описано в техническом задании!
Вот такой нехитрый подход, позволит вам минимизировать потраченное впустую время и нервы при создании сайта.