{"id":4091,"url":"\/distributions\/4091\/click?bit=1&hash=5d2a60f4cec46654c574d2827117bd39761eb7672f9ddb70400ce2297b63e50c","title":"\u041a\u0430\u043a\u0438\u0445 \u0441\u043f\u0435\u0446\u0438\u0430\u043b\u0438\u0441\u0442\u043e\u0432 \u043d\u0435 \u0445\u0432\u0430\u0442\u0430\u0435\u0442 \u0444\u0438\u043d\u0430\u043d\u0441\u043e\u0432\u043e\u043c\u0443 \u0441\u0435\u043a\u0442\u043e\u0440\u0443","buttonText":"","imageUuid":""}
Vladimir Shaitan

Базовая структура HTML файла

Любой HTML файл начинается с базовой структуры. Обычно она включает в себя теги, которые есть в любом HTML файле.

0 показов
508 открытий

Пример базовой структуры показан ниже.

Рассмотрим ее подробнее.

<!DOCTYPE html> <html lang="ru"> <head> <meta charset="UTF-8"> <title>Моя первая страница</title> </head> <body> </body> </html>

Начнем с тега DOCTYPE

<!DOCTYPE html>

Задача этого тега - указать браузеру стандарт HTML который используется в документе. Этот тег не будет показан на странице, но будет присутствовать в HTML коде страницы.

Так как мы используем последний стандарт HTML, а именно HTML5, то нам нужно использовать именно этот тег.

Вы можете видеть и другие версии этого тега, более объемные, обычно такие теги можно встретить на сайтах сделанных 5 - 10 лет назад. Они указывают браузерам, что используется другой стандарт HTML.

Тег <html>

Тег <html> - парный, очень важный тег, благодаря ему браузер понимает, где начинается контент который нужно обрабатывать как HTML.

<html></html>

Также тег <html> имеет обязательный атрибут lang, в качестве значения мы указываем язык, на котором должна отображаться страница. Эта информация помогает браузеру считывать специфические символы которые могу встречаться в различных языках.

В качестве значения передаем сокращения языков: ru, en и тд.

Тег <head>

<head></head>

Тег <head> - парный тег, нужен для хранения служебной, внутри него возможны различные сочетания тегов, которые будут указывать браузеру: название страницы, описание, ключевые слова. Эта информация называется 'метаинформацией'. Также метаинформация активно используется для продвижения сайта в поисковых системах (Google, Yandex и тд.).

Все что находится внутри тега <head> не будет отображено пользователю.

Тег <meta>

<meta>

Тег <meta> - одиночный тег, имеет много различных атрибутов с помощью которых мы можем указывать различную метаинформацию для нашего сайта. С настройкой тега <meta> вы ближе познакомитесь при разработке своих сайтов.

<meta charset="UTF-8">

В данный момент одним из важных <meta> тегов, является <meta> в котором указывается кодировка сайта. Кодировка помогает правильно интерпретировать текст. Указываем мы ее потому что у разных пользователей в их системе может быть указана разная кодировка, из-за чего контент сайта может выглядеть не так как мы ожидаем.

Самой универсальной кодировкой является UTF-8, ее мы и указываем.

Тег <title>

<title>Заголовок страницы</title>

<title> - парный тег, располагается внутри тега <head>, внутри него указываем текст который будет выводиться во вкладке нашего сайта.

Тег <body>

<body></body>

<body> - парный тег, располагается внутри тега <html>, после закрывающего тега </head>. Этот тег является телом нашей страницы и внутри него мы описываем HTML структуру нашего сайта которую будет видеть пользователь.

Пример конечной структуры в файле index.html.

#HTML #html #web #разработкаСайтов #JS #js #javaScript #css #frontend #верстка #html5 #css3 #tags #htmlTags

0
5 комментариев
Аккаунт удален

Комментарий недоступен

Ответить
Развернуть ветку
Фанат нонконформизма

Да, если к примеру шаблоны хорошие нарезать научишься

Ответить
Развернуть ветку
Vladimir Shaitan
Автор

Не уверен 🤔

Ответить
Развернуть ветку
Serhii Nesterov

На кой хуй это тут?
Лучше бы про войну постил

Ответить
Развернуть ветку
Vladimir Shaitan
Автор

Если хочешь про войну, то это не под данным постом.

Ответить
Развернуть ветку
Написать комментарий...
-2 комментариев
Раскрывать всегда
null