Как просмотреть исходный HTML-код веб-страницы

Все браузеры позволяют просматривать исходный HTML-код любой веб-страницы. В этой статье приводится информация о том, как открыть исходный код страницы в наиболее популярных браузерах:

view-source

Вводная информация

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

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

Пользователи Microsoft Edge

edge

Чтобы просмотреть исходный код веб-страницы в Microsoft Edge, следуйте приведенным ниже инструкциям.

  1. Откройте Microsoft Edge и перейдите на веб-страницу;
  2. Кликните иконку «More» в верхнем правом углу экрана;
  3. Выберите пункт F12 Developer Tools (Инструменты разработчика) из появившегося выпадающего меню.

Совет: В Microsoft Edge инструмент DOM предоставляет возможность взаимодействия с исходным кодом и настройками CSS, позволяя мгновенно увидеть, как изменения в коде влияют на веб-страницу.

Пользователи Microsoft Internet Explorer

ielogo

Как открыть исходный код страницы в Microsoft Internet Explorer:

  1. Откройте Internet Explorer и перейдите на веб-страницу;
  2. Нажмите Alt, чтобы вызвать панель меню браузера;
  3. Выберите View (Просмотр) и Source (Источник) из появившегося выпадающего меню.

Совет: В последних версиях Internet Explorer нажатие клавиши F12 вызывает инструмент DOM. Он позволяет мгновенно увидеть, как изменения в коде влияют на веб-страницу.

Пользователи Mozilla Firefox и Netscape

firefoxlogo

Чтобы просмотреть исходный код веб-страницы в Mozilla Firefox, следуйте приведенным ниже инструкциям.

  1. Откройте Mozilla Firefox и перейдите на веб-страницу;
  2. Нажмите Alt, чтобы вызвать панель меню браузера;
  3. Выберите Tools (Инструменты), Web developer (Веб-разработчик), и затем Page Source (Исходный код страницы).

Совет: В последних версиях браузера нажатие на клавишу F12 или Ctrl+Shift+I вызывает интерактивный инструмент разработчика. Это нужно учитывать перед тем, как открыть исходный код страницы Firefox.

Как просмотреть раздел исходного кода страницы

  1. Выделите участок веб-страницы, чтобы просмотреть исходный код;
  2. Кликните правой клавишей мыши по выделенной части веб-страницы и затем нажмите View Selection Source (Показать исходный код выделения).

Совет: Используйте дополнение Firebug, чтобы не только увидеть исходный код страницы, но и вносить необходимые изменения. А также увидеть их в браузере в тот же момент.

Пользователи Google Chrome

chromelogo

Чтобы просмотреть исходный код веб-страницы в Google Chrome, следуйте приведенным ниже инструкциям.

  1. Откройте Google Chrome;
  2. Кликните по иконке Customize and control (Настройка и управление) Google Chrome, расположенной в верхней правой части окна браузера;
  3. В появившемся выпадающем меню выберите Дополнительные инструменты, Инструменты разработчика (Developer tools).

Совет: В последних версиях Google Chrome нажатие на клавишу F12 или Ctrl+Shift+I также вызывает интерактивный инструмент разработчика.

Пользователи Apple Safari

safarilogo
  1. Откройте Safari и перейдите на выбранную веб-страницу;
  2. Выберите меню Develop (Разработка);
  3. Выберите опцию Show page source (Показать исходный код страницы).

Пользователи Opera

operalogo

Как открыть исходный код страницы в Опере:

  1. Откройте Opera и перейдите на веб-страницу;
  2. Кликните кнопку «Меню» в углу окна браузера;
  3. В подменю разработчика выберите View page source (Посмотреть исходный текст).

Совет: Если вы не видите подменю «Разработчик» (или Разработка) (Developer), выберите More tools (Другие инструменты); Show developer menu (Показать меню разработчика). Далее щелкните по кнопке меню еще раз. Теперь вы увидите подменю Разработчик (Developer).

Совет: В последних версиях Opera нажатие на комбинацию клавиш Ctrl+Shift+I вызывает интерактивный инструмент разработчика.

Пользователи Google Chrome на смартфонах Android

  1. Откройте браузер Google Chrome, установленный на смартфоне;
  2. Откройте веб-страницу, исходный код которой нужно просмотреть;
  3. Коснитесь один раз панели адреса и затем поместите курсор перед URL;
  4. Наберите view-source: и нажмите Enter или Go.

Как закрыть исходный код

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

  • Если вы воспользовались сочетанием Ctrl+U, закройте новую вкладку;
  • Если вы воспользовались методом разработчика (нажатие F12 или Ctrl+Shift+I), кликните по кнопке закрытия в верхнем правом углу окна инструментов.

Это вся информация о том, как открыть исходный код страницы. Надеюсь, она вам помогла.

Перевод статьи “How to view the HTML source code of a веб-страницу” был подготовлен дружной командой проекта Сайтостроение от А до Я.