Что такое HTML код – все, что нужно знать новичкам

Что такое HTML

Более половины людей в мире активно пользуются Интернетом. Чтобы можно было общаться и делиться своими эмоциями на расстоянии, были созданы такие социальные сети, как Одноклассники, ВКонтакте, Instagram и Телеграмм. Но мало кто задумывался над тем, что лежит в основе каждой Интернет-страницы. Так вот, любой сайт берёт своё начало в HTML-документе.

Что нужно знать?

Сейчас человек, владеющий программированием, с лёгкостью может сделать себе на этом карьеру. То же касается и людей, которые способны создавать привлекательные и многофункциональные сайты.
Итак, HTML является языком разметки. Его не относят к языку программирования, хоть многие и оспаривают этот факт.
Непонятные с виду слова <html>, <p></p>, <head> называются тегами. Они бывают парные (например, <body></body>) и одиночные (<meta>).
В общих чертах, любая страница в HTML-файле выглядит так:

<!DOCTYPE html>
<html>
<head></head>
<body></body>
</html>

В первой строчке находится <!DOCTYPE html>, позволяющий указывать тип документа для браузера. Хоть он и похож на тег, на самом деле таковым не является.
Вся техническая информация, касающаяся сайта, располагается между <head> и </head>. Здесь обязательно находиться <title></title>, который объявляет название Интернет-страницы. Сюда при необходимости и желании можно помещать <meta>. Его можно использовать, чтобы в саму разметку вводить имя разработчика сайта или кодировку документа.

В <body></body> размещают всю видимую часть сайта: текст, картинки, GIF-изображения, гиперссылки, таблицы.
Текст можно объявлять с помощь тегов <p></p>, <div></div>, <h3></h3>, <nav></nav>. Стоит отметить, что в <h3></h3> вместо “3” может быть любое целое число от 1 до 6 (от них зависит размер шрифта).
Пример:

<p>Этот текст будет виден пользователю</p>
<h3>Как и это предложение</h3>

Как и в документах с расширением .doc, .docx и других, шрифт можно изменять. Для этого используют парные теги <i></i> (текст выделен курсивом), <b></b> (жирный текст). При этом в коде шрифт текста будет обычным:

<i>Для пользователя текст выделен курсивом</i>
<b>А этот выделен жирным</b>

Стоит обратить внимание на синтаксис. Допустим, очередная запись будет неверной. Браузер не сможет правильно её прочитать.

<p><i>Не верно!</p></i>

Нужно записать так:

<p><i>А это правильно</i></p>

Гиперссылки обозначатся на HTML-языке с помощью

<a href="...">Любой текст или картинка</a>

Вместо троеточия пишется адрес файла или Интернет-ресурса, на который будет осуществлён переход. Если же сайт является многостраничной домашней работой старшеклассника, то следует рассмотреть следующий пример/
Допустим, что в папке “homework” находятся HTML-документ и другая папка по названием “picture”, в которой есть изображение с именем “firetile”. Тогда тег принимает следующий вид:

<a href="picture/firetile.jpg">Любой текст или картинка</a>

Для добавления картинки используют

<img src="…">

где вместо троеточия адрес картинки (см. пример выше). Многие разработчики сайтов в данный тег добавляют alt, чтобы при плохой загрузке вместо картинки появлялся текст.

Пример:

<img src=”…” alt=”Здесь должна быть картинка”/>

Для любого начинающего будет полезно знать, как пишутся комментарии. Их используют для разных пометок. Особенно это важно, если парный тег заканчивается только через несколько десятков строк. Стоит отметить, что сами комментарии не видит пользователь:

<p>Любой текст</p> /* это многострочный
комментарий */
<p>Ещё одно предложение</p> // а это однострочный

Если вы нашли ошибку, пожалуйста, выделите фрагмент текста и нажмите Ctrl+Enter.

Понравилась статья? Поделитесь ею в соцсетях!