SEO против React: веб-сканеры умнее, чем вы думаете

  1. Делать исследования
  2. Тест Preactjs.com
  3. Ing Бинг
  4. ✅ Yahoo
  5. Ck утка утка идти
  6. Id Baidu
  7. Обновление 25 октября 2016
  8. Acknowlegements

Многие люди все еще беспокоятся о том, что если вы создадите веб-сайты с использованием таких инструментов, как React, Angular или Ember, это ухудшит рейтинг вашей поисковой системы.

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

Если этот HTML-код не содержит ничего, кроме пары мета-тегов и тегов скрипта, поисковая система предположит, что ваша страница в основном пуста, и оценит вас плохо.

Я часто вижу, что консультанты по поисковой оптимизации (SEO) рекомендуют отображать вашу страницу на бэкэнде, чтобы веб-сканеры могли видеть много хорошего HTML-кода, который они могли бы затем проиндексировать.

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

Таким образом, утверждение «рендеринг на стороне клиента вредит вашему рейтингу страницы» остается в силе?

Делать исследования

Во-первых, отказ от ответственности: я ни в коем случае не эксперт SEO. Но я немного прочитал эту тему, и вот что я нашел.

Вот объявление от Google в их блоге для веб-мастеров с октября 2015 года:

Тест Preactjs.com

Недавно я написал в твиттере о SEO-консультантах, придирчивых к моему любимому React. Если быть точным, я в процессе перехода на упреждения , легкая альтернатива Реакту Facebook. Я получил этот ответ от Джейсон Миллер Один из разработчиков, работающих над Preact:

Помимо статьи в блоге Search Engine Land, которую я цитировал выше, Джейсон написал в Твиттере ссылку на поиск Google для Начальная страница Preact , который выглядит так:

Эта страница отображается полностью на стороне клиента с использованием Preact, как показывает исходный код:

<! DOCTYPE html> <html> <head> <meta charset = "utf-8"> <title> Преакт: быстрая альтернатива 3kb React с тем же API ES6. Компоненты и Виртуальный DOM. </ Title> <meta name = "viewport" content = "ширина = ширина устройства, начальный масштаб = 1, максимальный масштаб = 1, минимальный пользовательский интерфейс"> <мета name = "мобильное веб-приложение -capable "content =" yes "> <meta name =" apple-mobile-web-app-enabled "content =" yes "> <meta name =" format-Detection "content =" telephone = no "> <мета name = "theme-color" content = "# 673AB8"> <link rel = "manifest" href = "/ manifest.json"> <link rel = "icon" type = "image / png" href = "/ assets / app -icon-192.png "sizes =" 192x192 "> <script> (function (url) {window ['_ boostrap _' + url] = fetch (url);}) ('/ content' + location.pathname.replace ( / ^ \ / (repl)? \ /? $ /, '/ index') + '. md'); </ script> <link rel = "значок ярлыка" href = "/ favicon.ico"> <link href = "/ style.6bae35e4ff9d687cb418.css" rel = "таблица стилей"> </ head> <body> <script> (функция (i, s, o, g, r, a, m) {i ['GoogleAnalyticsObject'] = г; я [г] = я [г] || функция () {. (я [г] .q = я [г] .q || []) толкать (аргументы)}, я [г] = .l 1 * new Date (); a = s.createElement (o), m = s.getElementsByTagName (o) [0]; a.async = 1; a.src = g; m.parentNode.insertBefore (a, m) }) (окно, документ, 'сценарий', "// www.google- analytics.com/analytics.js','ga');ga('create ',' UA-6031694-20 ',' auto '); ga (' send ',' pageview '); </ script> <script type = "text / javascript" src = "/ bundle.a0afd09fd48712ed0f26.js"> </ script> </ body> </ html>

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

И все же, вот как выглядят результаты Google при поиске сайта: preactjs.com :

Другая статья от Эндрю Фармер с марта 2016 года предупреждает об отсутствии поддержки JavaScript поисковыми системами, кроме Google:

Ing Бинг

Предупреждение Эндрю относительно Бинга кажется несущественным. Вот Результаты Bing при поиске по сайту: preactjs.com :

✅ Yahoo

И Yahoo результаты при поиске по сайту: preactjs.com :

Ck утка утка идти

И Duck Duck Go результаты при поиске по сайту: preactjs.com :

Id Baidu

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

Таким образом, может показаться, что если высокий приоритет в поисковой системе, предназначенной только для Китая, не является для вас приоритетом, нет ничего плохого в том, чтобы отображать ваши веб-страницы на стороне клиента с помощью JavaScript, если вы придерживаетесь некоторых основных правил (цитируется от Сообщение в блоге Эндрю Фармера ):

  • Рендеринг ваших компонентов, прежде чем делать что-то асинхронное.
  • Протестируйте каждую из ваших страниц с помощью Fetch as Google, чтобы убедиться, что робот Google находит ваш контент.

Спасибо за прочтение!

Обновление 25 октября 2016

Эндрю Ингрэм провел те же тесты, что и я, и пришел к другому выводу.

Цитата от Андрея:

Следите за обсуждением Hacker News

Acknowlegements

Спасибо Адаму Одетте ( Земля Поисковой машины ) а также Эндрю Фармер за их отличные статьи в блоге, из которых я цитировал, Джейсон Миллер за его вклад и вдохновение мои коллеги из Группа объявлений eBay за их поддержку и Куинси Ларсон Free Code Camp за публикацию этой статьи!

Stylish-Portal.infO 2011
При копирование материала активная ссылка на сайт!
Copyright 2004-2016 © www.zone55.ru. All rights reserved.