Как сделать сайт для психолога

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

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

В статье я, на уровне новичка, покажу вам один из способов, как правильно подойти к созданию сайта, чтобы получить первый трафик и результаты. Мы сделаем с вами MVP версию. Различными сложными терминами я оперировать не буду, подойдем к вопросу максимально просто.

Как определить основные запросы пользователей?

Я это делаю с помощью сервиса https://wordstat.yandex.ru/. Вводим в поисковую строку ключевое слово — «психолог» и изучаем результаты.

После этого мне нужно определить и согласовать с клиентом основное ключевое слово или группу слов.

Для этого я использую программу Key Collector. Мне она помогает найти самые частые релевантные запросы в поисковиках, приносящие основной трафик.

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

• Психолог онлайн.
• Психолог онлайн бесплатно.
• Консультация психолога онлайн.

Эти запросы собирают самый большой трафик и они являются коммерческим (их можно хорошо монетизировать).

С основными запросами определились. Теперь проанализируем конкурентов.

Анализ конкурентов

Заходим в поисковик, вводим наши запросы и изучаем результаты. Не забываем сверху выставить свой регион, в моём случае это Москва. Пользователи могут искать психолога в оффлайне и вам нужно анализировать поисковую выдачу своего региона.

Рекламные блоки я пропускаю и смотрю всё что ниже (без плашки «реклама», «Яндекс» и так далее).

Обычно я беру первую десятку проектов, у меня они такие:

Домен зарегистрирован в конце ноября 2019 года, молодой проект, наблюдается рост трафика и по интересным запросам мы его видим в ТОП-е — это хорошо.

Посмотрим ещё один проект — ivanvdovin.ru.

На графике примерные данные за месяц.

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

Дата регистрации 2019 год, тоже достаточно молодой проект.

Из полученных данных мы видим, что два проекта достаточно молодые. Один проект — это чистая коммерция (компания), второй проект — это личный блог.

Выбор CMS

psypsy.online — сделан на Tilda.

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

ivanvdovin.ru — сделан на WordPress, информацию я получил из кода. По стоимости разработки в данном случае ситуация аналогичная с Тильдой.

Проектируем сайт

Для проектирования я использую — https://app.diagrams.net/. В нем я обрисовываю нужные мне элементы и страницы, которые я хотел бы видеть. Беру для MVP версии страницы конкурентов.

Примерно у меня получается вот такая заготовка (на скорую руку). Вы это делаете для себя, чтобы понимать, чего вы хотите от проекта. После в ТЗ разработчикам вы сможете указать, какие элементы у вас должны быть и где расположены.

Вы можете использовать и другие инструменты: обычный листок и ручку.

Какие нужны страницы для сайта

• Главная страница — https://ivanvdovin.ru/. На неё мы выводим все статьи, которые публикуем на нашем сайте.
• Страница категории — https://ivanvdovin.ru/category/deti/. Выводим статьи, которые посвящены данному разделу.
• Страница статьи — https://ivanvdovin.ru/kak-zastavit-rebenka-uchitsya-v-shkole-i-delat-uroki/.
• Визуальная карта сайта — https://ivanvdovin.ru/karta-sajta/. Нужна для того, чтобы пользователи могли быстрее найти нужную для них публикацию.
• Страница контактов — https://ivanvdovin.ru/kontakty/. Публикуем на ней свои контакты + социальные сети.
• Страница об авторе — https://ivanvdovin.ru/ob-avtore/. На ней пишем всю информацию о себе. Можем также разметить сертификаты, дипломы, курсы и другую информацию.
• Карта сайта XML — https://ivanvdovin.ru/sitemap.xml. На ней размещаются страницы, которые будет забирать робот поисковых систем.

Полезные элементы для страниц

На страницах в списке к статьям выводим: автора, количество просмотров (лайки и перерепосты не так актуальны). Добавляем функционал публикации материала и обновления его + время, которые потребуется на прочтение статьи — взять можно тут https://tehnichka.pro/

Хлебные крошки не использую в блоге.

На странице статьи использую: время на прочтение статьи, дату публикации и обновление контента (обновление происходит автоматически, после внесения изменений в материал), количество просмотров и автора.

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

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

В конце статьи использую опрос, чтобы собрать дополнительную информацию от пользователей. Также могу использовать опросы внутри статьи, после каждого абзаца (получаем более развернутую обратную связь).

В конце статьи вывожу блок с похожими статьями. Выводим статьи похожие или близко похожие по смыслу.

Функционал комментариев. Также полезен для получение обратной связи + обновляет саму статью. Дает положительный рост трафика.

Дизайн (UX и UI)

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

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

Это вид сверху всех ваших страниц, они подписаны, вы можете быстро редактировать и вносить правки с комментариями.

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

Верстка и разработка

Основные правила для верстки: она должна быть адаптивная под все устройства и без ошибок. Ошибки вы можете проверить с помощью сервиса https://validator.w3.org/.

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

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

По разработке всё сложнее, для вас самое главное, чтобы все ваши элементы работали исправно, код был оптимизирован, сайт работал быстро на всех устройствах. Проверяйте ваш сайт в сервисе — https://developers.google.com/speed/pagespeed/insights/?hl=RU, он позволит вам узнать, насколько всё у вас хорошо.

Хочу предупредить заранее, что если вы делаете проект на WordPress, то шаблон нужно купить лицензированный, все модули должны быть платными. В будущем у вас не возникнет вопросов с безопасностью (взлом, брут и другие способы навредить вашему проекту).

SEO

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

Что вам нужно будет сделать: построить структуру сайта, сделать ваш проект быстрым для всех девайсов, не допускать ошибок, делать материалы для людей.

На старте не забываем установить: Яндекс метрику, Яндекс вебмастер, Google Analytics, Google Webmaster. Всё это попросите установить разработчика, ничего сложного там нет.

Обычный статейник (как у ivanvdovin.ru), может дать вам вот такие результаты по бесплатному трафику.

Одна из фишек для продвижения. Установка AMP страниц. Ознакомиться можно с функционалом по ссылке — https://developers.google.com/amp?hl=ru.

Кратко: у пользователей, которые переходят из Google, страницы открываются в разы быстрее, чем на обычной версии сайта. Отдача контента — моментальная.

После установки AMP, показатель отказов с 10% упал до 5%.

Домен и хостинг

По домену, если вы частный специалист, я бы посоветовал зарегистрировать свой бренд (как ivanvdovin.ru) и продвигать себя. Если вы компания или агрегатор, то используйте приставки в домен с основным ключевым словом.

Свои сайты я размещаю на https://beget.com/ru. Быстрая поддержка, адекватные цены (сайт можно захостить за ~ 100 рублей в месяц), всё работает быстро и без тормозов.

UPDATE (декабрь 2020). У Beget периодически происходят падения. В октябре-декабре их было около 10 (лично на моих проектах). Поддержка отвечает крайне долго, свой ответ вы можете ждать около суток.

Аналитика

Очень важно на старте установить себе Яндекс метрику и Google Analytics. Данные инструменты смогут вам помочь в анализе вашей аудитории, узнать какой контент им заходит, а какой нет.

Это одни из важных показателей. Более подробно, вы сможете почитать о них в справках — https://yandex.ru/support/metrica/.

Контент

Контент в блоге следующий: текст, тематические картинки, видео. Текстовый контент можно заказывать у копирайтеров на этой бирже — https://contentmonster.ru/. В идеале, пишем статьи самостоятельно в черновую, находим редактора и просим его привести текст в порядок.

Дополнительные сервисы для работы с текстом:

1. Орфограммка.
2. Advego.
3. Главред.

Тематические картинки покупаю на стоках.

Видео. Делаем сами, если хотим продвигать себя и дополнительно зарабатывать с Ютуба или же договариваемся с авторами и размещаем у себя на сайте.

Монетизация

psypsy.online монетизируется за счет внутреннего сервиса. Работаю по системе подписок.

ivanvdovin.ru монетизируется за счет личных услуг, книг и донатов.

Помимо этих вариантов, вы можете зарабатывать на своем проекте с помощью: Google Adsense, Рекламной сети Яндекса и CPA-партнерок.

Стоимость

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

• Tilda — от 110 000 рублей;
• WordPress — от 160 000 рублей.

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

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