Сайты на JavaScript-движках: стоит ли игра свеч? — мнение экспертов

JavaScript и SEO — сегодня очень горячая тема, так как все больше и больше сайтов используют современные JavaScript-фреймворки и библиотеки, такие как Angular, React, Vue.js и Polymer.

Однако реальность такова, что «творение разработчиков» не всегда можно адаптировать под требования поискового робота. Хотя Google и заявляет, что они довольно хороши в рендеринге JavaScript-сайтов, но заявления разнятся с действительным положением дел:

1. JavaScript очень чувствительный к ошибкам. Одна ошибка в вашем коде JavaScript может привести к тому, что Google не сможет отобразить вашу страницу.

2. Проблемы сканирование JS-файлов.

• Разбор, компиляция и запуск JS-файлов занимает очень много времени.

• В случае веб-сайта, который «кишит» JavaScript, Google Bot должен подождать, пока все шаги компоненты JS-файлов будут выполнены, и только потом он сможет проиндексировать контент.

• Сканирования ссылок. На JS вебсайтах очень часто Google не может обнаружить новые URL-адреса и должным образом просканировать их, как результат не всегда «SEO-фишки» оптимизаторов смогут сработать.
  
  

3. Технические ограничения Google. Есть много современных функций, которые просто недоступны для Google Bot.

Ни для кого не секрет, что Яндекс до сих пор не может корректно индексировать сайты на JS-движках, хотя делает первые шаги в эту сторону.

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

Есть несколько вариантов, как бороться с этой ситуацией:

• Использовать meta name="fragment" content="!"

• Добавлять параметр #!

• Отдавать HTML копию страницы по основному URL в зависимости от User-Agent.
  
  

Но это дополнительные проблемы.

Если говорим об органическом трафике, то главных камня три:

Во-первых, с момента релиза первых полноценных JavaScript-фреймворков прошел уже не один год. Успешных кейсов по переезду статичных проектов на динамичные SPA до сих пор крайне мало. Это наталкивает на мысль, что любой JavaScript-движок заранее обречен на проблемы с индексацией и ранжированием в поисковых системах, хотя это не так. Об одном таком кейсе я буду рассказывать на All in Top 2019.

Во-вторых, рекомендации ПС Google и Яндекс по вопросам индексации JavaScript сайтов противоположны. Google проиндексирует и обработает большую часть контента. Для обработки JavaScript используется механизм на основе браузера Google Chrome (WRS или, по-другому, CSR). Яндекс же до сих пор обрабатывает динамический контент (JavaScript, AJAX), от слова «никак». Более того, для показа обработанных в HTML динамических страниц Яндекс рекомендует использовать AJAX Crawling Scheme, которая помечена Google как «нежелательная» еще с 2015 года, а с лета 2018 не поддерживается.

В то же время уже давно существуют рабочие решения с использованием SSR и изоморфного JavaScript, сторонних сервисов (например, Prerender.io).

В-третьих, SEO специалисты редко разбираются в архитектуре проекта. А разработка не всегда «дружит» с SEO. Многие разработчики (не все конечно же), считают SEO шаманством, а сеошников необязательными и ненадежными. Хотя, по сути, у них много общего и возможно совмещение таких специалистов на одном проекте, вплоть до совместных команд по SCRUM-методологии.

Все подводные камни, при продвижении таких сайтов, сводятся к тому, как именно поисковые системы индексируют данные из JS.

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

• Если контент загружается через JavaScript около 5 секунд, то поисковики могут вообще его не «увидеть».

• Довольно частая и очень глупая ошибка — в файле /robots.txt блокируются от индексации скрипты, вследствие чего поисковики могут не проиндексировать загружаемый контент.

• В сайтах на JS-движках часто вместо ссылок используются браузерные события onclick, поисковики такие «ссылки» видят, но ссылочный вес по ним не передается, либо передается неполностью.

• Индексация контента JS происходит очень долго по сравнению с HTML контентом. Если сайт не написан полностью на JS (что бывает крайне редко), то при посещении страницы поисковым ботом сначала индексируется HTML контент, а к содержимому JS поисковик может подойти только после нескольких таких итераций.

Что касается SEO на JavaScript-сайтах — не будет никаких проблем, если настроен серверный рендеринг всех страниц, и у поисковиков будет доступ к коду (html, css). Если же рендеринг настроен только на стороне клиента — скорее всего будут проблемы, так как в большинстве случаев поисковые роботы увидят только пустую страницу.

Всегда стоит анализировать кэш в Google страниц вашего сайта. Текстовый кэш покажет, видит ли Google bot ваш сайт таким, каким вы его показываете пользователю. В Google Search Console стоит просматривать страницы как Google bot для проверки наличия ошибок.

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

Отдельно стоит упомянуть SPA (Single Page Application) — сайты, построенные по принципу «заходишь на одну страницу, все остальное подгружается во фрейме».
Тут два недостатка:

• невозможность SEO-продвижения без специальных настроек;

• проблемы с аналитикой и отслеживанием трафика, что тоже нужно искусно настроить чтобы все правильно отрабатывало.

Если мы говорим про Google, то для успешного SEO нужны простые и доступные сайты, а с JavaScript все может быть непросто.

Основное правило звучит так:

Основная проблема это, конечно, индексация проекта. К сожалению, JS-сайты до сих пор корректно не индексируются. И если Google еще неплохо с этим справляется, то в Яндексе — совсем беда.

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

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

1. Стандартный подход: рендеринг (визуализация) на стороне сервера.
2. Рендеринг на стороне клиента (браузер).

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

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

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

Плюс надо ориентироваться на время, которое потратит движок на то, чтобы собрать код страницы воедино. Если это будет больше 4-5 секунд, то поисковый робот просто не сможет корректно проиндексировать содержимое страниц. А пользователю будет некомфортно работать с сайтом.

Крупнейшим подводным камнем в плане продвижения JavaScript-сайтов считаю SPA-архитектуру. Google справляется с этой задачей (и то с проблемами иногда). А вот Яндекс, Bing — там беда. Нужен Server Side рендеринг, либо HTML5 History API. Постоянная беда с динамическими URL и отдачей 404 ошибок. А еще владельцы сайтов любят закрыть сам доступ к JavaScript-роботам.

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

• проблемы с индексацией;

• попадание в выдачу не того контента;

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

Даже при использовании Prerender не все так гладко, как в теории: если сервер слабый, контент может генерироваться с задержкой и поисковые системы думают, что сайт медленный. Если разработчики «забывают» добавить на несуществующую страницу нужный код, все 404-е страницы отдают код «200 ОК». Нередко всплывают также проблемы с 301 редиректами и другие сюрпризы.

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

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

Что должно быть учтено при разработке?

• Чистый HTML-код, который, содержит в себе контент страницы.

• Отдельные URL для страниц, разделов, новостей, товаров и так далее.

• Управление SEO-тегами (title, h1-h6, meta).

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

Основная проблема таких сайтов — это проблемы с индексацией поисковыми системами (особенно в Яндекс). Если Google худо-бедно справляется с этой задачей (при условии внедрения его рекомендаций), то с Яндексом есть большие проблемы. Делать что-то сложное на JS я своим клиентам пока не рекомендую. Сейчас проще с точки зрения скорости и эффективности продвижения не использовать сайты на JS движках.

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

В последнее время сайты на JavaScript набирают все больше популярности. Их распространение связано не только с тем, что они дают более широкие возможности по UX, но и потому, что программистам проще внедрить всякие «фишки», переносить сайты на другие платформы используя такую архитектуру.

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

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

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

Разработка такого сайта может быть проще из-за возможностей, которые предоставляет JS и все существующие библиотеки( next.js, nuxt.js). Однако она будет дороже из-за необходимого уровня программистов, которые будут делать такой сайт. Очень важно при запуске такого проекта проверить как бот видит страницы и как он будет их индексировать — это самая большая проблема таких сайтов.

Сейчас с программистами на JS дефицит еще больший, чем с программистами на PHP.

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

По факту, такой вариант можно рекомендовать только проектам, которые планируют иметь в штате от 2-3 специалистов, которые будут поддерживать и развивать сайт на full time.

Теоретически JS-сайт считается простым в разработке благодаря модульности JS-фреймворков (компоненты могут писаться параллельно несколькими разработчиками и потом собираться в один продукт). Но это только в теории.

Так или иначе, для сайта требуется фронтенд (часть, отражаемая у клиента в браузере) и бэкенд (серверная часть).

Если говорить о написании серверной части целиком на JS, это будет дороже и дольше, поскольку порог входа программиста в полноценный серверный JavaScript выше, чем в тот же PHP. Вдобавок, на PHP есть гораздо больше готовых решений на написания серверной части вебсайтов.

Если речь о клиентской фронтенд-части, то она и раньше всегда использовала JS.

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

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

Сейчас разработка сайта на JavaScript несомненно дороже, чем на PHP, но тенденция по упрощению растет вместе с популярностью.

Ответ зависит от того насколько вы используете JavaScript в разработке. Если смотреть на задачу только с точки зрения собственника бизнеса, который платит за разработку — дороже (исходя из стоимости специалистов, работающих с JavaScript, JS Framework), но не сложнее, так как тут нас интересует только результат разработки. Однако, все индивидуально. Обработка небольшой формы скриптом и весь функционал большого каталога на скрипте — это разная сложность, разная стоимость.

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

Существует два решения: либо создавать server side prerender версию сайта, либо в отдельную директорию, ставить отдельный движок для нужд SEO.

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

С одной стороны «нет ничего невозможного и можно работу за 10$ продать за 1000$, а можно сделать честно». Пару раз встречали ситуации, когда разработку на JS клиентам пытались продать намного дороже, мотивируя это тем, что это «последние тренды, рекомендации Google и вообще за этим будущее».

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

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

Разработка упрощается и становится дешевле. Все больше специалистов на рынке уже владеют нужными библиотеками. Google делает все, чтобы научиться работать с JavaScript и сам активно переводит на него свои сервисы. За ними большое будущее. В целом, сегодня Google уже хорошо справляется с JavaScript и Ajax, но конечно сложности пока остаются.

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

При этом стоит помнить, что полноценная поддержка подобных сайтов — дело не из дешевых.

В сайтах на JavaScript есть будущее, но сегодня если вы планируете развивать свой бизнес с помощью органического поиска, стоит задуматься и взвесить все «за» и «против».

Сервисам с акцентом на вовлеченность пользователей думать о переходе на JavaScript нужно было еще вчера. Это субъективное мнение, но совпадает с текущей динамикой развития лидеров e-commerce и других проектов. Проекты «разворачивают» из мобильных приложений полноценные web-версии на основе единого кода — чтобы быть с пользователями постоянно и без зависимости от устройства или платформы.

SPA vs стандартный сайт можно сравнить с разницей кнопочного телефона со смартфоном в самом начале пути. Разница пока не так заметна. И там и там, сначала в основном можно было только звонить, а затем резко функционал смартфона пошел в отрыв, без шансов кнопкам. Проекты на JavaScript создают для себя фору и конкурентное преимущество на годы вперед.

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

Если для бизнеса или продукта крайне необходима максимальная вовлеченность пользователей. SPA сайты за счет плюсов перед обычными помогут улучшить опыт взаимодействия и сохранить пользователей надолго.

Из главных продуктовых плюсов:

• Скорость. Благодаря отсутствию перезагрузки страниц — максимально быстрое взаимодействие с пользователем.

• Расширенные возможности по персонализации контента.

• Кроссплатформенность — desktop и mobile приложения на основе одного кода. Responsive дизайн.
  

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

Подумать о JS движках стоит, если самое главное для вашего сайта — это скорость работы (т.к. при правильной работе сайта на JS движке будут минимальные задержки на стороне сервера и клиента). Как вариант, если вашему бизнесу просто важно быть в тренде (т.е важен сам факт такого сайта).

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

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

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

Быстрые сайты — это JavaScript. Нет больших задержек на стороне сервера. Сайты работают как мобильные приложения. JS-движок отправляет только нужные данные клиенту, а не обновляет всю страницу, тратя лишние ресурсы сервера.

Но, если у вас небольшая компания/агенство — не вижу смысла тратить деньги на такой сайт ради 1000 — 10 000 посетителей в месяц.

Я вижу два условия:

• сайт запускается с нуля;

• у компании много денег.

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

Безусловно, использование JavaScript-движков можно рекомендовать только проектам, которые планируют содержать в штате от 2-3 программистов, которые будут на постоянной основе заниматься развитием и поддержкой сайта. То есть, в первую очередь, это сервисы и SaaS-решения.

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