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

1. Правильный процесс дает
правильный результат
Игорь Повшок, руководитель отдела продаж
Разработка и продвижение сайтов,
мультимедиа и интернет-реклама,
фирменный стиль и полиграфия

2. Вы можете не меняться. Выживание не
является обязанностью.
Эдвард Деминг

3. Идеальный сайт
1. Правильный дизайн, ориентированный на целевую аудиторию
2. Удобство пользовательских интерфейсов
3. Навигация сайта
4. Использование различного рода интерактивных сервисов
5. Быстрая загрузка страниц
6. Сайт не тормозит
7. Качественный целевой контент на продающих страницах
8. Лояльность к мобильным пользователям
9. Быстрые и удобные формы для связи, чат, обратный звонок
10. Каналы общения с пользователями: F.A.Q., опросы, тесты
11. Обучающий контент: «Знаете ли вы», Wiki-раздел
12. Отказоустойчивость – сайт, на котором есть вся информация
13. Спецсервисы для увеличения среднего чека и работы с лояльностью
пользователей
14. «Сайт, который продает»

4. Станьте частью команды
Не бойтесь задавать вопросы и уточнять
ШАГ 1. БРИФ
Конкретизируйте
Доносите через бриф потребности своей ЦА
Четко донесите свою бизнес-стратегию
Вообще, решите для чего вам сайт
Вы получите: Максимально точный бюджет
Максимально точные сроки
Качественный инструмент на выходе

5. НЕВНЯТНОЕ ТЗ – РЕЗУЛЬТАТ ХЗ
Увеличение бюджета на дизайн
Увеличение бюджета на программирование
Увеличение бюджета на ведение проекта и тестирование
Увеличение общего срока на разработку

6. ШАГ 2. SEO-АУДИТ САЙТА
Будущего / текущего сайта
Анализируем конкурентов
Формируем правильную структуру ваших разделов
Даем рекомендации / требования
для более эффективной отдачи от будущего сайта
Даем SEO-требования к верстке и программированию

7. Лидеры выдачи

8. Аудит поискового спроса
Проект на SEO-аудит:
Интернет-магазин подарков
и сувениров
Регион: Москва
На скриншоте:
структура сайта

9. Аудит поискового спроса
На скриншоте:
новая структура сайта
по результатам аудита.
Потенциальный охват:
700% от изначального

10. ПОЧЕМУ SEO-АУДИТ ОБЯЗАТЕЛЕН
SEO-компания сказала,
что сайт нужно доработать
Но он же хорошо сделан! Зачем?
Они сказали, что надо переделывать каталог,
формировать какие-то посадочные страницы
и переписывать фильтр на сайте
+2 месяца
+2000$
+2000$, КАРЛ!

11. ПОЧЕМУ SEO-АУДИТ ОБЯЗАТЕЛЕН
• Позволяет избежать неправильной архитектуры проекта
• Позволяет спроектировать наилучшую структуру проекта
• Позволяет получить четкие требования к Техническому
этапу проекта – исключает фактор «плохой разработчик»
• Позволяет занять определенную нишу в сфере
• Экономит последующие бюджеты на доработки,
последующие этапы продвижения сайта

12. Синхронизация Технического отдела и отдела продвижения:
• Исправляются технические SEO-ошибки CMS;
• Внедряется комплекс типовых доработок для правильной индексации сайта и корректного
отображения в выдаче (редиректы, исправление дублей);
• Любой функционал проектируется с учетом правильной индексации страниц и других SEO-требований;
• При запуске всегда прописываются редиректы со старого сайта и настраиваются файлы robots.txt и
sitemap.hml.
Как это отобразится на проекте:
• Ваш сайт будет готов к продвижение с момента запуска.
• Даже без последующего продвижения, ваш сайт будет сносно индексироваться и отображаться в выдаче.

13. ШАГ 3. ТЕХНИЧЕСКОЕ ЗАДАНИЕ

14. Требования к дизайну: референсы, описание ключевых страниц, визуалы,
инфоблоки на страницах – ожидайте от ИСПОЛНИТЕЛЯ РЕАКЦИИ
Требования к ТЗ

15. SEO-требования – типовые и специфичные (см. SEO-аудит )
Требования к ТЗ
Требования к верстке – мобильные платформы, браузеры –
обсуждайте с Исполнителем
Требования к программной части – CMS, тестирование, гарантии,
скорость работы, сервисное обслуживание
Специфичные условия – ОБЯЗАТЕЛЬНО должны быть прописаны в ТЗ
Наполнение сайта, перевод контента
ТРЕБОВАНИЯ К НАГРУЗКАМ, ХОСТИНГУ
ТРЕБОВАНИЯ К ПЕРСОНАЛУ

16. • ТЕХНИЧЕСКОЕ ЗАДАНИЕ
• БРИФ НА ДИЗАЙН
• КОНТЕНТ-КАРТА
95% дизайн-концепций
утверждаются с первого раза
30 дней Чистый срок разработки
сайта в Студии Борового

17. ШАГ 4. ДИЗАЙН
или поиграйте со шрифтами
• Дизайн под ЦА
• Дизайн ради сайта, а не наоборот
• Легкость графики
• Не гонитесь за трендами
• Контент – всегда главный

18. Быстрый запуск сайта

19. Правильный дизайн – какой он?
ВСЕ ДЕЛО В ИДЕЯХ
ВСЕ ДЕЛО В ПОЛЬЗОВАТЕЛЯХ

20. Дизайн – это первое и часто
единственное,
что заставляет посетителя
остаться на сайте

21. Правильный дизайн
• Идентифицируемость
• Аккуратность в количестве цветов – сайт должен
помогать, а не отвлекать
• Контакты, точки продаж, адреса магазинов
максимально заметно
• «Принцип наименьшего удивления»
• Давайте пользователям инструменты для работы с
каталогом
• Делайте «аккуратную» рекламу

22. КОНТЕНТ
Дизайн контента Подача контента

23. КОНТЕНТ
Дизайн контента

24. КОНТЕНТ
Дизайн контента

25. ЮЗАБИЛИТИ
Цель – найти оптимальный баланс между
удовлетворенностью пользователей и
достижением бизнес-показателей.
• Увеличение конверсии пользователей
(получил консультацию, запросил информацию, заполнил заявки)
• Увеличение продаж
(положил в корзину , сделал быстрый заказ)
• Уменьшение нагрузки на менеджеров
(охват всех типов пользователей с предоставлением информации)

26. Юзабилити

27. Корзина заказа
Контрольный вариант А Альтернативный вариант B

28. Результат: кнопка «Купить»
Результаты теста в инструменте Optimizely

29. Визуальное представление продукта

30. ШАГ 5. HTML-КОДИРОВАНИЕ
Mobile-friendly
SEO-friendly
Оптимизированная по скорости
и никак иначе

31. Mobile-friendly сайт.
Адаптивность как необходимость
• Избегайте
«недружелюбного» ПО
• Текст должен быть читаем
без зума
• Избегайте скролла

33. Когда сам Google намекает…

34. 61% пользователей вряд ли
вернутся к мобильной
версии сайта, если у них
были какие-то проблемы с
доступом к этому сайту с
телефона.

35. https://www.google.com/webmasters/tools/mobile-friendly/

37. Нужна ли мобильная версия сайта?
Смотрим аналитику!

38. Разбор одного проекта
Изображение – 1. Показатель отказов из мобильного трафика.

39. Разбор одного проекта
Изображение – 2. Увеличение мобильного трафика за период в 6 месяцев.

40. Разбор одного проекта
Изображение – 3. Количество страниц просмотренных за сеанс.

41. Разбор одного проекта
Изображение – 3. Количество страниц просмотренных за сеанс.

42. Разбор одного проекта
Изображение – 4. Показатели за период в 6 месяцев.

43. Мы используем новейшие технологии (для ускорения и качества работы):
• HTML5;
• CSS3;
• Препроцессоры LESS/SASS/Compass;
Тесная интеграция с файловой структурой CMS Bitrix
Верстка адаптирована под динамический контент
Верстка проекта проходит обязательное автоматическое и ручное тестирование
Верстка по умолчанию адаптивная / отзывчивая
В верстку изначально заложена оптимизация для SEO
Все картинки минимизированы без потери качества
В верстку встроена поддержка User Interface

44. МОБИЛЬНОГО ИНТЕРНЕТА БОЛЬШЕ НЕТ!

45. ШАГ 5. ПРОГРАММИРОВАНИЕ
• Правильная CMS: 1С-Битрикс или любая другая ПОПУЛЯРНАЯ
• Возможность контроля внедрения
• Информация по работе с CMS
• Обновление и поддержка
• Скорость загрузки страниц и инструменты

46. Скорость
Сайты, время загрузки которых больше
3 секунд, теряют 40% пользователей.
А пользователи, зашедшие с мобильных
устройств, уйдут с сайта после 5 секунд
ожидания.
Трафик

47. Скорость
Конверсия
Каждая дополнительная секунда в загрузке
сайта ведет к потери 7% конверсии.
Сокращение времени загрузки
посадочной страницы Mozilla
вылилось в увеличение
конверсии на 15,4%, что
привело к 60 млн. новых
загрузок в год. Это была
просто разница в две
секунды…

48. Реально, Володя, 14%
Да не гони!

49. Скорость Прибыль
79% покупателей интернет-магазина,
недовольных его скоростью, скорее
всего, не купят снова на том же сайте.
2014 год 9315 интернет-магазинов
=
2015 год 16 577 интернет-магазинов

50. Скорость Прибыль=
Группа товаров Кол-во интернет-магазинов
Электротовары 1516
Строительные материалы 816
Телерадиотовары 786
Вычислительная техника 743
Шелковые ткани 34
Меха и меховые изделия 26
Безалкогольные напитки 21
Кондитерские изделия 19
…
2014г

51. 1. Устраните 404 ошибки и отсутствующие ресурсы
2. Оптимизируйте изображения
3. Объедините и минимизируйте JavaScript
4. Сокращайте число запросов к сторонним сайтам
5. Используйте CDN
Тормозит? Что делать?

52. Скорость
Отказы

53. https://developers.google.com/speed/pagespeed/insights/

55. По данным исследования американской компании Akamai:
 47% пользователей ожидают 2 секунды
 40% посетителей уходят после 3 секунд
 52% утверждают, что быстрая загрузка влияет на их лояльность
 3 секунды ожидания уменьшают лояльность клиентов примерно
на 16%
В другом исследовании — The Gomez Peak Time Internet
Usage Study, проведённом Equation Research:
 в часы пик 75% посетителей ушли на сайты конкурентов
 88% заявили, что вряд ли вернутся на сайт после неудачной
попытки его открыть
 больше половины пользователей выразили менее позитивное
мнение о компании в целом, если сайт медленно открывался
 более трети поделились негативным впечатлением со
знакомыми
Цифры

56. Качество внедрения
• Соблюдение требований к разработке 1С-Битрикс
• Использование стандартных модулей и компонентов CMS
• Рекомендованный 1С-Битрикс подход к кастомному коду
• Обязательное проведение Мониторинга качества 1С-Битрикс
• В Студии качество проекта не зависит от исполнителя
• Композитный режим - обязателен
• Оптимизируется вес страниц, JavaScript, CSS. Соблюдются требования Google.
• Настраивается сервер на максимальную производительность.
• Рекомендуем хостера и отвечаем за проект
• Сайты Студии SEO-friendly

57. ШАГ 7. КОНТЕНТ-КОРОЛЬ

58. Контент – «король»
Анализ 10 верхних результатов поиска для
20 000 ключевых слов и выявила
закономерность.
Средний размер контента, размещенного
на странице, попавшей в верхние 10
результатов поиска в Google для любого
ключевого слова, составлял не менее 2000
слов. И чем выше вы поднимаетесь по
странице результатов поиска, тем больше
контента содержит страница.

59. Если вы сделали из вашей статьи на 1000 слов статью из 500
слов, то скорее всего вы сможете сократить ее и до 250 слов.
И помните про Правило 6 секунд и эффект якоря

60. «Люди склонны что-то делать лишь в том случае, если
видят, что это уже делают другие».
• количество твитов (tweets), подписчиков,
отметок «нравится» (лайков)
• число комментариев
• рейтинги популярности, представленные
разным количеством звездочек
• количество просмотров
• текстовые и видео отзывы

61. СНИППЕТЫ. не то чтобы критично, но…

62. СНИППЕТЫ.
60%
90%
Что смотрим:
• яркий фавикон, который «брендирует» ссылку
• законченный заголовок, который содержит УТП
• ссылки на ключевые разделы сайта
• контактные данные фирмы
• рейтинг

63. ШАГ 8. ЗАПУСК
Открыт для индексации
Протестирован на хостинге
Максимально ускорен
Стоят счетчики…сразу

64. Запуск проекта
Используется отлаженный бизнес-процесс для переезда и запуска проектов,
разработчик не покидает проект, пока не закроет абсолютно все 20 пунктов чек-листа.

65. ШАГ 8. ПОИСКОВЫЙ МАРКЕТИНГ
Сайт изначально правильно спроектирован за счет SEO-аудита
Сайт адаптивный и быстро работает –
качественная верстка и правильное внедрение
Сайт удобен для пользователя и понятен ЦА –
правильный контент, дизайн и юзабилити
Сайт эффективно работает при нагрузках и не
падает в пиковые активности
Вы получите: Эффективную отдачу
Более низкий бюджет
Меньшие сроки вывода

66. Работайте с тем, что у вас уже
есть.
Измеряйте и улучшайте
эффективность всего!
Лучшего момента просто не будет.
Тестируйте новые инструменты,
кто бы что про них не говорил.
Если сомневаетесь: делать или не
делать – делайте!

67. Дизайн– помощник
Технологичная верстка
Bootstrap 3
Скорость
Оптимизация JS, CSS,
композитный режим
SEO-friendly
Битрикс
правильный

68. САЙТ – ЭТО ВСЕГО ЛИШЬ ЧАСТЬ СИСТЕМЫ

69. Контроллируйте оффлайн
0. Проверьте все «точки контакта»
1. Подключить виджеты – не значит
их использовать эффективно
2. Продажи – это люди, а не сервисы
3. Плохое настроение менеджера – это
ваши проблемы
4. 1 негативный отзыв с лихвой
закроет 10 положительных
5. Сервис – это система, а не улыбки

70. Клиентов,
которых не получаете Вы, получают
Ваши конкуренты.

71. Повшок Игорь
igor@db.by
Эффективный интернет-магазин
БЫСТРО
Спасибо за внимание!
Ваши вопросы?
Игорь Повшок
руководитель отдела продаж
Студии Борового
igor@db.by
+375 (29)163-23-22
igor@db.by
+375 (29)163-23-22