Хабр Курсы для всех
РЕКЛАМА
Практикум, Хекслет, SkyPro, авторские курсы — собрали всех и попросили скидки. Осталось выбрать!
Хабр доступен 24/7 благодаря поддержке друзей
Комментарии 60
Уже 2015 год и мне не понятно в какой ситуации у пользователя может быть отключен javascript.
Ну тут больше для ботов, но первый способ и для пользователей без js «в вакууме» подойдет.
Параноиков с NoScript'ом и в 2015м году хватает, другое дело, что всучить средства для увеличения или уменьшения какой-нибудь части тела им тяжело, так что коммерческой ценности у них, конечно, немного…
Дело даже не в этом, настоящую ссылку можно скопировать, перетащить или открыть колесиком мыши в новой вкладке. Да и сам результат перехода (даже если не было перехода) должен иметь уникальную ссылку, чтобы можно было ей с кем-нибудь поделиться.
Ну и отказоустойчивость. Внешний сайт с JavaScript-библиотекой упал, что выведет большинство сайтов? А ничего. Ладно хоть просьбу/напоминание включить JavaScript иногда все же не забывают. А если что-то заблокировано (здравствуйте, современные реалии) или просто сломалось? Очень редко пользователь получит уведомление, что что-то не в порядке (мол, попробуйте обновить страничку или там проверьте свой блокировщик рекламы), все больше тупо не работает.
А по поводу отключения – так это из-за сайтов, перенасыщенных тормозящими рюшечками, которые иногда вообще только мешают собственно читать полезную информацию.
Ну и отказоустойчивость. Внешний сайт с JavaScript-библиотекой упал, что выведет большинство сайтов? А ничего. Ладно хоть просьбу/напоминание включить JavaScript иногда все же не забывают. А если что-то заблокировано (здравствуйте, современные реалии) или просто сломалось? Очень редко пользователь получит уведомление, что что-то не в порядке (мол, попробуйте обновить страничку или там проверьте свой блокировщик рекламы), все больше тупо не работает.
А по поводу отключения – так это из-за сайтов, перенасыщенных тормозящими рюшечками, которые иногда вообще только мешают собственно читать полезную информацию.
Уже 2015 год, и уж пару лет не иметь включенного JS при использовании TOR считается best practice. Вот в 2013 вопрос был более уместен.
Хмм… У меня он, например, запрещен, так как:
1. Все «доверенные» сайты находятся в белом списке, банк-клиент работает
2. Снижается вероятность заражения от случайных переходов по ссылке, от загрузок непонятных iframe'ов и т.д. Например, при открытии интернет-магазинов из яндекс-маркета.
3. В большинстве случаев мне от сайта нужна только текстовая информация, а не прыгающее нечто (в стиле «Я менеджер N, у Вас есть вопросы?»).
4. Социальные сети в бане, так что не работают умные загрузчики кнопочек и пр.
1. Все «доверенные» сайты находятся в белом списке, банк-клиент работает
2. Снижается вероятность заражения от случайных переходов по ссылке, от загрузок непонятных iframe'ов и т.д. Например, при открытии интернет-магазинов из яндекс-маркета.
3. В большинстве случаев мне от сайта нужна только текстовая информация, а не прыгающее нечто (в стиле «Я менеджер N, у Вас есть вопросы?»).
4. Социальные сети в бане, так что не работают умные загрузчики кнопочек и пр.
prerender.io, не?
Да, их много разных есть, я только один из описал.
Ну собственно, prerender(кстати его автор — хабровчанин) делает то же самое, что описано в вашем топике, если я всё правильно понял, конечно.
Да, но с дополнительными плюшками, на сколько я вижу, типа кеширования у них на сервере.
Не обязательно у них — проект открытый, можно настроить на своём сервере.
Мы тоже им пользовались почти полгода. Для проекта с 150 000 страниц он стал работать на редкость не стабильно — часто 5xx ошибки, проблемы с чисткой ошибочно отрисованных.
Взяли исходники, которые лежат на github в упрощённом виде, без веб-интерфейса и очередей, изучили и сделали свой github.com/icons8/impresser
Документация — не пинайте ногами, пожалуйста :( — нет вообще, даже в коде комментариями
Сейчас отрисовывает полмиллиона страниц, по 3-5 секунд на каждую, но делает это регулярно и поисковым ботам выдаёт результат за миллисекунды.
Требует выделенный сервер, потому что фантом очень жрёт процессор и на VDS упирается именно в производительность виртуальных процессоров. Мы взяли один в США, чтобы было максимально близко от серверов, на которых работают гуглоботы.
Зачем prerender/impresser, если гуглобот умеет исполнять Javascript?
Во-первых, гуглобот не понимает, что страница ждёт данных через AJAX — в результате в поисковый индекс попало много пустых страниц с крутящийся картинкой-загрузчиком. У prerender есть специальный флаг в javascript, чтобы подождать, пока страница не готова.
Во-вторых, Yandex, Bing, Yahoo и много других поисковых систем не умеют исполнять JS и видят вообще пустые страницы.
В-третьих, боты социальных сетей не умеют исполнять Javascript. В результате, например, Facebook не видит название страницы и иллюстрацию, если теги Open Graph динамически заполняются через Angular.
Попробуйте сравнить результаты:
Инструкция take.ms/BzPOr черех Google Chrome.
Откройте страницу ic8.link/very_basic в одной обычной вкладке браузера и в другой вкладке в режиме эмуляции устройств с UserAgent = «googlebot».
HTML страницы загружаются быстрее и вообще не содержат никакого JS. Их можно шарить через соц сети (пример take.ms/hURcN для страницы ic8.link/12243)
Взяли исходники, которые лежат на github в упрощённом виде, без веб-интерфейса и очередей, изучили и сделали свой github.com/icons8/impresser
Документация — не пинайте ногами, пожалуйста :( — нет вообще, даже в коде комментариями
Сейчас отрисовывает полмиллиона страниц, по 3-5 секунд на каждую, но делает это регулярно и поисковым ботам выдаёт результат за миллисекунды.
Требует выделенный сервер, потому что фантом очень жрёт процессор и на VDS упирается именно в производительность виртуальных процессоров. Мы взяли один в США, чтобы было максимально близко от серверов, на которых работают гуглоботы.
Зачем prerender/impresser, если гуглобот умеет исполнять Javascript?
Во-первых, гуглобот не понимает, что страница ждёт данных через AJAX — в результате в поисковый индекс попало много пустых страниц с крутящийся картинкой-загрузчиком. У prerender есть специальный флаг в javascript, чтобы подождать, пока страница не готова.
Во-вторых, Yandex, Bing, Yahoo и много других поисковых систем не умеют исполнять JS и видят вообще пустые страницы.
В-третьих, боты социальных сетей не умеют исполнять Javascript. В результате, например, Facebook не видит название страницы и иллюстрацию, если теги Open Graph динамически заполняются через Angular.
Попробуйте сравнить результаты:
Инструкция take.ms/BzPOr черех Google Chrome.
Откройте страницу ic8.link/very_basic в одной обычной вкладке браузера и в другой вкладке в режиме эмуляции устройств с UserAgent = «googlebot».
HTML страницы загружаются быстрее и вообще не содержат никакого JS. Их можно шарить через соц сети (пример take.ms/hURcN для страницы ic8.link/12243)
Меньше всего при индексировании поисковиками мне нужно кеширование HTML-слепка на сервере.
Минус не ставлю, но честно говоря гугл и яша описали данный материал гораздо лучше хотя и без привязки с какому-либо языку.
Так же могу сказать — да, это работает, я примерно так комменты из disqus показываю. прямо без форматирования. Все равно их только поисковик увидит. Ищется норм.
Так же могу сказать — да, это работает, я примерно так комменты из disqus показываю. прямо без форматирования. Все равно их только поисковик увидит. Ищется норм.
Такой вопрос: после загрузки веб приложения делается несколько ajax запросов для получения контента. То есть пока эти запросы не выполнены и полученный контент не отображен, нельзя отдавать поисковику страницу. Как вы ловите этот момент?
В данном конкретном случае стоит простой таймер, а в идеале там коллбек есть специальный, который нужно вызывать после окончания всех загрузок, см. github.com/steeve/angular-seo
Еще важный ньюанс с инфинити скроллом есть, там уже костыли нужны.
Еще важный ньюанс с инфинити скроллом есть, там уже костыли нужны.
Для поисковиков вообще верстка не нужна, им нужна информация, желательно семантически размеченная, для чего schema.org и JSON-LD и существуют, а если объединить с веб-компонентами (во избежание перегруженных view, которые в итоге заменяются несколькими строчками) то получается вообще всё хорошо.
Делал недавно перевод, который был практически проигнорирован (по моему мнению не заслужено) хабром, там как раз об этом написано.
Делал недавно перевод, который был практически проигнорирован (по моему мнению не заслужено) хабром, там как раз об этом написано.
Кажется гугл не очень хорошо относится к тому, что ему подсовывают не то, что пользователям (другую верстку).
По-моему Google:
Кроме Google над семантикой работает множество других компаний, включая Yandex, Yahoo, Bing и другие. Им даже проще читать семантическую разметку чем миллион тупых бесполезных блочных элементов, которые имею непонятные классы, 20 уровней вложенности и вообще сверстаны непонятно как.
А какие у вас доказательства?
- активно разрабатывает и продвигает веб-компоненты
- активно разрабатывает и продвигает семантическую разметку
- при использовании семантической разметки лучше понимает что находится на сайте
- при использовании семантической разметки показывает расширенные сниппеты в поисковой выдаче (возможно и позиции самой страницы выше)
Кроме Google над семантикой работает множество других компаний, включая Yandex, Yahoo, Bing и другие. Им даже проще читать семантическую разметку чем миллион тупых бесполезных блочных элементов, которые имею непонятные классы, 20 уровней вложенности и вообще сверстаны непонятно как.
А какие у вас доказательства?
К тому же пользователю мы подсовываем ровно то же самое, та же страница, те же семантически размеченные данные подставляются в веб-компоненты для рендеринга пользователю. Нет дублирования — все всё видят (в том числе читалки и другие гаджеты/машины), все счастливы.
Это да, все верно, если и пользователю, и гуглу одинаково хорошая и правильная верстка отдается, но где-то я, не раз читал, что гугл подозрительно относится, если ему подают именно другую верстку, пусть даже более правильную, без лишнего.
Так в том и фишка, что в предложенном варианте нет другой верстки, она одна и та же для всех.
Ну значит я неверно интерпритировал вашу фразу:)
Для поисковиков вообще верстка не нужна, им нужна информация, желательно семантически размеченная
Имелось ввиду, что страница одна, но поисковик обращает внимание на сухие данные, верстка ему не важна в принципе, потому чем проще получить данные — тем лучше, с другой стороны пользователю важно видеть удобную страницу, но так как данные те же, семантическая разметка используется и как входные данные для пользовательского интерфейса. Вот и получается, что одной специально составленной страницей оставляем довольными и поисковиков, и пользователей.
Гугль стили тоже использует и проверяет удобочитаемость страниц, особенно для мобильных.
Ндааа… Знатный изврат. Вам это действительно нравится?
Гугл уже несколько лет спокойно
парсит ajax сайты о чем можно убедится используя их Webmaster Tools.
Отсюда реально куча статей, в том числе и из недр самого google давно устарели.
За яндекс не знаю.
парсит ajax сайты о чем можно убедится используя их Webmaster Tools.
Отсюда реально куча статей, в том числе и из недр самого google давно устарели.
За яндекс не знаю.
Есть нюансы:)
чуть выше: habrahabr.ru/post/254213/#comment_8546193
Во-первых, гуглобот не понимает, что страница ждёт данных через AJAX — в результате в поисковый индекс попало много пустых страниц с крутящийся картинкой-загрузчиком. У prerender есть специальный флаг в javascript, чтобы подождать, пока страница не готова.
Во-вторых, Yandex, Bing, Yahoo и много других поисковых систем не умеют исполнять JS и видят вообще пустые страницы.
В-третьих, боты социальных сетей не умеют исполнять Javascript. В результате, например, Facebook не видит название страницы и иллюстрацию, если теги Open Graph динамически заполняются через Angular.
Какие есть еще аргументы в пользу таких архитектур, кроме «Стильно, модно, молодежно»?
Стильно, модно и молодежно — это я о самом аяксе, а это решение — быстро, это часто серьезный аргумент.
Сделать два интерфейса, для роботов и для не роботов — это быстрее чем один? Это вряд ли. Получить проблемы от их рассинронизации — наверняка. Терять лояльность посетителей из-за неадекватных ссылок в поисковой выдаче — себе во вред. Минусов может появиться много, я же спрашиваю аргументы за плюсы, в чем они? Аякс понятное дело помогает с контентом на странице, но в чем плюсы полной подмены события клика на ссылку?
так просто добавился посредник, гугл и пользователь получат идентичный html, но у пользователя сгенерится все в его барузере, а для гугла сгенерится все в серверном браузере.
плюс — простота и скорость реализации, надо было простое и быстрое решение, можно было сделать иначе и хорошо, но проект не был на это расчитан, не спрашивайте почему, не я писал. А про подмену клика на ссылку — например сайт lovi.fm, где я это делал, играет радио, страницу перезагружать нельзя, а страницы перелистывать надо.
плюс — простота и скорость реализации, надо было простое и быстрое решение, можно было сделать иначе и хорошо, но проект не был на это расчитан, не спрашивайте почему, не я писал. А про подмену клика на ссылку — например сайт lovi.fm, где я это делал, играет радио, страницу перезагружать нельзя, а страницы перелистывать надо.
Такой вопрос, какая нагрузка была на данный проект? Часто слышно про проблемы утечки памяти nodejs
Использовать такой подход для индексации сайта Google-ом — согласен. С Яндекс-ом — сложнее. Чтобы не повторяться, оставлю ссылку на мой вопрос на toster-е.
Это хорошо, но с тем же angular есть ньюансы, например в js передается html шаблон с переменными и js подставляет туда значения, в таком случае генерация полноценного html для роботов уже усложняется.
angular так сделан, что отдает html-шаблон с переменными и отдельно получает данные в json, потом совмещает на клиенте.
Много дополнительного кода, плюс из текущей архитектуры выкрутиться не так просто уже, увы.
Вся статья, собственно, повествует о случае, когда статическая версия никак не реализована. Код на JS для подстановки «текущих значений в плейсхолдеры», написанный для браузера — есть, написанного для исполнения на сервере — нет. И «количество кода» и всё остальное меряется вот от этого вот состояния, когда AJAX-версия есть, а статической — нет. Чего тут непонятного?
Спасибо большое за отличный способ. Правда у меня фантом 2.0.0 не скомпилировался, пришлось 1.9 ставить. Заработало.
Скажите пожалуйста, можно ли вместо домена example.com, использовать localhost, или 127.0.0.1 или локальный IP, чтобы не привязывать демона к домену.
И как поставить эту команду screen -d -m phantomjs --disk-cache=no server.js 8888 example.com в автозагрузку? Т.к. после перезугрузки сервера, приходится ее снова набирать.
Скажите пожалуйста, можно ли вместо домена example.com, использовать localhost, или 127.0.0.1 или локальный IP, чтобы не привязывать демона к домену.
И как поставить эту команду screen -d -m phantomjs --disk-cache=no server.js 8888 example.com в автозагрузку? Т.к. после перезугрузки сервера, приходится ее снова набирать.
Зарегистрируйтесь на Хабре, чтобы оставить комментарий
Еще одна статья про индексацию ajax-сайтов поисковиками