Связаться с нами

Мы в социальных сетях:

Создание сайта новостей. Дорожная карта для менеджера. Часть первая: разработка

Опубликовано
Oct 4
Автор
Артем Леонов

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


Дизайн

umedia-blog_cysz/0ZN33pIng.png

По моей статистике от 70% до 85% читателей посещают сайт с помощью мобильных устройств. Так что просите дизайнера рисовать мобильную версию в первую очередь.

Помните, ваш читатель будет приходить за новостями, а не за дизайном.

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

Если вам дают возможность использовать какой-то проверенный шаблон, немного поменяв его стили, — отличный вариант, берите.

Разработка. Что выбрать?

umedia-blog_cysz/N-P4epSnR.png

Сделать сайт на WordPress

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

Как найти специалиста? Не верьте рекламе, ищите по готовым результатам. Обратитесь к владельцам сайтов, которые вам нравятся, с просьбой порекомендовать разработчика.

Определить технологии сайта вам поможет сервис wappalyzer.com. Вбиваете адрес сайта и смотрите какие там используются технологии.

Индивидуальная разработка

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

Для реализации такого проекта вам нужны будут хотя бы два разработчика: front-end и back-end. С учетом всех административных расходов будьте готовы выкладывать более 100 тыс. долларов в год.

Сделать сайт используя облачную Headless CMS

На тему Headless CMS рекомендую статью Говарда Стила, в которой хорошо разъяснено, что такое безголовые CMS. Я же постараюсь оценить использование облачной Headless CMS для новостного сайта.

Если у вас типовой новостной проект, использование Headless CMS может быть стратегически оправданным. Тут подчеркну облачную headless CMS и возможность пользоваться системой, как онлайн-сервисом. В этом случае разворачивание системы на серверах, обновления, решение проблем со сбоями, администрирование серверов будет не вашим головняком. Редакция всегда будет использовать актуальную версию программы, которая обновляется в реальном времени, а вам останется подключить к API системы клиентскую часть сайта (выражаясь старыми формулировками — шаблон сайта). Для этого понадобится профессиональный front-end разработчик.

Наша система Umedia работает по схожему принципу с Headless CMS. Только мы её разрабатываем с уклоном для новостных проектов.

Разработка мобильного приложения

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

Если у вас с самого запуска будет paywall, то приложение может быть оправдано и с начала: это будет удобно и вам, подключив платежные системы в Apple и Google сторах, и пользователям.

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

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

Оптимизация сайта новостей

umedia-blog_cysz/_ykYw0I7g.png

Базовая структура сайта

Основные страницы которых было бы достаточно еще совсем недавно:

  • Главная
  • Страница рубрики
  • Страница публикации

Но сегодня также необходимо иметь:

  • Cтраница Автора На странице должно быть указано фамилия и имя автора, а также ссылки на его социальные сети. Не лишним будет использование фотографии, а также перечень всех сделанных им публикаций.
  • О проекте На странице должна быть указана управляющая компания или персона являющаяся владельцем и спонсором издания. Если есть регистрационный номер СМИ, то однозначно стоит его указать.
  • Политика конфиденциальности (Privacy policy) Без этой страницы вы не сможете зарегистрироваться во множестве сервисов, таких как Гугл новости или опубликовать приложение в AppStore и Google Play
  • Условия использования кук (Cookie policy) Так же как и с политикой конфиденциальности от вас могут потребовать прозрачности в использовании данных пользователей.

Без страниц авторов и указания владельца издания у вас не получится попасть на большинство трафика генерирующих платформ: Google News, Яндекс Новости, Ukr.net и прочие.

URL публикаций

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

Иногда допускают ошибку и при запуске проекта делают так, что статья наследует свою рубрику — вашсайт.com/рубрика/название-статьи. Не рекомендую это решение по многим причинам. Например, при публикации, вы по ошибке отправили статью не в ту рубрику или захотели поменять ее потом, чтобы материал на сайте оказался в другом разделе. А сформированная ссылка с неправильной рубрикой уже попала в поисковые и другие системы, сайты партнеров и т.д. В результате, после смены, старая ссылка перестанет работать и вам нужно будет делать редирект.

Настройка Robots.txt

Файл Robots.txt служит для того, чтобы давать инструкции поисковым ботам. В этом файле вы можете указать какие страницы можно или нельзя индексировать. Детальную инструкцию читайте на сайте Google

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

AMP для Google и Турбо страницы для Яндекса

AMP Фреймворк для создания веб-страниц, основанный Google в 2015 году. По задумке, страницы созданные на этом фреймворке грузятся в Google Chrome и других сервисах гугла значительно быстрее обычных страниц, так как гугл хранил эти страницы в памяти своей распределенной сети серверов (CDN).

Ранее Google очень поощрял использование AMP страниц и наделял их особым приоритетом. А в Google Search Console есть даже отдельный раздел, который следит за их состоянием.

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

Я, как и мои коллеги по SEO считаем, что гугл «сливает» свою неудавшуюся технологию. И добавлять ее в сайт уже не обязательно.

Турбо страницы Турбо-страницы Яндекса является аналогом AMP страниц в Google. Но Яндекс пока еще продолжает поддерживать технологию и наделять приоритетом такие страницы.

Sitemap.xml

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

  • «лазит» по ссылкам сайта подобно тому, как это делает пользователь
  • получает сразу данные всех страниц с Sitemap.xml

Карта сайта (Sitemap.xml) помогает роботу просканировать все страницы сайта. Для раздела новостей можно создать самостоятельную карту, чтобы статьи регулярно сканировались и попадали в индекс Google News.

RSS ленты

Технология которая позволяет пользователям и другим системам получать краткую информацию о выпускаемых публикациях.

В RSS вы будете передавать следующую информацию:

  • Заголовок статьи
  • Описание
  • Краткий текст статьи
  • Дату публикации
  • Категорию
  • Ссылку на текст публикации
  • Ссылку на постер публикации

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

Микроразметка Open Graph

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

Как минимум необходимо позаботиться о том, чтобы ваши публикации передавались с постером, заголовком и описанием. Мы в Umedia сделали так, что наша программа еще и накладывает поверх постера логотип и заголовок статьи. Посты с таким оформление более кликабельны.

Ads.txt

Позволяет вам указать авторизованных продавцов своего рекламного инвентаря. С помощью файла ads.txt вы можете указывать, кому разрешено продавать рекламу на вашем сайте.

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

Теги

Могут быть полезны как пользователям, чтобы найти похожие публикации по теме, так и приносить дополнительный трафик из поиска. Пример: если сейчас популярна тема COVID-19, то страница соответствующего тега с Title «Свежие новости по теме COVID-19» имеет все шансы быть посещаемой.

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

Поиск

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

В Umedia мы используем Algolia. Также можем порекомендовать Elastic. Используя эти сервисы, вы будете отправлять на их сервера весь свой контент, а когда ваши пользователи будут что-то вводить, сервис по запросу будет очень быстро находить релевантные статьи и передавать вашему сайту уже только ссылки на материалы, которые нужно отобразить читателю. То есть вся работа на их стороне, а вам приходят только результаты выдачи.

Но хотим обратить внимание, что использование подобного рода сервисов для новостных сайтов без дополнительных оптимизаций — затея не из бюджетных. Дело в том, что эти сервисы в основном ориентированы на работу интернет-магазинов, онлайн-кинотеатров и подобных проектов, где каждая страница генерирует доход, который куда больше, чем доход от публикации в СМИ. Поэтому сервисы типа Algolia тарифицируют не только запросы, а и количество публикаций, которые вы храните на их серверах. А материалов у вас будет много.

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

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

По нашим наблюдениям для общественно-политического издания норма поискового трафика находится в районе ~23%. Что не мало, и в большинстве случаев это 2-й по степени важности источник трафика.

Если вы хотите побольше поискового трафика, то вам необходимо будет создавать больше так называемого «вечно зеленого контента»: статьи на тему «10 лучших ресторанов в 2021 году», полезных советы на разные темы и т.д.

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

Рекомендации

  • Title страницы и <h1> заголовки самый основной инструмент который у вас есть для поисковых систем, это грамотное использование тайтла страницы, а также заголовков статей. Чем отличается Title страницы от H1 заголовка. Title страницы – это то, что вы видите во вкладке сайта (если задержать мышку на вкладке, увидите полный Title). <h1> заголовок – это заголовок, с которого начинается статья. На всех страницах сайта рекомендуем подставлять название издания в конце. А также везде использовать слово Новости. Допустим ваше издание называется «Газета Важных Новостей», как должны выглядеть Title?
    • Title главной страницы: «Последние новости – Газета Важных Новостей»
    • Title страницы рубрики Политика: «Новости политики – Газета Важных Новостей»
    • Title страницы публикации должна использовать заголовок + название. Пример от Gazeta.ru: «США и Китай проведут дополнительные консультации по торговым отношениям – Газета.Ru | Новости»
  • Ранее Google при выдачи результатов использовал именно Title страницы. Но владельцы сайтов начали манипулировать Title для улучшения индексации. Писали в Title одно, а, заходя на страницу, пользователь видел в <h1> заголовке совсем другое. Поэтому Google стал использовать в своих снипетах <h1> заголовок если он есть.
  • Атрибут rel=canonical (каноническая ссылка) сообщает поисковой системе, какая страница сайта является канонической. На вашем сайте по разным причинам страницы могут дублироваться. Чтобы дать понять сторонним сервисом, какая статья является первоисточником, разработчикам необходимо использовать этот атрибут. Если вы будете использовать статический url публикации, как я описал выше, то реже столкнетесь с дублями. Но некоторые сервисы при подключении требуют, чтобы у вас указывался этот атрибут, поэтому придется это сделать.
  • Микроразметка С помощью микроразметки вы поможете поисковым ботам лучше понять контент вашей страницы. Для нашего случая важно показать где на странице:
    • Заголовок
    • Текст публикации
    • Описание
    • Источник
    • Дата публикации
    • Дата обновления
    • Автор публикации

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

Если есть вопросы, замечания или рекомендации в контексте данной темы, напишите мне пожалуйста на почту: a.leonov@u.media