Просмотров: 54 461

Как запустить консоль в большинстве браузеров.

Консоль в браузере – это удобное средство, которое позволяет просматривать ошибки, которые возникли при загрузке страницы и взаимодействовать с этой страницей с помощью специальных команд.

Консоль очень сильном помогает устранять неполадки в работе скриптов на странице и может сэкономить вам кучу времени.

Первый шаг в том, чтобы начать использовать консоль в свое работе, нужно научиться ее запускать.

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

Это комбинация клавиш:

Ctrl + Shift + I

Как правило, набрав эту комбинацию клавиш, открывается панель веб-разработчика, в которой уже можно выбрать консоль.

Для компьютеров Mac подобная комбинация выглядит следующим образом:

 +  + I

Курс «Консоль браузера. Эффективная работа.»

Посмотрите, как это выглядит в Chrome и  Яндекс.Браузере:

23-08-2013 10-48-18

Также это работает в Opera

23-08-2013 10-49-04

И в Firefox

Но, в Firefox, как правило, я пользуюсь отладчиком FireBug.

Единственное исключение из этого правила Internet Explorer, здесь консоль вызывается клавишей F12.

23-08-2013 10-51-15

Рекомендую запомнить эти комбинации клавиш. Если вы веб-разработчик, то это может сэкономить вам кучу времени.

Работайте с HTML, CSS и Javascript в 2 раза быстрей используя мощный инструмент веб-разработки — консоль браузера.

Видеокурс записан на основе работы с консолью в браузере Chrome. Аналогичная консоль используется в Яндекс Браузере.

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

Чему можно научиться из курса?

  • Как удобно расположить консоль в любом месте экрана.
  • Основные принципы работы с консолью, как это вообще работает.
  • Как легко находить, изменять, добавлять или удалять новые HTML-элементы и CSS-стили на веб-странице.
  • Это позволит вам «примерять» и предварительно посмотреть как будет выглядеть веб-страница с теми или иными изменениями НЕ внося изменения в исходный код веб-страницы.

  • Как быстро перемещаться между элементами в «дереве» документа и быстро находить нужные элементы.
  • Вы научитесь скачивать к себе на компьютер какие-то картинки, части кода, стили оформления CSS и любые другие элементы с любого сайта в Интернет. Далее это уже можно применять на своих сайтах как готовые наработки. Это может сэкономить кучу времени.
  • Как находить конкретное место в коде CSS или Javascript файлов, которое отвечает за вывод какого-то эффекта на сайте.
  • Какой конкретно файл за это отвечает?

    Где он находится на сервере?

    Какая строка кода за это отвечает?

  • Ловим стили оформления для элемента, которые у него появляются при наведении курсора мыши на него (эффект hover).
  • Как посмотреть как будет выглядеть веб-страница на мобильных устройствах (телефоне и планшете) с помощью консоли браузера?
  • Это очень быстро и удобно и не нужно пользоваться никакими дополнительными сайтами или инструментами.

  • Как выполнять какие-то Javascript-скрипты или Javascript-код на странице вручную?
  • Как отслеживать и быстро находить ошибки в Javascript-скриптах на сайте?
  • Как отключить кэш браузера при работе консоли. Это избавит вас от проблемы, что вы внесли изменение в файл на сервере, а в браузере он не меняется.
  • Какие инструменты консоли позволят вам узнать причину медленной загрузки страниц вашего сайта?
  • Какие именно файлы или скрипты грузятся дольше всего.

    Как будет вести себя сайт при медленном интернет соединении.

Стоимость доступа к курсу

890 руб

270 руб

Купить

  • http://pumping-effect.ru/ Иван

    А как запустить консоль в браузере slimboat?

  • Зинаида

    Спасибо

  • Сергей

    Доброго дня! Ещё можно: — На замок или кружок ( смотря какое соединение — https или http ), в открывшемся окне нажать на » Подробнее » и откроется нужное окно.

  • катя

    как в опере в консоль вставить код

  • http://vk.com/id349794949 Жасур Камолходжаев

    а как в яндекс браузере

    • http://vk.com/id18397417 Дмитрий Ченгаев

      Так же как в Chrome должно быть Ctrl + Shift + I, если у вас Windows