×
Россия +7 (495) 139-20-33

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

Россия +7 (495) 139-20-33
Шрифт:
0 15093

Как веб-инструменты в 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
Как выбрать CMS для интернет-магазина
Колян Гусляков
2
комментария
0
читателей
Полный профиль
Колян Гусляков - Если же у вас не получилось решить данную проблему, предлагаю воспользоваться авторской сборкой от neoseo. neoseo.ru/internet-magazin-seo-magazin-model. Они предоставляют дополнительные модули для работы и взаимодействия с вашим сайтом, современный дизайн, качественную оптимизацию и продвижение. Советую попробовать, не пожалеете.
«Юзабилити-лаборатория»: оставляйте заявку на участие!
Анна Макарова
378
комментариев
0
читателей
Полный профиль
Анна Макарова - Антон, добрый день! Ваш сайт не попал в основную выборку для юзабилити-анализа, но эксперты постараются сделать по вашему сайту видеоразбор (ю-ревью). Будем держать вас в курсе )
Тест по SEO – проверь свой уровень знаний
Артем Дорофеев
8
комментариев
0
читателей
Полный профиль
Артем Дорофеев - Полный текст вопроса со скриншотом панели прикладываю. Итого, что имеем: - на скриншоте отмечено, что это фильтр МПК - сайт коммерческий - рекламы на сайте нет С вероятностью 95% это ошибка (которая уже дважды случалась в Яндексе), когда они случайно "закосили" неповинные сайты. Тогда по запросу Платону фильтр быстренько снимали. Но вопрос даже не на знание этого нюанса. В любой непонятной ситуации, прежде чем что-либо предпринимать (особенно переписывать весь контент на сайте или менять дизайн, как указано в других вариантах) - фильтр следует подтвердить. Правильный ответ: "Написать письмо в техподдержку Яндекса".
Выбираем CMS для сайта с точки зрения SEO: базовые требования
SEO.RU
6
комментариев
0
читателей
Полный профиль
SEO.RU - Спасибо за замечание, действительно была допущена неточность - возможно информация была не так давно обновилась. Данные в статье поправим на актуальные.
Автоматические SEO-аудиты: как напугать некорректными выводами
Trydogolik
25
комментариев
0
читателей
Полный профиль
Trydogolik - спасибо
Зачем подменять контент на сайте: разбираем инструмент и развенчиваем мифы
Trydogolik
25
комментариев
0
читателей
Полный профиль
Trydogolik - К мифу 1 добавлю Google optimize optimize.google.com Удобен для сотрудников со спец. знаниями и без них. Подмена контента настраивается за счет многих вариантов страниц и условий настроек распределения трафика. Варианты страниц можно легко создать копипастом. На мой взгляд удобно и бесплатно. Тот же Calibri и программисты в любом случае, пусть не за это, но где-то берут свою комиссию. (чисто мое мнение). В качестве цены отдаешь такой ресурс как личное время и копейки за внесение двух первоначальных изменений в html шаблон страниц. Но если ваша digital-кампания имеет совесть то оплата максимум час, а то и бесплатно. Интернет-маркетолог сам должен уметь это делать. Все просто + подробную инструкцию прилагают на языке пользователя. + за поддомены платить не надо, они вообще не нужны. + взаимодействие с: - Google Ads; - Google Tag; - Google Analytics просто прекрасно отслеживается по всем вариантам параллельно. Это помогает до деталей нарисовать профиль ЦА по любому "кредиту - отдельно на машину и отдельно на бизнес". Что с аналитикой у Calibri на этот счет? Сам с Calibri не разу не работал, всегда работаю с первоисточником. + к мифу 3 в том что это и есть детище поисковой системы и рекламного инструмента. Яша тоже спокоен будет так как сам везде навязывает Турбо-страницы (считаю их не удобными).- Как "-" (минус) вижу то, что может повлиять на скорость загрузки сайта. Но если у вас не конструктор, а темболее Landing Page, то о скорости можно не волноваться. Но это чисто мое мнение. В остальном согласен с автором.
Монетизируйте свой сайт вместе с VIZTROM
VIZTROM
3
комментария
0
читателей
Полный профиль
VIZTROM - Добрый день! Так как мы сейчас работаем в приватном режиме, Вы врятли можете объективно оценить нашу рекламную площадку. У нас будет официальный запуск 3 марта для вебмастеров. Приглашаем Вас присоединиться к нам и лично посмотреть наш функционал.
100+ ресурсов по SEO для изучения поисковой оптимизации с нуля
Марина Ибушева
59
комментариев
0
читателей
Полный профиль
Марина Ибушева - Спасибо за добавление. Мы уже работаем над отдельным материалом про курсы, потому что одной статьи мало, чтобы охватить все крутое по обучению)
7 способов увеличить авторитетность сайта «в глазах» поисковых систем
Grigo5
4
комментария
0
читателей
Полный профиль
Grigo5 - Понятно.
SEO must go on! Почему в кризис нельзя останавливать продвижение сайта
everystraus
0
комментариев
0
читателей
Полный профиль
everystraus - Мы даже варианты не рассматривали. Если проект неустойчив, сразу предлагали сбавить обороты до минимума, но и так, чтоб не свалиться в штопор. Именно по СЕО чаще всего.
ТОП КОММЕНТАТОРОВ
Комментариев
910
Комментариев
834
Комментариев
554
Комментариев
540
Комментариев
483
Комментариев
378
Комментариев
373
Комментариев
262
Комментариев
249
Комментариев
171
Комментариев
156
Комментариев
140
Комментариев
121
Комментариев
111
Комментариев
97
Комментариев
97
Комментариев
96
Комментариев
89
Комментариев
80
Комментариев
77
Комментариев
67
Комментариев
60
Комментариев
59
Комментариев
59
Комментариев
57

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