HTML
January 23, 2020

Первый HTML-документ

Здесь мы создадим первую страничку.

В прошлой статье мы рассматривали лучшие HTML редакторы 2020 года, которые являются отличными инструментами для написания кода.

Лучшие HTML редакторы 2020 года

Теперь, после выбора инструмента, с которым вам придется работать, я расскажу о том, как собственно создать документ HTML. Рассказ будет вестись о стандартном Блокноте, который есть на всех ОС Windows, как стандартная программа. Создание в аналогичных редакторах кода не слишком отличается, скорее даже упрощается.


Итак, откроем блокнот, вот как он выглядит

Скопируем туда стандартный вариант первого кода, который будет выводить «Здравствуй, мир!». Пока неважно понимать, что делает каждая из строчек кода, просто скопируйте ее в блокнот:

HTML
1.<html>
2.  <head>
3.    <title>Как создать HTML документ</title>
4.  </head>
5.  <body>
6.    Здравствуй, мир!Здравствуй, мир! 
7.  </body>
8.</html>

Вот как это должно выглядеть

После чего открываем в верхнем меню блокнота, вкладку «Файл», она подчеркнута красным на рисунке сверху. Тут выбираем пункт «Сохранить как…»

После нажатия на этот пункт перед вами появится новое окно

Здесь я выделил самые важные моменты красной линией и цифрами. Но сначала выберете место, куда сохранить вашу новую страничку, на ваше усмотрение. Я бы посоветовал создать специальную папку, где вы будете хранить файлы с курса. Теперь по порядку:

  1. В поле №1 вы должны ввести имя нового файла, давайте договоримся, что самая главная и первая страница будет иметь имя «index», важно так же написать расширение файла «.html». В итоге в этой строке у нас должно быть записано «index.html».
  2. В строчке №2 все просто, выбираем «Все файлы».
  3. Важно понимать значение строки №3, она отвечает за кодировку страницы, если вы используете русские символы или буквы, то необходимо поставить кодировку UTF-8, другие просто будут выводить кракозябры, за место нормального текста, они имеют свое назначение, но пока оно нам не важно. В итоге окно должно выглядеть примерно следующим образом, не обращая внимания на то, куда сохранять файл.

Теперь нажимаем кнопку «Сохранить», на рисунке выше она выделена красной линией. Если открыть файл через любой браузер, при правильной последовательности действий, описанных выше, вы получите следующую картину


Таким образом, вы можете создать HTML документ через Блокнот, можете попрактиковаться и попытаться поменять код, изменить надписи и посмотреть, что будет происходить при этом со страницей.

Источник ↗