Руководство SEO по XPath

1. Что такое XPath? «XPath является основным элементом в стандарте XSLT. XPath можно использовать...
2. Почему это полезно?
3. Как работает XPath?
4. Основы: Как написать XPath
5. Пути расположения
6. Извлечение атрибутов
7. Предикаты
8. Извлечение цены со страницы продукта
9. Извлекать данные из таблиц
10. Функции XPath
11. Используя счет
12. Использование Содержит и начинается с
13. Удалите пробелы с помощью «Normalize-Space»
14. Как собирать данные
15. Scrapinghub
16. Инструменты SEO для Excel
17. Кричащая лягушка
18. Google Sheets
19. Дальнейшее чтение и инструменты

Что такое XPath?

«XPath является основным элементом в стандарте XSLT.
XPath можно использовать для навигации по элементам и атрибутам в документе XML ».

Источник

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

Это мощная и захватывающая вещь. Работа с XPath приятна и полезна. К счастью для меня, так как я часто работаю с XPath и скребками еженедельно.

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

Думайте об Интернете как о базе данных

Мне всегда нравилось думать об Интернете как об источнике данных, как о базе данных.

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

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

Здесь XPath может помочь.

Почему это полезно?

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

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

Как работает XPath?

Когда вы ищете конкретное выражение XPath, почти слишком просто просто скопировать лучшую версию выражения, которую вы можете найти (обычно в стеке). Очевидно, это неизбежно, мы все заняты, и иногда нам просто нужно быстро исправить.

Если вы хотите список выражений XPath, вот некоторые из моих:

Заголовок страницы Thing XPath // title Meta Description // meta [@ name = 'description'] / @ URL AMP контента // link [@ rel = 'amphtml'] / @ href Канонический URL // link [@ rel = 'canonical '] / @ href Robots (Index / Noindex) // meta [@ name =' robots '] / @ content H1 // h1 H2 // h2 H3 // h3 Все ссылки в документе // @ href Находит любой элемент с класс с именем 'any' // * [@ class = 'any'] Получает значения атрибута hreflang // link [@ rel = 'alternate'] / @ hreflang

Но это больше, чем просто копировать и использовать выражения XPath.

XPath имеет выражения, имеет фильтры (предикаты) и функции. Чем больше вы знаете о том, что он может сделать, тем больше у вас шансов сэкономить время, когда клавиатура вспотела, пытаясь решить проблему, к которой вам не совсем удобно подходить.

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

Основы: Как написать XPath

XPath использует выражения пути для выбора элементов в XML-документе (или HTML-документе, конечно!). Итак, базовое понимание пути, описывающего расположение интересующего вас элемента, является первой и самой важной вещью, которую вы изучите.

Давайте использовать эту страницу из Cheapflights.co.uk в качестве примера.

Посмотрите на запрос XPath, когда я его пишу (пока игнорируйте предлагаемые элементы!).

Я использую инструмент Скребок из Интернет-магазина Chrome , Это простой, но быстрый инструмент для создания и уточнения выражений XPath на лету. Я использую его, чтобы написать почти все мои выражения XPath, прежде чем переместить их в мой инструмент для выбора. Вы также можете использовать Chrome Developer Tools для оценки и проверки селекторов XPath и CSS; вот полезный шаг за шагом ,

Пути расположения

В моем примере выше важно, чтобы мои выражения XPath выбирались из корневого узла (элемента) с помощью / .

Это по существу выбирает весь документ, как вы увидите в предварительном просмотре

Если я добавлю / html , ничего не изменится, так как элемент html является корневым узлом.

Если я добавлю / html / head , будет выбрано только содержимое элемента head.

Если я добавлю / html / head / title, я получу содержимое элемента title.

Выражение пути «узел за узлом» обычно не то, как мы пишем XPath, но удобно объяснить, как оно работает.

Таким образом, чтобы получить содержимое определенного элемента (в нашем случае, title), мы пропустили полный путь, используя сокращенный синтаксис: // title .

Именно так:

Технический бит: // в сокращенном синтаксисе является сокращением от «потомок-или-сам», что означает текущий узел или любой узел под ним . Эта часть выражения называется осью, которая задает узел или узлы для выбора на основе их положения в дереве документа (например, вверх, вниз, родительский, дочерний и т. Д.).

Извлечение атрибутов

Что если вы хотите извлечь атрибут href из всех элементов на странице?

Используйте: // a / @ href

// @ href выдаст вам все атрибуты href из любой строки в источнике страницы, включая ссылки на файлы CSS, JavaScript и так далее.

Вы можете достичь того же результата с помощью // * / @ href .

Предикаты

Предикат очень похож на создание оператора if / then внутри вашего выражения XPath. Если результат равен TRUE, тогда будет выбран элемент на вашей странице. Если результатом предиката является ЛОЖЬ, он будет исключен.

Давайте рассмотрим это выражение:

// * [@ класс = 'любой']

Который выбрал бы любой элемент с классом CSS «любой».

Извлечение цены со страницы продукта

Давайте применим что-то подобное на практике с этим страница продукта для лампы Anglepoise , Я выделил цену на текущей странице и соответствующий код, найденный с помощью Inspect в Chrome Developer Tools.

Чтобы получить цену, у нас есть несколько полезных данных в разметке.

Либо контейнер P с атрибутом класса CSS class = "цена цена - большой", либо схема продукта структурированные данные.

На самом деле я бы предпочел использовать ссылку на схему, но для полноты картины давайте использовать оба примера:

// p [@ class = 'цена цена - большая'], которая выдаст:

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

// p [normalize-space (@class) = 'цена цена - большая']

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

Попробуйте это: // meta [@ itemprop = 'price'] / @ content

или же

// * [@ itemprop = 'цены'] / @ содержание

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

Thing XPath Price // meta [@ itemprop = 'price'] / @ content Image // meta [@ itemprop = 'image'] / @ content name // h1 [@ itemprop = 'name'] ID продукта // заголовок [ @ itemprop = 'productId'] / @ content Состояние запаса // meta [@ itemprop = 'Availability'] / @ Content

Для получения дополнительной информации о сборе данных на страницах розничных продуктов (и об автоматизации этих данных в виде канала) прочитайте эту статью ,

Извлекать данные из таблиц

Я столкнулся с интересной проблемой, когда важные элементы данных, такие как SKU продукта и вес, были в таблице «Технические детали», например:

Чтобы извлечь SKU, я бы выбрал ячейку таблицы, которая содержала текст «BG», используя текст () тест узла :

// тд [содержит (текст (), 'BG')]

Однако с весом проблема была немного другой, поскольку числа в ячейке значений всегда были разными! Решение выглядит так:

// тд [содержит (текст (), 'Вес')] / следующий-родственный :: тд

Где follow-sibling выбирает значение, содержащееся в следующем тд вдоль Ось ,

Это нишевые проблемы, которые нужно решить, но, если вам когда-нибудь придется извлекать данные из таблиц, которые различаются по размеру и формату, это может стать спасением!

Функции XPath

Функции XPath - это круто. Есть много интересного функции, перечисленные здесь - те, которые я чаще всего использую:

• Count ()
• Содержит()
• Начинается с()
• Нормализация-пространство ()

Используя счет

Из всех функций, которые вызывают улыбку на моем лице, это та, которая действительно показывает, насколько мощным может быть XPath. Кроме того, огромное спасибо команде Screaming Frog за использование XPath-парсера, который действительно работает.

Учти это страница цены на рейс от каяка.

В нем перечислено количество рейсов (как и следовало ожидать. Но сколько?). Каждая сделка помечена атрибутом класса CSS, «resultPrice».

Попробуйте обернуть выражение XPath с помощью функции Count () и добавить в инструмент пользовательского извлечения Screaming Frog:

кол - (// ДИВ [@ класс = 'resultPrice'])

Обязательно выберите «Значение функции» в качестве желаемого выхода:

Результат подсчета появится в столбце в обычном месте:

Когда я работал в Cheapflights, нам было совершенно ясно, что небольшое количество сделок, перечисленных на странице, значительно повлияло на конверсию. И не в позитивном ключе! В то время было чертовски трудно получить быстрое измерение страниц со слабым содержимым списков (если у вас не было времени разработчика на запрос к базе данных).

С Count () эта проблема решена. Для розничных продавцов выявление слабых страниц категорий без достойного уровня охвата продукта должно быть прогулкой в ​​парке.

Использование Содержит и начинается с

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

Например, я мог бы хотеть найти все элементы текста, которые находятся в контейнерах со словом «service» в классе CSS на моем друге Дейва страница поисковой оптимизации :

Что-то в этом роде может работать для вас:

// * [содержит (@class, 'сервис')]

Или же

// * [начинается с (@class, 'service')]

Удалите пробелы с помощью «Normalize-Space»

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

Как собирать данные

Мы говорили о расширении Scraper для Chrome, у которого есть много достоинств, но он не подходит для любого серьезного анализа. Итак, какие еще варианты доступны?

Scrapinghub

В режиме полного разработчика Scrapinghub это мощный, масштабируемый и недорогой инструмент для чистки. Scrapy Cloud - это среда, ориентированная на разработчиков, настроенная специально для очистки. Он также имеет визуальный пользовательский интерфейс под названием Portia, который может принимать визуальные точки и вводить щелчки. Он также принимает пользовательские селекторы XPath и CSS.

Инструменты SEO для Excel

Многие люди, с которыми я разговаривал, признают, что не смотрели на Инструменты SEO для Excel какое-то время. Тем не менее, на мой взгляд, последняя версия на удивление мощная и заслуживает того, чтобы ее посмотреть. XpathOnURL () функция может извлекать данные из 10000 URL-адресов. Многопоточность функций плагина также позволяет вам продолжать работу в Excel на другой вкладке, такова разница между старой и новой версиями!

Кричащая лягушка

Как я продемонстрировал выше, пользовательская функция извлечения в Screaming Frog является чрезвычайно мощной. Этот инструмент абсолютно не нуждается в представлении. Все, что я скажу, это то, что это мой первый порт захода, когда я создаю новые идеи, использующие XPath.

Типичный пользовательский экстрактор для меня может выглядеть так:

Google Sheets

Я никогда не обнаруживал особой необходимости использовать Google Sheets помимо других инструментов, которые у меня есть, хотя Google Sheets должен получить почетное упоминание. Функция = ImportXML () позволяет собирать данные с помощью выражений XPath. Взгляни на это руководство или следуй за моим другом Давид Соттимано кто большой сторонник создания инструментов SEO в Google Sheets через его OpenSourceSEO.org проект.

Дальнейшее чтение и инструменты

1. Оценивайте и проверяйте селекторы XPath / CSS в Chrome Developer Tools
2. Чит-лист XPath от Dev Hint
3. Синтаксис XPath
4. XPath Playground
5. Регулярные выражения и альтернативы XPaths, которые нужны каждому SEO
6. Функции XPath
7. Использование функций XPath
8. Как использовать XPath в Screaming Frog
9. Как извлечь заголовок и метаданные, используя Gdocs, Xpath и ImportXml
10. Как очистить данные страницы с помощью функции ImportXML в Google Sheets