Язык программирования JavaScript (или в сокращенном варианте просто JS) предоставляет в распоряжение веб-разработчика множество возможностей. Начиная с ускорения работы интернет-ресурса вместе с интерфейсом и заканчивая улучшением внешней привлекательности сайта. Основной функционал JS состоит в добавлении различных элементов, включая аккордеоны, слайдеры, анимацию и скроллы. По сути, скрипт в значительной мере отвечает за визуальную составляющую подавляющего большинства сайтов.
Но далеко не всегда удается реализовать возможность языка программирования в полной мере. Такой сценарий развития событий оборачивается различными проблемами в работе сайта. Прежде чем перейти к описанию наиболее частых из них, целесообразно классифицировать интернет-ресурсы на три категории по уровню использования JavaScript:
- Сайты на базе JS. Выделяются эстетически привлекательным внешним видом, но являются самыми проблемными с точки зрения оптимизации.
- Интернет-ресурсы, применяющие язык программирования для вывода на экран значимого контента. SEO-продвижение несколько проще, но все равно представляет собой достаточно сложную задачу. Тем более – если ошибки были допущены на начальном этапе разработки сайта.
- Сайты, использующие JavaScript в ограниченном масштабе. В этом случае язык используется исключительно для выдачи визуала. Что упрощает оптимизацию и снижает вероятность возникновения проблем с индексацией ресурса поисковыми системами.
СЕО-продвижение предусматривает увеличение трафика и попадание интернет-ресурса в топы выдачи поисковиков. Для этого требуется диагностировать и устранить слабые места сайта, в том числе – в части недостаточно эффективного использования JavaScript. Рассмотрим четыре проблемы, возникающие в практической деятельности веб-разработчиков на JS чаще всего.
№1. Поисковая система не индексирует важный контент
Как было отмечено выше, основной участок функционирования JavaScript – это визуальная составляющая сайта. Именно она хуже всего воспринимается поисковиками в качестве индексируемого контента. Типичным примером можно назвать ответы на вопросы, которые показываются только после клика пользователя. В результате такого построения страницы поисковая система попросту не видит содержание ответов и не индексирует настолько важную часть размещенной на сайте информации.
Самым простым и доступным способом решения проблемы становится добавление контента в так называемым «сырой» HTML. Такой подход открывает поисковикам доступ к полному содержанию страницы без необходимости каких-либо дополнительных действий со стороны пользователя. Если он не помогает, применяют еще один метод оптимизации контента. Он заключается в использовании одного из трех альтернативных вариантов рендеринга:
- На стороне сервера. При открытии сайта посетителем происходит или загрузка всей страницы, или показ сначала части контента с последующей демонстрации остального содержимого.
- Динамический. Объем выдаваемой информации зависит от статуса пользователя. Если таковым является робот поисковой системы, сервер выдает всю страницу в формате HTML. В противном случае рендеринг выполняется браузером смартфона или ПК без непосредственного участия сервера.
- Гибридный. Все значимые части контента формируются сервером. На стороне пользователя происходит отображение только вспомогательных визуальных элементов.
В качестве промежуточного вывода необходимо отметить общий принцип решения проблемы. Он заключается в демонстрации поисковикам и реальным пользователям разного контента. В первом случае – в полном объеме, во втором – выборочно.
№2. Поисковик не распознает ссылки
Природа данной проблемы очень схожа с описанной выше. Она состоит в разном восприятии ссылок реальными пользователями и роботами поисковых программ. Человек понимает под ссылкой объект для клика и перехода на другую страницу. Бот поисковика воспринимает в подобном качестве специальный тег формата <a>, содержащий определенную информацию и дополнительный атрибут HREF.
Возможности JavaScript позволяют отобразить любой визуальный объект в формате псевдоссылки, для чего используются теги <div> b <span>. Результатом становится отображение контента как ссылки, что удобно пользователю.
Но информация не прописывается в формате HTML, а потому не воспринимается в качестве ссылки поисковой системой. Поэтому перехода к новым страницам не происходит, как и их индексации, а также ранжирования размещенной на них информации.
Оптимальным способом решения проблемы становится использование ссылок со специальным анкором в виде атрибута описания и традиционным атрибутом в формате HREF. Только при таком варианте исходного кода удается добиться распознавания ссылки и пользователем, и поисковиками. Причем без ущерба для каждого из посетителей сайта.
Важным дополнительным достоинством описанного варианта устранения проблемы с трафиком становится своеобразный кумулятивный эффект. Он выражается в дополнении контента основной и ссылочной страниц, что ведет к расширению запросного индекса и повышению позиции ресурса в топах выдачи поисковых систем.
№3. Длительная загрузка затрудняет распознавание контента поисковой программой
Функционал JavaScript предусматривает опцию так называемой отложенной загрузки или, в англоязычном варианте – lazy-load. Принцип ее действия предельно прост: сначала отображается видимая часть страницы, остальной контент подгружается позднее и по мере необходимости.
Данная функция имеет два важных преимущества. Первое позволяет загружать сайт даже при низкой скорости или лимите интернета, что особенно актуально для «тяжелых» ресурсов. Второе состоит в сравнительно быстрой загрузке значимой информации, в процессе изучения которой отображается и остальной контент.
Оборотной стороной использования lazy-load становится проблема с привлечением трафика. Она связана с тем, что поисковики видят только часть информации со страницы. Результат очевиден – отсутствие индексации значимого контента и ухудшение позиций сайта в топах выдачи.
Самый простой способ устранить проблемы – минимизировать применение lazy-load для важной информации. Например, использовать отложенную загрузку для отображения фото, в то время как основные данные о товаре выводятся на экран сразу. В этом случае весь значимый контент сразу же распознается и индексируется поисковой системой, что позволяет решить вопрос как с трафиком сайта, так и подъемом его в топе выдачи.
№4. Длительная загрузка контента ведет к уходу пользователя
Последняя из рассматриваемых проблем связана исключительно с человеческим фактором и никак не затрагивает работу поисковых систем. Она выражается в том, что пользователь далеко не всегда готов ждать, пока страница загрузится. С каждой секундой ожидания вероятность его ухода на другой ресурс, очень часто – прямого конкурента - резко возрастает.
Важно четко понимать, что совсем необязательно, чтобы вся страницы отобразилась на экране. Для поддержания интереса вполне достаточно вывести часть контента, но обязательно – важного и ценного потенциальному клиенту.
Чтобы сделать это, следует оптимизировать работу JavaScript. Проще всего – посредством добавления самых важных строк программного кода в HTML. Речь в данном случае обычно идет о контенте первого экрана страницы, где следует располагать самую актуальную для пользователя информацию.
Одновременно имеет смысл подключить менее ценные участки JS-кода к опции отложенной загрузки. Главное – учитывать те нюансы мероприятия, которые были описаны в предыдущем разделе статье. В противном случае решение одной проблемы может обернуться возникновением другой.
Вывод
JavaScript заслуженно считается одним из самых распространенных языков программирования. Именно с его помощью удается добиться визуальной привлекательности большинства веб-ресурсов. Оборотной стороной использования JS-кода выступает несколько проблем с привлечением и удержанием трафика. Их устранение вполне возможно и требует участия специалистов, работа которых позволит совместить как высокую скорость функционирования сайта, так и красивый внешний вид интернет-ресурса.
