Расчет интернет-магазина на примере

Как мы рассчитываем стоимость

Чаще всего у наших клиентов есть какой-то пример интернет-магазина, это может быть сайт конкурента или вообще из другой ниши, и в данной статье мы покажем, как мы делаем расчет стоимости на примере ...

Интернет-магазина керамической плитки

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

О1.

Dизайн

Создание дизайна для интернет-магазина задача наиболее сложная, потому что в отличии от лендингов, промо сайтов и даже имиджевых корпоративных сайтов, где есть огромная возможность для полёта творческой фантазии в интернет-магазинах ключевую роль играет не креативная визуализация, а так называемые UI и UX (User interface и User Experience ) удобство использования и взаимодействия пользователя с сайтом. И это уже намного сложнее в реализации, чем просто креативные анимационные переходы между блоками.

Дизайн Простой или Сложный

Если упростить понимание Дизайна интернет-магазина до Простого и Сложного, то простым можно назвать дизайн стандартной структуры, где блоки большинства интернет-магазинов идут примерно одинаково: шапка, слайдер баннеров, каталог, виджеты вывода товаров разных категорий (хиты, новинки, скидки), бренды, статьи, информация о компании, подвал с картой сайта.

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

Простой

Сложный

Дизайн Простой

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

О2.

Настройка CMS
структуры сайта

После того, как определились с дизайном, мы переходим к следующему этапу — мы детально описываем все элементы структуры сайта. Вот как это выглядит на практике.

Сначала мы создаём карту сайта, в которой в виде списка прописываем все компоненты:

Так как у нас есть пример сайта, который будет служить нам прототипом, работу по разработке прототипа в смету включать мы не будем

О3.

Программирование компонентов

После того, как определились с дизайном, мы переходим к следующему этапу — мы детально описываем все элементы структуры сайта. Вот как это выглядит на практике.

Блок Баннер

Слайдер баннеров

Есть два типа баннеров:

1) Нарисованный баннер (как на этом сайте)

2) Редактируемый баннер, в котором можно менять картинку и текст при необходимости.

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

  • -25%
    Дополнительные функции 2 000  1 500 
  • -25%
    Дополнительные функции 3 350  2 500 

Блоки Скидки, Новинки, Хиты

Предыдущая
Следующая

Виджет «Вывод категорий Каталога»

Этот виджет позволяет вывести на главную страницу сайта любые категории товаров.

На данном сайте на главную были выведены посредством этого виджета 3 категории:

Скидки, Новинки и Хиты продаж

Но мы считаем это как три блока с одним установленным виджетом.

Блок Популярные товары

Виджет «Вкладки с вложенным шаблоном»

Этот виджет позволяет вывести на главную страницу сайта несколько категорий товаров в одном блоке в виде вкладок.

На данном сайте на главную были выведены посредством этого виджета 3 категории:

Настенная плитка,
Керамогранит,
Напольная плитка

Блок Адреса магазинов

Информационный блок

Этот блок содержит какую-то одну конкретную оформленную единицу информации.

Информационный блок может содержать только текст и фото/видео контент.

Блок Бренды

Слайдер вложенных шаблонов

Этот слайдер позволяет прокручивать изображения, выводить их предпросмотр, а так же делать их ссылками.

На данном сайте логотипы популярных брендов, настроены в качестве ссылок, ведущие на соответствующие категории в каталоге.

Блок Полезные статьи

Модуль «Записи»

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

К таким типам информации относятся такие блоки как: Новости, Статьи, Отзывы, Акции ...

  • -25%
    Дополнительные функции 6 650  5 000 

О4.

Наполнение
контентом

Для наполнения сайта контентом мы на выбор заказчика делаем Копирайтинг (создание уникального текста) или Рерайтинг (Переписываем готовый текст).

Наполнение сайта контентом

Копирайтинг

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

Рерайтинг

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

Стоимость рассчитана на 1 страницу сайта. В нашем сайте примере 14 страниц. Возьмём в расчет Рерайт готового текста.

О5.

Каталог

Модуль «Каталог товаров»

✅ Настройка отображения карточек товара
✅ Страница "Корзина" заказов
✅ Страница оформления заказа
✅ Настройка уведомлений клиента и магазина

Фильтр по параметрам

✅  Покупка и Настройка модуля
✅  Фильтр по цене
✅  Фильтр по наличию
✅  Фильтр по категориям
✅  Фильтрация по атрибутам

Модуль «Комплект товаров»

Позволяет собирать Комплекты из отдельных товаров.

Печать страницы товара

Позволяет отправить на печать страницу товара.

Загрузка товаров к Каталог возможна тремя способами: ручное добавление, файловая загрузка и выгрузка из базы 1С

Как происходит наполнение Каталога при файловой загрузке

Парсинг товара с сайта донора

Позволяет скачать товары с сайта донора со всеми категориями, параметрами и атрибутами. Стоимость парсинга 2990 руб. указана за 1 сайт. В расчет возьмем 10 сайтов доноров.

Модуль «Импорт товаров»

Позволяет осуществлять массовую файловую загрузку товаров в каталог сайта из файла со всеми параметрами и атрибутами.

Интеграция сайта с базой 1С подходит для крупных магазинов с большим каталогом товаров

Парсинг товара с сайта донора

Позволяет скачать товары с сайта донора со всеми категориями, параметрами и атрибутами. Стоимость парсинга 2990 руб. указана за 1 сайт. В расчет возьмем 10 сайтов доноров.

Выгрузка в 1С и Интеграция с сайтом

Делаем выгрузку спарсенных товаров в базу 1С и настраиваем Скрипт обмена между базой 1С и базой данных каталога интернет-магазина.

Ручное наполнение Каталога подходит, если количество товаров не большое

Ручное добавление товаров

Мы добавляем до 100 товаров вручную для заказчика в качестве примера, чтобы он мог в последствии самостоятельно добавлять товары.

Добавление товаров с параметрами

Товары с параметрами и атрибутами имеют более сложную структуру, поэтому их добавление стоит дороже.

Можно добавить следующий функционал, не реализованный на сайте примере...

➕ Умный поиск с подсказками, ценой и кнопкой "В корзину"

➕ Печать страницы "Корзина"

➕ Создание ссылки на Корзину с добавленными товарами
➕ Модуль «Система лояльности» - Скидочная система
➕ Интернет Эквайринг - Модуль онлайн оплаты
➕ Модуль «Онлайн Рассрочка»

О6.

Хостинг
и домен

Хостинг — это комплекс услуг, которые позволяют разместить сайт или другие данные в сети Интернет. Обычно, под фразой "хостинг для сайта" имеется ввиду место и мощности на сервере

VDS/VPS Хостинг

Мы не используем виртуальный дешевый хостинг, только VPS/VDS (virtual personal/dedicated server) — выделенный сервер. Это более надежно, эффективно и безопасно.

Домен

Мы можем подобрать и зарегистрировать для заказчика доменное имя в зоне .ru и .рф Международные домены типа .com более дорогие и это уже по согласованию с заказчиком.

О7.

Безопасность

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

К системе безопасности сайта мы относим несколько компонентов:

Модуль «Антивирус»

✅  Плагин Wordfence - $99 (7650 р.) в год
Wordfence включает в себя межсетевой экран конечной точки и сканер вредоносных программ

Модуль резервного копирования

✅   Настройка общего объёма занимаемых резервных копии
✅   Исключение отдельных файлов из резервной копии
✅   Проверка работы резервного копирования
✅   Восстановление данных из резервной копии

Только официальные плагины

Мы не используем взломанные плагины и программы, которые имеют уязвимости и создают угрозу безопасности сайта

О8.

Аналитика

Веб-аналитика (Web analytics) — система измерения, сбора, анализа и интерпретации информации о посетителях вашего сайта с целью их улучшения и оптимизации. Основной задачей веб-аналитики является анализ посещаемости сайта и его конверсии в целевое действие посетителя

Яндекс Метрика

собирает данные с сайта и формирует отчёты и видеозаписи действий отдельных посетителей, это позволяет узнать, что ищут люди на вашем сайте, собирать статистику по каждому объявлению в Директе и следить за конверсией даже в офлайне.

Google Analytics

Фактически выполняет те же задачи, что и Яндекс Метрика по сбору и анализу данных на сайте в непрерывном потоке.

О9.

SEO оптимизация

SEO (search engine optimization) — это оптимизация внутренней структуры сайта с целью исполнения и требований поисковых систем для поднятия его на топовые позиции в выдаче поисковых систем.

На сайте примера SEO оптимизация практически отсутствует ...

SEO оптимизация

✅  Настройка robots.txt
✅  Открытие для индексации JS и CSS в robots.txt
✅  Создание и настройка sitemap
✅  Настройка ЧПУ (человеку понятных ссылок)
✅  Оптимизация Title, метатегов Description, Keywords
✅  Оптимизация заголовков H1, H2, H3
✅  Настройка атрибутов alt и title у изображений
✅  Внедрение атрибутов title у ссылок

✅  Настройка robots.txt
✅  Открытие для индексации JS и CSS в robots.txt
✅  Создание и настройка sitemap
✅  Настройка ЧПУ (человеку понятных ссылок)
✅  Оптимизация Title, метатегов Description, Keywords
✅  Оптимизация заголовков H1, H2, H3
✅  Настройка атрибутов alt и title у изображений
✅  Внедрение атрибутов title у ссылок
+
✅  Валидация  – приведение код в соответствие стандарту W3C
✅  Микроразметка Schema.org и микроформаты html
✅  OpenGraph – разметка для соцсетей
✅  Устранение битых ссылок (4** коды)
✅  Настройка страницы 404, либо настройка переадресации 
✅  Устранение ссылок на редиректы
✅  Настройка 301 кода – для перенаправления новых страниц
✅  Закрытие исходящих/внешних ссылок на сайте в rel=nofollow
✅  Скрытие внутренних ссылок запрещенных в robots.txt

Ускорение сайта

Скорость загрузки сайта напрямую влияет на поисковое продвижение сайта. Поисковые системы диктуют нам свои правила и учитывают скорость загрузки сайта при ранжировании в результатах поиска.

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

✅  Размер сайта Заказчика – до 50 Гб
✅  Контрольные страницы – 2 (Главная + Каталог)
✅  Время загрузки сайта 1-3 сек.

✅  Оптимизация настроек Nginx, Apache
✅  Оптимизация мобильной версии
✅  Оптимизация изображений
✅  Оптимизация скриптов и стилей (JS, CSS)
✅  Сокращение количества блокирующих скриптов JS
✅  Подключение протокола HTTP/2
✅  Оптимизация настроек протокола безопасности TLS
✅  Оптимизация настроек протоколов передачи данных TCP
✅  Оптимизация настроек баз данных MySQL, PostgreSQL
✅  Оптимизация SQL-запросов и схемы БД
✅  Компрессия текстовых файлов
✅  Профилирование серверного кода (PHP)
✅  Оптимизация HTML-вёрстки
✅  Оптимизация подгружаемых или встроенных шрифтов
✅  Проведение работ на отдельной копии сайта

 

✅  Размер сайта Заказчика – от 50 до 250 Гб
✅  Контрольные страницы – 5
(Главная + Раздел/Категория + Страница + Каталог + Товар)
✅  Скорость загрузки сайта 1-1,5 сек.

✅  Оптимизация настроек Nginx, Apache
✅  Оптимизация мобильной версии
✅  Оптимизация изображений
✅  Оптимизация скриптов и стилей (JS, CSS)
✅  Сокращение количества блокирующих скриптов JS
✅  Подключение протокола HTTP/2
✅  Оптимизация настроек протокола безопасности TLS
✅  Оптимизация настроек протоколов передачи данных TCP
✅  Оптимизация настроек баз данных MySQL, PostgreSQL
✅  Оптимизация SQL-запросов и схемы БД
✅  Компрессия текстовых файлов
✅  Профилирование серверного кода (PHP)
✅  Оптимизация HTML-вёрстки
✅  Оптимизация подгружаемых или встроенных шрифтов
✅  Проведение работ на отдельной копии сайта
✅  Консультация разработчиков клиента

ИТОГО

Итак, мы разобрали все компоненты, из которых состоит сайт, который мы взяли в качестве примера, подведем итоговую сумму всех работ, требуемых для разработки аналогичного сайта:

01. Как в примере