Заголовок страницы и кодировка

Теперь давайте добавим что-нибудь в head. Почти у каждой веб-страницы там есть эти два элемента.

Первый — title, заголовок страницы. Браузер показывает его на вкладке (на картинке из предыдущего упражнения это было Start Coder), а поисковые системы, например Google, выводят его как заголовок каждого результата поиска. В предпросмотре здесь нет вкладки, поэтому заголовка вы не увидите, но он есть.

<title>Моя первая страница</title>

Второй — meta, сокращение от metadata, то есть метаданные: данные о странице. Этот элемент сообщает браузеру, в какой кодировке написана страница, чтобы он правильно читал буквы, например «ё», «й» или «щ», а не показывал странные символы. utf-8 — кодировка, в которой есть буквы почти всех языков мира.

<meta charset="utf-8">

Здесь появились две новинки. Часть charset="utf-8" называется атрибутом. Атрибуты мы разберём в уроке о продвинутых HTML-элементах, а пока просто скопируйте её как есть. И ещё: у meta нет закрывающего тега, потому что у него нет содержимого. Несколько других элементов устроены так же, и мы познакомимся с ними позже.

Элемент meta идёт в head первым, перед title, чтобы браузер знал, как читать буквы, ещё до того, как дойдёт до любого текста:

<head>
	<meta charset="utf-8">
	<title>Моя первая страница</title>
</head>