В этой статье вы узнаете, как подружить поисковую систему Яндекс и Google с сайтом, написанным на Java Script FrameWork AngularJS. Проблема, поднимаемая в статье: индексация поисковой системой Яндекс сайтов на JavaScript

AngularJS Framework

Мои друзья и по совместительству клиенты из юридической компании Defend решили разработать современный сайт на AngularJS. Данный фреймворк используют для разработки frontend (видимой части сайта) и в итоге получается одностраничное приложение (Single Page Application). Пользователь не видит, как обновляется страница каждый раз, совершая переход по внутренней ссылке, так как все окна подгружаются в одном окне.

Сайты, использующие AngularJS

Для понимания, приведу некоторые крупные и всем известные проекты, использующие AngularJS:

  • PayPal
    Главная страница PayPal
  • GMail
    GMail использует FngularJS
  • UpWork
    UpWork

И так далее. Но, во всех этих проектах AngularJS либо используется частично, либо, как в GMail, не индексируется поисковыми системами.

Как мы добивались индексации

Первое, что было сделано, внутренняя оптимизация сайта. После этого сайт был добавлен в панели вебмастеров Яндекса и Google открыт для индексации и…

Проблема №1: метаданные title и description

Мы столкнулись с проблемой, что ангуляр не отдает метаданные, и, просматривая страницу как робот поисковой системы, мы не видели ни title, ни description (прим. заголовок и описание страницы). В коде было вот так:

title и description сайта mydefend.ru

При этом Яндекс «проглотил» главную страницу сайта без метаданных и контента. Глубже он не шел, и ведь правильно, AngularJS — фреймворк одностраничных приложений.

Проблема №2: карта сайта

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

Кроме того, и Яндекс, и Google ругались на структуру карты. При детальном рассмотрении стало понятно, что она формируется частично неправильно:

ошибки в sitemap

Разработчики быстро исправили эту проблему, и ошибка из панелей вебмастеров исчезла. А индексации так и не было.

Проблема №3: удаление лишних страниц из индекса

Для того, чтобы удалить лишние (взрослые) страницы из индекса Google, мы воспользовались стандартной утилитой Google Webmasters Tools:

Google Webmasters Tools inside

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

Проблема №4: как заставить Google и Яндекс проиндексировать сайт на JavaScript

Облазив все просторы интернета от рекомендаций Google до Хабрхабра, мы порекомендовали «Дефенду» воспользоваться пререндерингом через сервис https://prerender.io/. Спустя пару дней он начал рендерить страницы и отдавать их в поисковые системы:

prerender - сервис рендеринга страниц javascript сайтов

Спустя несколько апдейтов сайт начал индексироваться поисковыми системами. В данный момент индес составляет:

  1. Яндекс — 122 страницы.
  2. Google — 66 страниц.

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

  • пока что не разобрались почему, но в индекс Яндекса залезло очень много страниц формата /favicon.ico — системно заблокировали через robots.txt, но кол-во страниц продолжает расти
  • в индексе появляются страницы с ютм-метками и хэштегами
  • ковыряемся с правилами редиректов http/https/www/nowww в файле .htpaccess

Все эти проблемы предстоит преодолеть, но главное — сайт начал индексироваться поисковыми системами.

А у вас какие были/есть проблемы в SEO с сайтом?

Поделиться в социальных сетях:Share on VKShare on FacebookShare on Google+Tweet about this on TwitterShare on LinkedIn
 

5 Comments

    • admin

      Проблема №1 — метаданные не отображались, при этом в админке все было прописано и должно было отображаться.
      Проблема №2 — модуль ангуляра, который автоматом генерировал карту (частично можно согласиться, что данная задача должна решаться программистами, но если на нее не указать, то карта стандартным модулем будет генерироваться с ошибками).
      Проблема №3 — согласен, это результат взлома, может кому-то пригодиться.

      • Oleg

        «Проблема №1 — метаданные не отображались, при этом в админке все было прописано и должно было отображаться.»
        Что за админка, если не секрет, и как она относится к AngularJS?

        «Проблема №2 — модуль ангуляра, который автоматом генерировал карту (частично можно согласиться, что данная задача должна решаться программистами, но если на нее не указать, то карта стандартным модулем будет генерироваться с ошибками).»

        А что за стандартный модуль? И какой именно в нём был баг, из-за которого он неправильно генерировал карту?

        • admin

          Я поинтересуюсь у разработчиков и напишу на следующей рабочей неделе. Вы — разрабочик сайта на Ангуляр?

          • Oleg

            Да, я использовал AngularJS первой версии. Он не оправдал ожиданий. Я перешел на React.

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *