Россия+7 (495) 960-65-87

Google Chrome: веб-инспектор по вызову

Россия+7 (495) 960-65-87
Шрифт:
0 14304

Как веб-инструменты в Chrome решают digital-маркетинговые задачи? Об этом в обзоре с наглядными примерами

Какие задачи стоят перед теми, кто занимается созданием и продвижением сайтов? Очевидно, что иногда нужно проверить тот или иной компонент веб-страницы и исправить его. На помощь приходит панель инструментов Google Chrome для веб-мастеров. А именно такие её вкладки, как

  • Elements,
  • Network,
  • Sources,
  • Timeline,
  • Profiles,
  • Resources,
  • Audits,
  • Console,
  • Pagespeed.

Кликаем правой кнопкой мыши на странице сайта и видим следующее меню:

Нас интересует «Просмотр кода элемента». Кликаем на него и попадаем на панель инструментов с нужными нам вкладками.

Ваш заголовок помещается в новой выдаче Google?

В обновленной поисковой выдаче Google некоторые заголовки видны не целиком. Шрифт увеличился, а размер контейнеров для заголовков остался прежним. Итог — заголовок виден не полностью.

Это можно исправить следующим образом. Открываем панель инструментов и переходим на вкладку Elements.

Дважды щелкните на текст, который вы хотите изменить. Убираем лишнее слово из заголовка и нажимаем Enter.

Готово.

Исправляйте и редактируйте веб-страницу в несколько кликов

Допустим, вы хотите создать интересный контент с блестящим заманчивым заголовком. Заголовков и текстов множество, и то, что поместили на страницу сегодня, завтра уже может разонравиться. Что делать?

В открытом в панели коде страницы выделяем место, которое мы хотим изменить. Один клик правой кнопкой мыши, выбираем Edit as HTML и редактируем нужное место.

Или можно просто дважды кликнуть по нему. В общем, быстро и в любой момент на веб-странице можно что-то поменять или отредактировать HTML-код для вставки.

Учимся пользоваться вкладкой Emulation и сравниваем экраны мобильных устройств

Чтобы узнать, как будет выглядеть веб-страница на экране мобильного устройства, открываем инструменты и выбираем внизу Emulation. Выбираем, какое конкретно устройство нас интересует, и ставим напротив него галочку. Готово! Сбросить же эмуляцию можно при помощи Reset.

Если же вы затрудняетесь отыскать вкладку Emulation, то просто нажмите на консоль hide drawer, которая тоже находится на панели инструментов. Это такие три черточки с одной галочкой.

Один клик на неё — и внизу появляется нужная вкладка Emulation.

Проверяйте, установлен ли на сайте код Google Analytics

С помощью инструментов Chrome можно проверить наличие кода Google Analytics на сайте. Для этого открываем панель веб-инструментов и переходим на вкладку Network. Затем обновляем страницу и вводим фразу «Analytics» в поле поиска. Жмём Enter.

В результате этого в списке найденных результатов (с правой стороны) отобразиться значок GA. Он также будет виден и с левой стороны, во вкладке Preview.

Значок Google Analytics может отображаться по-разному:

  • analytics.js,
  • ga.js,
  • dc.js.

Нет ли ошибок при учете рефереров?

Источник входящего трафика иногда определяется неверно. Отследить трафик и избежать снижения органического охвата помогут инструменты Chrome.

Открываем панель инструментов и переходим на Network. Затем, на вкладке Headers в правом поле, просматриваем данные о посещении. Именно они и отправляются в Google Analytics.

Проверяйте HTTP заголовки для канонических ссылок и X-Robots

Здесь мы проверяем заголовки HTTP с помощью Chrome. Делаем это следующим образом:

  • На панели инструментов выбираем Network,
  • Кликаем на www.distilled.net (сайт взят для примера).

Просматриваем заголовки HTTP на наличие ошибок. В приведенном примере канонический тег указывает на домашнюю страницу example.com/home, а должен быть направлен на example.com и никуда больше.

Учитываем коды состояния и редиректы

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

Улучшайте скорость загрузки сайта

Как проверить скорость загрузки сайта и улучшить её? Chrome поможет и в этом. Для этого на панели инструментов открываем вкладку Audits — «проверки».

Нажмите «Reload Page and Audir on the Load» — готово, проверка скорости загрузки сайта запущена и займет она меньше минуты.

После завершения аудита вы увидите список рекомендаций по улучшению скорости загрузки.

Информацию о заходах на сайт тоже можно получить с помощью веб-инструментов Chrome.

Посмотрев результаты аудита, сразу же перейдите в Network, где увидите временную шкалу. На ней показывается время каждого посещения.

(Голосов: 5, Рейтинг: 5)
Читайте нас в Telegram - digital_bar

Есть о чем рассказать? Тогда присылайте свои материалы Даше Калинской


Новые 
Новые
Лучшие
Старые
Сообщество
Подписаться 
Подписаться на дискуссию:
E-mail:
ОК
Вы подписаны на комментарии
Ошибка. Пожалуйста, попробуйте ещё раз.
Отправить отзыв
    ПОПУЛЯРНЫЕ ОБСУЖДЕНИЯ НА SEONEWS
    Google Data Studio: делаем красивые отчеты по контекстной рекламе для клиентов
    Светлана Зубрицкая
    1
    комментарий
    0
    читателей
    Полный профиль
    Светлана Зубрицкая - Нужно убрать пробелы между строк и заменить кавычки на вот такие "
    #SEOnews14: мы празднуем – вы получаете подарки!
    Rizat Sundetov
    1
    комментарий
    0
    читателей
    Полный профиль
    Rizat Sundetov - 14
    Как ускорить сайт на WordPress, чтобы получить 100/100 в Google PageSpeed Insights
    Георгий
    1
    комментарий
    0
    читателей
    Полный профиль
    Георгий - Все что рекомендуется в этой статье есть у w.tools. Ни разу не пожалел что подключился. Своя CDN сеть, кеш статики и динамики, минификация js\css и кешируемого html, оптимизация всех типов картинок и еще куча всего полезного. Сайт летает и я не знаю проблем. Могу рекомендовать от души.
    Война с дубликатами. Как нужно и как не нужно канонизировать URL
    Ann Yaroshenko
    5
    комментариев
    0
    читателей
    Полный профиль
    Ann Yaroshenko - Дмитрий, добрый день! Если вы проставили на странице с автозапчастями rel=canonical ( а я вижу в коде, что не проставили) или в HTTP хедере, то бот, как правило: выберит ту страницу главной, которую вы указали в rel=canonical ссылке. Eсли же вы этого не сделали, то бот сам выберит оригинал (алгоритмы, по которым бот это делает, скрыты Googl-ом)
    «Аудит, чтобы ты заплакала…», или Что делать, когда получил сторонний аудит сайта
    TehotdelSamara@gmail.com
    4
    комментария
    0
    читателей
    Полный профиль
    TehotdelSamara@gmail.com - Артур! Задели своим комментарием "за живое") Абсолютно,... целиком.... и полностью согласны с вами! А именно, с тем, что продажи клиента зависят в первую очередь от клиента, перечисленных вами выше и других факторов! А ещё с тем, что чистое SEO в классическом его понимании зачастую уже не даёт результата в виде роста продаж. Если хотим увеличить продажи - нужно бить по всем фронтам, SEO - только один из них, об этом клиент должен знать и быть предупреждён... Касательно нашей рекомендации смотреть на эффективность по тому, увеличилось ли число и качество заказов или нет - в контексте данной статьи говорится о том, что SEO бывает разное. По большому счёту, результат SEO — это именно привлекаемый поисковый трафик. И этот трафик может быть качественным, целевым или нет. Кроме того, трафик должен расти. Мы говорим о том, что если специалист хорошо проработал семантику, изучил бизнес клиента, исключил фразы с околонулевым спросом и проч., то трафик должен быть целевым, растущим, что значит рост обращений в отдел продаж клиента !при условии! , что само предложение и сайт располагают к тому, чтобы обратиться в отдел продаж клиента. Действительно, современное SEO предполагает учёт значительного количества факторов, в том числе и коммерческих. Без этого и трафика зачастую не будет. Нужно доносить всё это до клиента, включать подобные работы в стоимость по SEO или отдельно. А с "хочу все подряд за 25к в месяц" мы сталкиваемся тоже. Тут только пояснять и подсказывать, давать рекомендации заранее, чтобы клиент заранее был предупреждён о том, что ему требуется сделать параллельно с нашими работами по SEO. И в итоге вся эта деятельность должна привести к росту целевого трафика как на сайт, так и в отдел продаж.
    Как я пытался купить CRM-систему, но мне ее поленились продать
    Kristina
    1
    комментарий
    0
    читателей
    Полный профиль
    Kristina - Очень рекомендую CRM-систему польской фирмы Firmao. Все функции настраиваются в соответствии с индивидуальным потребностям компании! Советую попробовать бесплатную демо-версию, чтобы попробовать все необходимые функции, без лишних кнопок и траты дополнительных финансов! :) Сайт: firmao.ru/info
    BDD 2019: Как перестать убивать время на сбор и обработку тонны данных для SEO-аудита
    Kosta Bankovski
    3
    комментария
    0
    читателей
    Полный профиль
    Kosta Bankovski - Иногда такое случается, попробуйте следующий способ: 1. скачать документ в формате .xlsx, 2. импортировать его в новую таблицу. Может на 5 минут подвиснуть или выдать ошибку, но потом загрузится. Если не будет получаться, напишите в личку на ФБ, я отправлю лично. bit.ly/FB-Kosta-Bankovski
    Как вывести сайт в ТОП 10 Google в 2019 году
    Анна Макарова
    355
    комментариев
    0
    читателей
    Полный профиль
    Анна Макарова - Сергей, в нашей отрасли много заимствований из английского, иногда с ними быстрее, проще .Но будем стараться ))
    Как улучшить репутацию сайта недвижимости с помощью крауд-маркетинга
    Евгений
    2
    комментария
    0
    читателей
    Полный профиль
    Евгений - а у вас какое впечатление от статьи?
    Как построить качественный ссылочный профиль на основе конкурентов
    Ирина
    7
    комментариев
    0
    читателей
    Полный профиль
    Ирина - Давно сотрудничаю с megaindex.com и считаю данный сервис одним из лучших в сео сегменте рунета да и не только рунета. Пользуюсь их инструментами для аналитики своих работ и выявлению своих и чужих ошибок. Да и ссылочный профиль, как и говорится в данной статье сделать гораздо проще и правильней при помощи как раз мегаиндекса. Добавлю еще что инструмент для поиска конкурентов у мегаиндекса очень удобный и простой в применении.
    ТОП КОММЕНТАТОРОВ
    Комментариев
    910
    Комментариев
    834
    Комментариев
    554
    Комментариев
    540
    Комментариев
    483
    Комментариев
    373
    Комментариев
    355
    Комментариев
    262
    Комментариев
    249
    Комментариев
    171
    Комментариев
    156
    Комментариев
    137
    Комментариев
    121
    Комментариев
    105
    Комментариев
    97
    Комментариев
    97
    Комментариев
    96
    Комментариев
    80
    Комментариев
    77
    Комментариев
    69
    Комментариев
    67
    Комментариев
    60
    Комментариев
    59
    Комментариев
    57
    Комментариев
    55

    Отправьте отзыв!
    Отправьте отзыв!