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

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

Как веб-инструменты в 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, где увидите временную шкалу. На ней показывается время каждого посещения.

Читайте нас в Telegram - digital_bar

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


Новые 
Новые
Лучшие
Старые
Сообщество
Подписаться 
Подписаться на дискуссию:
E-mail:
ОК
Вы подписаны на комментарии
Ошибка. Пожалуйста, попробуйте ещё раз.
Отправить отзыв
    ПОПУЛЯРНЫЕ ОБСУЖДЕНИЯ НА SEONEWS
    Кейс: как продвинуть сайт производителя мебели на заказ в Москве
    Иван Стороженко
    14
    комментариев
    0
    читателей
    Полный профиль
    Иван Стороженко - В статье мы рекомендовали сервис Мегаиндекс. ru.megaindex.com/backlinks?sort=desc&sort_by=domain_rank По данной ссылке можете ввести любой сайт и посмотреть ссылки, которые ссылаются на него.
    Рейтинг «Известность бренда SEO-компаний 2017»: народное голосование
    Гость
    1
    комментарий
    0
    читателей
    Полный профиль
    Гость - 1) Ingate 2) Ашманов 3) Кокос 4) Russian Promo 5) Netpeak
    «Баден-Баден»: как выйти из-под фильтра
    Рецепты с
    1
    комментарий
    0
    читателей
    Полный профиль
    Рецепты с - Удивляют некоторые комментаторы. Как можно удалить текст на кулинарном сайте с позапросным фильтром? Статья про тушеную капусту с грибами, удаляем весь текст и в поиске людям выдаётся пустая страница? С другой стороны ни убирание точной фразы, ни слов из этой фразы, никак не помогает выбраться, периодически страница поднимается на 18-е место, а потом опять улетает на 48... Интересно другое, в Тайтл, Н1, Дескрипшн, Альт и Тайтл финиша, 1 раз в статье у нас тушеная капуста с грибами и мы на 48 месте, а капуста тушеная с грибами по сути в документе не присутствует ни разу и мы на 18 месте...
    Второе дыхание ссылочного продвижения
    Автопилот
    15
    комментариев
    0
    читателей
    Полный профиль
    Автопилот - Еще лучше, когда продвижение осуществляется комплексно :)
    «Прямая линия» с Александром Алаевым («АлаичЪ и Ко»): отвечаем на вопросы
    Александр Алаев
    13
    комментариев
    0
    читателей
    Полный профиль
    Александр Алаев - Роман. Тут ответ очень простой. Каждый запрос можно четко разделить на коммерческий или некоммерческий. "Купить слона" и его длинные хвосты - коммерческий. "Как выбрать слона" и подобные - информационные. Вот под коммерческие ключи должны быть страницы услуг или каталога товаров. А под информационку - блог. Очень важно не путать их, тем более несоответствующая коммерческим факторам страниц просто не продвинется, то есть по запросу с "купить" блог никогда не будет показываться в выдаче, так же как и страница услуги/товаров не покажется по "как выбрать". Понятно примерно?
    Западные специалисты выяснили, как повысить позиции ресурса в выдаче Google
    Максим Мирошник
    2
    комментария
    0
    читателей
    Полный профиль
    Максим Мирошник -
    Кейс: продвигаем бизнес по продаже пластиковых окон в Москве
    Иван Стороженко
    14
    комментариев
    0
    читателей
    Полный профиль
    Иван Стороженко - 1. По началу вообще не использовали, сейчас уже много каналов используется. 2. Все может быть, в принципе сайты должны быть удобны для пользователя, для этого и нужна схожесть между собой. Честно говоря старались брать все самое интересное у конкурентов + подкреплять своими идеями.
    Контекст под SEO. Как поисковая реклама помогает позициям в органической выдаче
    Кирилл Щербаков
    1
    комментарий
    0
    читателей
    Полный профиль
    Кирилл Щербаков - чет я не понял, за 3 года ничего с сайтами не делалось что ли? Типо он в статике висел и лился контекст?
    День рождения SEOnews: 12 лет в эфире!
    Анна Макарова
    316
    комментариев
    0
    читателей
    Полный профиль
    Анна Макарова - Ура )
    Сердитый маркетолог: как вы сами хороните свой сайт, или 16 принципов, которые нужно усвоить заказчикам SEO
    Dmitry Maslennikov
    1
    комментарий
    0
    читателей
    Полный профиль
    Dmitry Maslennikov - Особенно последний пункт в тему! Как клиент могу сказать что каждый потенциальный подрядчик по SEO пытался "утопить" предыдущего сеошника комментариями типа "что они вообще сделали" и "чем занимались год, у вас не сделаны элементарные вещи". Уровень сео-специлистов в регионах такой, что для клиентов я бы дал только один совет - не верьте в SEO - бесплатный сыр только в мышеловке.
    ТОП КОММЕНТАТОРОВ
    Комментариев
    910
    Комментариев
    834
    Комментариев
    554
    Комментариев
    540
    Комментариев
    483
    Комментариев
    373
    Комментариев
    316
    Комментариев
    262
    Комментариев
    231
    Комментариев
    171
    Комментариев
    156
    Комментариев
    137
    Комментариев
    121
    Комментариев
    97
    Комментариев
    97
    Комментариев
    95
    Комментариев
    83
    Комментариев
    80
    Комментариев
    67
    Комментариев
    60
    Комментариев
    59
    Комментариев
    55
    Комментариев
    55
    Комментариев
    54
    Комментариев
    52

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