Одностраничные приложения убивают ваш SEO?

  1. Перспективы для сайтов на основе JavaScript
  2. Список популярных фреймворков JavaScript
  3. Итак, каково влияние на SEO?
  4. Что такое одностраничное приложение?
  5. Известные проблемы с отслеживанием:
  6. Известные проблемы с индексацией:
  7. Прогрессивное веб-приложение (PWA)
  8. Доступные решения
  9. Разместить карту сайта
  10. Создание пользовательских URL-адресов (ресурсы для разработчиков)
  11. BromBone
  12. Prerender.io
  13. Заключение

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

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

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

(Уилл Кричлоу увидел значительное улучшение трафика после перехода от страниц, управляемых JavaScript, к не-JavaScript уверенный .)

Перспективы для сайтов на основе JavaScript

Angular - это самая популярная среда JS для одностраничных приложений (SPA). Google поддерживает и поддерживает AngularJS с сообществом отдельных разработчиков, хотя, как ни странно, не может отображать большое количество страниц AngularJS.

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

Список популярных фреймворков JavaScript

AngularJS - очень популярный фреймворк для одностраничных приложений. Angular существует на рынке уже несколько лет и предлагает впечатляющий список функций, которые пойдут на пользу разработчикам, таким как; двусторонняя привязка; шаблонный; форматирование валюты; плюрализация; многоразовые средства управления; RESTful API обработка; Обработка AJAX и т. Д.

Технически SPA не должны использовать какие-либо модные фреймворки, такие как MVC, Ember.js, Node.js или AngularJS. Фактически, возможно построить SPA, используя только jQuery и HTML для внешнего интерфейса, но это не рекомендуется для больших веб-сайтов, где данные лучше всего управляются мощной внутренней CMS.

Итак, каково влияние на SEO?

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

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

Джон Мюллер недавно объяснил как Google индексирует сайты JavaScript в своем информационном бюллетене.

«Google поддерживает JavaScript в некоторой степени. Google поддерживает использование JavaScript для предоставления мета-тегов заголовков, описания и роботов, структурированных данных и других метаданных. При использовании AMP HTML-страница AMP должна быть статической, как того требует спецификация, но связанная веб-страница может быть построена с использованием методов JS / PWA. Не забудьте использовать файл карты сайта с правильными датами «lastmod» для сигнализации изменений на вашем сайте ».

Что такое одностраничное приложение?

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

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

Известные проблемы с отслеживанием:

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

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

Известные проблемы с индексацией:

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

Например, если вы используете новые функции браузера, такие как Fetch API, убедитесь, что они polyfilled в браузерах без поддержки. «Polyfill» на самом деле является резервной версией браузера, подобно библиотеке JavaScript, которая переносит новый API в более старую среду, используя только «средства этой среды».

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

Прогрессивное веб-приложение (PWA)

Прогрессивное веб-приложение (PWA) предлагает преимущества изначально установленного приложения, за исключением магазина приложений.

Термины «прогрессивный» в этом контексте означают, что он работает для каждого пользователя, независимо от выбора браузера, поскольку он построен с прогрессивным улучшением в качестве основной функциональности. PWA должен иметь отзывчивый пользовательский интерфейс, что означает, что он подходит для любого форм-фактора; настольный компьютер, мобильный телефон, планшет или что-то еще. PWA не обязательно должен быть SPA, но может быть многостраничным, если разработчики прилагают дополнительные усилия для создания пользовательских URL-адресов.

Эта технология показывает две спецификации, которые особенно интересны для будущего SEO & UX:

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

PWA оптимизированы для SEO, если они следовать контрольному списку лучшей практики и не принимать форму SPA. Для лучшей практики SEO PWA должны использовать История API воспроизводить своего рода след URL вместо фрагментов страницы, которые используют Hashbang (#!). Например, все после #! в https://example.com/#!user/26601 ,

Доступные решения

Поскольку весь код загружается только один раз в одностраничные приложения (SPA), поисковые системы не могут оценить качество содержимого страницы, а также не назначают должным образом какой-либо показатель качества страницы для этой веб-страницы (или «PageRank»). Другими словами, Google знает о существовании страницы, поскольку у них есть возможность обнаружить ее по ссылкам, но на самом деле не может сказать, может ли копия на этой странице реагировать в соответствии с целью поиска.

В Harvest мы исследовали различные обходные пути ниже для запуска одностраничных приложений (SPA), дружественных к SEO. Некоторые варианты могут включать ресурсы Dev и / или дополнительные расходы на сторонние инструменты.

Разместить карту сайта

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

Например, проверка кеша Google для SPA, в котором развернута только карта сайта XML (но нет другого решения), говорит нам, что их проиндексированные страницы пустые:

Например, проверка кеша Google для SPA, в котором развернута только карта сайта XML (но нет другого решения), говорит нам, что их проиндексированные страницы пустые:

Создание пользовательских URL-адресов (ресурсы для разработчиков)

В зависимости от JavaScript Framework, SPA, такие как Ember.js, могут быть настроены / оптимизированы для обслуживания пользовательских URL через динамический сегменты , В случае Angular.js разработчик потребует внимания для настройки режим локации в HTML5.

BromBone

BromBone автоматически загружает все страницы из sitemap.xml, а затем использует прокси-сервер для отправки HTML-страниц роботам поисковых систем. Нет необходимости устанавливать какое-либо программное обеспечение.

  • Тип: предварительный рендеринг HTML
  • Динамическое / Статическое обновление: Динамическое
  • Простота развертывания: легко
  • Стоимость: $ 129 / месяц
  • Ресурс: http://www.brombone.com/

Prerender.io

Prerender.io требует ручной загрузки файла sitemap.xml и сделает все остальное. Небольшие сайты (до 250 страниц) могут использовать предварительный рендеринг бесплатно, в то время как более крупные сайты (или сайты, которые постоянно обновляются), возможно, должны платить до 200 долларов в месяц. Однако наличие индексируемой версии вашего сайта, которая позволяет привлекать клиентов с помощью обычного поиска, неоценимо.

  • Тип: предварительный рендеринг HTML
  • Динамическое / Статическое обновление: Статическое
  • Простота развертывания: очень легко
  • Стоимость: $ 200 + / месяц
  • Ресурс: https://prerender.io/

Заключение

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

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


Метки: одностраничные приложения

Похожие

Что такое SEO? | Direct Line Development
... наш взгляд на мир и маркетинг. Люди начали осознавать их полезность и удобство, и поэтому хотели изучить способы, с помощью которых они могли бы использовать поисковые системы в своих интересах в Интернете. Поскольку компании стали популярными владеть веб-сайтами, они обнаружили прямую зависимость между количеством людей, которые посетили их веб-сайт (то есть притоком трафика), и количеством клиентов, которые делали покупки у них. Фактически, корреляция была настолько сильной, что теперь агентству
Seo Software
... для пингвинов. Вы хотели бы создать ключевые слова или ключевые фразы, такие как антарктическая обувь, обувь для пингвинов и коньки для птиц. Как только ваш сайт будет оптимизирован, и пользователь наберет именно эту фразу, ваш сайт появится в верхней части страницы результатов поиска. Как вы наверняка видели, поиски могут дать тысячи или даже миллионы уникальных результатов. Исследования показывают, что большинство веб-серферов предпочитают посещать страницы, которые перечислены на первой
SEO обзор - оптимизация сайта
... стал лихорадкой, никто не сомневается"> В том, что SEO стал лихорадкой, никто не сомневается. Каждый хочет знать о поисковой оптимизации (SEO) или хорошем португальском языке, поисковой оптимизации . Книга SEO - Оптимизация сайтов Пауло Родриго Тейшейры (ISBN 978-85-908853-0-6) блога Поисковый маркетинг это фундаментальный сборник для профессионалов цифрового маркетинга
SEO: что такое поисковая оптимизация
С ростом Google и других поисковых систем, практика SEO стал очень популярным среди компаний. В этой теме мы рассмотрим ваше значение для вашей компании. В настоящее время одним из самых больших желаний
Что такое SEO и для чего оно?
Одним из первых странных терминов, с которыми мы сталкиваемся, когда вы начинаете погружаться в цифровой мир, является SEO , Что это? Что это значит? Это важно? Это чрезвычайно важные и важные вопросы. Давайте начнем с буквального значения. SEO означает «поисковая оптимизация». То есть «поисковая оптимизация». Поисковая система - это Google, Bing, Yandex или другие.
Что такое SEO? Как сделать это правильно?
... направленные на улучшение позиционирования ваших страниц в поисковых системах, таких как Google, Bing, Yahoo и других. Когда пользователь вводит в Google или другой поисковой системе интересующий термин (ключевое слово), цель SEO состоит в том, чтобы одна или несколько страниц вашего сайта, блога или электронной коммерции появлялись в первых результатах обычного поиска (результаты). которые появляются чуть ниже рекламных ссылок). Многие мечтают появиться в первых результатах Google, но
IIS SEO Toolkit Что это?
... для веб-разработчиков, администраторов веб-серверов и хостинг-провайдеров, чтобы улучшить их веб-сайты в поисковых системах. Я не буду вдаваться в подробности всех функций, скорее всего, я расскажу совсем немного о том, что предлагает набор, вместо этого сосредоточившись на преимуществах SEO или нет. Как его установить Бинг предлагает
SEO и эффективная архитектура сайта
... сли вы сравните традиционные стратегии офлайнового маркетинга с онлайн-стратегиями и предполагаемой рентабельностью инвестиций, то архитектура сайта это одна из областей, которая, хотя и новая, не должна игнорироваться. Почему ты спрашиваешь? Потому что успешная архитектура веб-сайта включает в себя создание системы ссылок на страницы, которая может помочь вам нацеливать маркетинговые планы и, естественно, охватить большую аудиторию.
Что такое SEO Краткое объяснение о поисковой оптимизации SEO
Что такое SEO Когда мы ищем информацию в Интернете, мы делаем это, вводя в поисковую систему несколько ключевых слов, и обычно мы удовлетворены одним из первых результатов или приведенных ссылок. Если, с другой стороны, мы теперь сами предлагаем информацию, мы, естественно, хотим, чтобы ее нашли, поэтому мы должны достичь как можно более высоких результатов. Вопрос в том, как нам лучше всего это сделать и какая система стоит за этим? Как цифровое агентство из Бельгии, мы лучшая компания,
SEO оптимизация структуры сайта
Эта статья была создана, чтобы дать ответ всем тем, кто интересуется: « Почему мой сайт не позиционируется в Google? ». Ответ, по моему опыту, часто заключается в том, что сайт не имеет хорошей структуры . Когда сайт плохо структурирован, все «базовые» оптимизации мира могут быть правильно применены на практике, и вы можете настаивать на ссылках до предела штрафа. Сайт без надлежащей структуры SEO будет изо всех сил пытаться позиционировать себя и сегодня,
Техника SEO в White Hat: что это такое?
... на вершине в поисковой выдаче. Когда вы используете методы белой шляпы для улучшения сайта, вы смотрите на получение естественных ссылок , налаживание связей с другими в отрасли, использование этического SEO и соответствующей саморекламы. Если вы получаете лучший рейтинг в Google, используя методы построения ссылок SEO, вы сохраняете эти рейтинги. При использовании этического SEO для улучшения сайта, начните с контента. Старая поговорка

Комментарии

Каков ваш опыт работы с сайтами на основе JavaScript и рейтинг ваших собственных страниц с приложениями JavaScript?
Каков ваш опыт работы с сайтами на основе JavaScript и рейтинг ваших собственных страниц с приложениями JavaScript? Другие источники: ScreamingFrog: https://www.screamingfrog.co.uk/ Бартош Горалевич: https://moz.com/blog/search-engines-ready-for-JavaScript-crawling Мобильный, скрытый контент:
Вы уверены, что ваш бизнес не имеет ничего общего с Интернетом, что вам нечего получить от сети, что есть только маленькие мальчики, которые бездельничают?
Вы уверены, что ваш бизнес не имеет ничего общего с Интернетом, что вам нечего получить от сети, что есть только маленькие мальчики, которые бездельничают? Свяжитесь с нами без обязательств, и мы сделаем углубленный анализ вашего рынка , ваших конкурентов, их действий и того, что вы можете получить из сети. Мы покажем вам стратегии, которые вы можете использовать для увеличения вашего оборота и увеличения оборота . Проверка 24:
Как SEO услуги малого бизнеса улучшить продажи и посещаемость сайта и повысить ценность вашего сайта?
Что такое технический SEO? Техническое SEO - это процесс оптимизации фазы сканирования, индексации и рендеринга вашего сайта для достижения более высокого рейтинга в поисковых системах. Нил Патель, серийный предприниматель и соучредитель CrazyEgg, имеет простое определение технический SEO : «Любая SEO работа, которая выполняется помимо контента.
Но зачем вам знать, что такое SEO, и разбираться в таких методах?
Но зачем вам знать, что такое SEO, и разбираться в таких методах? Вкратце, существует три способа генерации трафика на сайт или блог: При прямом доступе : пользователь распознает свой авторитет и даже имеет свой адрес среди избранных. Для платного доступа : вы вкладываете средства в рекламу на разных платформах, поощряя пользователей нажимать, чтобы посетить ваш контент. Органическим доступом : вы производите
Так что же означает SEO вне страницы и что еще можно сделать?
Так что же означает SEO вне страницы и что еще можно сделать? Проще говоря, вне страницы SEO означает создание ССЫЛКИ на ваши списки eBay! Почему мы должны это сделать? Потому что в глазах Google ссылки, которые указывают на вашу страницу, очень и очень важны. Часто они могут быть даже более важными, чем сами по себе факторы. Ссылки похожи на «голоса» для Google - чем больше голосов на любой странице, тем важнее эта страница, верно? Если вы подумаете
Что такое Yoast SEO WordPress?
Что такое Yoast SEO WordPress? Yoast SEO - это плагин WordPress, который поможет вам улучшить SEO-позиционирование вашего сайта WordPress. Установив Yoast SEO, вы не будете иметь более выгодных позиций и оптимальной настройки. От вас зависит только то, как вы улучшаете свое позиционирование в Интернете в поисковых системах, и ваш сайт становится более заметным и получает больше посещений. Yoast SEO - это просто инструмент, который дает вам определенные задачи по настройке, поэтому
Но что, если я скажу, что есть способ привлечь тысячи посетителей на ваш сайт каждый месяц и не беспокоиться о конверсиях?
Но что, если я скажу, что есть способ привлечь тысячи посетителей на ваш сайт каждый месяц и не беспокоиться о конверсиях? Да! Вот что я сделал с моим сайтом. Как я в одиночку увеличил трафик моего сайта до 13000% за 6 месяцев После нескольких недель исследований ниш я нашел очень конкурентоспособную нишу, которая, я уверен, была бы отличным вложением. Но спустя месяцы после выбора домена и настройки веб-сайта я решил прекратить откладывать и начать работу над его SEO
Итак, что такое основной номер отслеживания линии?
Итак, что такое основной номер отслеживания линии? Номер отслеживания основной линии - это номер телефона с функцией отслеживания вызовов, который местные компании используют в качестве основного номера телефона в Интернете. Думайте об этом как о обычном телефонном номере с суперспособностями, которые включают запись звонков, расширенную маршрутизацию звонков, облачный IVR и программное обеспечение для анализа звонков, которое создает проницательные отчеты. Любой номер телефона может
Что если вы посчитаете, что ваш клиент может зарабатывать дополнительно 5000 долларов в месяц с вашей помощью?
Что если вы посчитаете, что ваш клиент может зарабатывать дополнительно 5000 долларов в месяц с вашей помощью? Сколько стоит эта работа? Вы не хотите давать обещания с вашими ценами, которые вы не можете поставить. Фриланс почасовая ставка Понимание ценности ваших услуг является лишь частью уравнения. Другая часть этого уравнения, ну, в общем, фактическое уравнение. Каждый фрилансер, независимо от профессии, должен рассчитать почасовую ставку фрилансера. Да,
Так что же такое SEO?
Так что же такое SEO? Сайт без плана SEO - это шаг к катастрофе. Поисковая оптимизация (SEO) - это процесс получения поисковой системой высокой оценки вашего сайта по выбранному ключевому слову, а не просто фраза или слово! Хорошо изученные ключевые слова принесут вам новый бизнес. Что такое ключевое слово? Ключевое слово - это фраза или слово, которое
Что такое SEO?
Что такое SEO? Поисковая оптимизация - это методика размещения вашего сайта на вершине рейтинга в поисковых системах. Когда потенциальный клиент находит в Google обычную фразу, такую ​​как передача, вы пытаетесь разместить свой сайт как можно ближе к верхней части списка. Когда вы что-то ищете в Google, вы обнаруживаете, что первые три или четыре записи вверху (и внизу) страницы имеют зеленое поле для рекламы рядом с ними. Они оплачиваются за позиции.

Что такое одностраничное приложение?
Итак, каково влияние на SEO?
Что такое одностраничное приложение?
Одним из первых странных терминов, с которыми мы сталкиваемся, когда вы начинаете погружаться в цифровой мир, является SEO , Что это?
Что это значит?
Это важно?
Что такое SEO?
Как сделать это правильно?
Почему ты спрашиваешь?
Вопрос в том, как нам лучше всего это сделать и какая система стоит за этим?