Популярное
Свежее
Моя лента
Сообщения
Рейтинг
Курсы
Темы
Маркетинг
Деньги
Сервисы
Личный опыт
Крипто
Маркетплейсы
AI
Образование
Карьера
Путешествия
Показать все
vc.ru
О проекте
Правила
Реклама
Приложения
Владимир Таракановский
SEO

6 инструментов SEO-специалиста для решения рутинных задач

Доброго времени суток всем! Меня зовут Таракановский Владимир, работаю в сфере веб-разработки 5 лет. В этой статье я покажу, как справляться с рутинными задачами по SEO, используя консоль браузера и язык программирования javascript. Знание последнего вам не потребуются.

Краткое содержание

Как работать с консолью браузера

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

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

1. Нажать Ctrl+Shift+I (Ctrl+Shift+C в Opera)

2. Правая кнопка мыши - выбрать пункт "Исследовать элемент" в firefox и Яндекс браузере, "Инспектировать элемент" в Opera, "Проверить элемент" Edge, "Просмотреть код" в Google Chrome

В появившейся консоли браузера выберите пункт "Console" или "Консоль" и поставить курсор напротив синей стрелочки. В итоге у вас должно получиться что-то изображенное ниже

Как перейти в консоль javascript Таракановский Владимир
Как перейти в консоль javascript Таракановский Владимир

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

Парсинг сайтов из органической выдачи из Яндекса и Google

Задача: анализ конкурентов из Топ-10 по поисковому запросу для понимания дальнейших действий.

Рутина: надо скопировать адрес сайта в таблицу сравнения.

Дополнительные проблемы: лишнее потраченное время по сравнению получения данных кодом.

Преимущества данного кода:

  • получение в 5 кликов сайты естественной (органической выдачи).
  • исключение сайтов контекстной рекламы и таких дополнительных сервисов, как "Видео", "Картинки", "Карты" и прочие подобные.

Как пользоваться:

  1. Вбиваете нужный поисковый запрос и нажимаете "Поиск" или Enter.
  2. На странице выдачи переходите в консоль браузера на вкладку "Console" или "Консоль", как показано на инструкции выше.
  3. Вставляете приведенный ниже код. Для каждой поисковой системы свой.
/*1. Парсинг сайтов из органической выдачи из Яндекса */ clear(); const yandex_serp = []; let serp_selector=".path .link b" || ".typo a"; const pagination_yandex_serp = () =>{ const current_url=window.location.href.search("p="); const pagination_page=Number(window.location.href.slice(current_url+2))||0; return pagination_page; } document.querySelectorAll(".serp-item").forEach((item)=>{ if(item.innerText.search("реклама")==-1 && item.querySelector(".link") !==null && item.dataset.fastWzrd!=="companies" && item.dataset.fastWzrd!=="ydo" && item.dataset.fastWzrd!=="videowiz" && item.dataset.fastWzrd!=="images" && item.dataset.fastWzrd!=="entity_search"){ yandex_serp.push(item.querySelector(serp_selector).innerText); } }); const yandex_serp_with_pos=yandex_serp.map((ya_serp, i)=>`№${i+1+pagination_yandex_serp()*10} - ${ya_serp}`); console.log(`${yandex_serp.join(`\t`)} ${yandex_serp_with_pos.join(`\n`)}`);
/*2. Парсинг сайтов из органической выдачи из Гугла */ clear(); const google_serp=[]; document.querySelectorAll(".g").forEach((item)=>{ let position_arrow = item.querySelector("cite").innerText.search(" ›"); google_serp.push(item.querySelector("cite").innerText.slice(0, position_arrow)); }); const google_serp_with_pos=google_serp.map((go_serp, i)=>`№${i} - ${go_serp}`); console.log(`${google_serp.join(`\t`)} ${google_serp_with_pos.join(`\n`)}`);

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

Практический результат можно увидеть на картинке.

Пример получения данных органической выдачи по запросу в Яндексе Таракановский Владимир
Пример получения данных органической выдачи по запросу в Яндексе Таракановский Владимир

Итог: экономия времени и преодоление прокрастинации для людей, не любящих рутину.

Проверка нахождения элементов на странице

Задача: найти элементы в верстке, которые мешают или помогают продвижению по мнению seo-специалиста.

Рутина: поиск каждого элемента через вкладку "Elements" или исходный код сайта.

Дополнительные проблемы:

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

Преимущества данного кода: получение в 3 действия всех нужных нам элементов с их текстом.

Как пользоваться:

  1. Заходите на нужную страницу сайта.
  2. В консоли браузера переходите на вкладку "Консоль", как показано на инструкции выше.
  3. Вставляете приведенный ниже код.
/*3. Проверка нахождения элементов на странице */ const nodes_site=['title', 'h1', 'strong', 'b', 'i', 'em']; nodes_site.map(node_text=>{let node_text_el = document.querySelectorAll(node_text); console.log(`Количество элементов ${node_text} = ${node_text_el.length}`); if(node_text_el.length>0){ node_text_el.forEach((item)=>{console.log(`Текст элемента ${node_text}: ${item.innerText}`)})} });

Краткие пояснения:

  • title: название страницы, которое мы видим по вкладке
  • h1: заголовок 1-го уровня. Как правило, он почти всегда самый крупный по размеру.
  • strong и b: создание жирного текста с помощью верстки.
  • i и em: создание курсивного начертания с помощью верстки

Результат работы кода можно увидеть на изображении.

Нахождение нужных элементов на странице сайта с помощью кода Таракановский Владимир
Нахождение нужных элементов на странице сайта с помощью кода Таракановский Владимир

Итог: оперативный и полный поиск элементов на странице с их содержанием.

Проверка на существование внешних ссылок на странице

Задача: поиск ссылок, ведущих на другие сайты. Как известно seo-специалистам, такие ссылки надо закрывать атрибутом rel="nofollow" для предотвращения передачи веса другому сайту.

Рутина: поиск каждой ссылки через вкладку "Elements" или исходный код страницы.

Дополнительные проблемы:

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

Преимущества данного кода: получение в 3 действия всех нужных нам внешних ссылок.

Как пользоваться:

  1. Заходите на нужную страницу сайта.
  2. В консоли браузера переходите на вкладку "Консоль", как показано на инструкции выше.
  3. Вставляете приведенный ниже код.
/*4. Проверка на внешние ссылки */ clear(); const links_site=[]; document.querySelectorAll("a").forEach((item)=>{links_site.push(item.href)}); const nofollow_links=(site_address)=>{ const nofollow_link=links_site.filter(link_site=>link_site.search(site_address)==-1); if (nofollow_link.length>0) {console.log(nofollow_link.join(`\n`));} else {console.log('Внешние ссылки не найдены!');} } nofollow_links(window.location.hostname);

Пример работы кода можно увидеть на изображении

Проверка страницы сайта на внешние ссылки Таракановский Владимир
Проверка страницы сайта на внешние ссылки Таракановский Владимир

Итог: оперативный и полный поиск внешних ссылок на странице.

Проверка существования robots.txt и sitemap.xml в корне сайта и содержание файлов

Задача: проверка файлов robots.txt и sitemap.xml при первоначальном анализе сайта на продвижение.

Рутина: вбивание названия этих файлов вручную и ожидание загрузки каждого.

Дополнительные проблемы: нет.

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

Примечание: как писал Н.А. Некрасов в стихотворении "Поэт и гражданин" "Поэтом можешь ты не быть, но гражданином быть обязан". Примерно так и здесь: файл sitemap.xml на некоротых сайтах может находиться не в корневой папке сайта, но файл robots.txt обязан там находиться с указанием, где находится sitemap.xml.

Как пользоваться:

  1. Заходите на любую страницу проверяемого сайта.
  2. В консоли браузера переходите на вкладку "Консоль", как показано на инструкции выше.
  3. Вставляете приведенный ниже код.
/*5. Проверка существования robots.txt и sitemap.xml и их содержание*/ clear(); const input_rs=['robots.txt', 'sitemap.xml']; input_rs.map(async (rs)=>{ let response = await fetch(`/${rs}`); let status_file = await response.ok; let text_file = await response.text(); if (status_file) {console.log(`Файл ${rs} есть в корне сайта! Его содержимое: ${text_file}`);} else {console.log(`Файл ${rs} не найден!`);} });

Пример работы кода

Результат проверки на существование в корне сайта файлов robots.txt и sitemap.xml и их содержание Таракановский Владимир
Результат проверки на существование в корне сайта файлов robots.txt и sitemap.xml и их содержание Таракановский Владимир

Итог: ускорение времени на получение информации о файлах robots.txt и sitemap.xml.

Проверка на наличие alt у изображений

Задача: проверить изображения на наличие альтернативного текста (alt) и его качество.

Рутина: поиск каждого изображения через вкладку "Elements" или исходный код страницы.

Дополнительные проблемы:

  1. уходит много времени.
  2. изображений может быть много.
  3. есть высокая вероятность пропуска элемента из-за рутинности задачи.

Как пользоваться:

  1. Заходите на нужную страницу сайта.
  2. В консоли браузера переходите на вкладку "Консоль", как показано на инструкции выше.
  3. Вставляете приведенный ниже код.
/*6. Проверка на наличие alt у изображений*/ clear(); const image_alt=[]; const image_no_alt=[]; document.querySelectorAll("img").forEach((has_alt)=>{ if (has_alt.alt.search(/(.?[a-zA-Zа-яёА-ЯЁ]{3,}\s?.*)/gm)>-1) {image_alt.push(has_alt.alt);} else {image_no_alt.push(`Alt: ${has_alt.alt}, адрес: ${has_alt.src}`);} }); if (image_no_alt.length>0) {console.log(`Атрибут alt отсутствует или некачественный у следующих изображений: ${image_no_alt.join(`\n`)}`);} if (image_alt.length>0) {console.log(`Текст атрибута alt: ${image_alt.join(`\n`)}`);}

Пример работы кода

Заполненность атрибута alt у изображений и качество заполнения Таракановский Владимир
Заполненность атрибута alt у изображений и качество заполнения Таракановский Владимир

Итог: оперативный и полный поиск альтернативного текста изображения (alt) на странице и качество заполнения атрибута.

Подбор ключевых фраз в Wordstat для статей

Задача: подобрать ключевые слова для написания статей для блога через Wordstat.

Рутина: каждый запрос (где, когда) надо вбивать вручную.

Дополнительные проблемы: увеличение времени на подбор.

Преимущества данного кода: создает список ключевых фраз для wordstat. При клике по запросу осуществляется переход в Wordstat с ключевой фразой и заданной геолокацией.

Как пользоваться:

  1. Заходите в файл article_word.html, предварительно скачав (ссылка для скачивания будет ниже).
  2. Выбираете город, нужную продукцию и ключевые слова (какая, где).
  3. Нажать кнопку "Получить фразы для Wordstat", после чего у Вас ниже кнопки появится список фраз.
  4. Кликаете по получившейся ключевой фразе и переходите в новой вкладке в Wordstat.

Пример работы кода

Пример подбор ключевых фраз для Wordstat Таракановский Владимир
Пример подбор ключевых фраз для Wordstat Таракановский Владимир

Итог: генерация ключевых фраз и прямой переход в Wordstat

Планируемые доработки:

  • Добавить города. На данный момент городов от Урала и дальше на восток России нет.
  • Возможность удалить ненужный товар или бренд. Вдруг Вы допустили ошибку или решили не использовать это?

Весь приведенный здесь код можно будет скачать с github отсюда, нажав на зеленую кнопку "code" и выбрав "Download zip". 1-5 инструменты - файл seo.js, ключевые слова - article_word.html

У Вас есть:

  • замечания по работе кода,
  • предложения по улучшению представленных инструментов,
  • другие рутинные задачи по seo или контекстной рекламе?

Пишите об этом в комментариях, будем решать вместе!

Спасибо за прочтение!

99
7 комментариев
ICOOLER

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

Ответить
Владимир Таракановский
Автор

Спасибо Вам большое за отзыв! Если Вас не затруднит, можете дать ссылку по созданию расширений для браузера? И краткую инструкцию, как добавить из папки на компьютер.

Ответить
Galaxy IT

Добрый день, У меня не сработал парсинг: https://prnt.sc/ua9400

С чем проблема может быть?

Ответить
Владимир Таракановский
Автор

Здравствуйте! Эта ошибка говорит о том, что вы уже использовали скрипт на данной странице. Чтобы использовать его снова на этой странице, просто перезагрузите ее. На другой странице код можно использовать сразу.

Ответить