С чего начинается любой HTML-документ?

Что проверяют

Базовую грамотность и понимание, зачем нужно объявление типа документа. Вопрос простой, но по ответу видно, понимает человек механику браузера или пересказывает шаблон, который подставил редактор.

Как отвечать

Документ начинается с <!DOCTYPE html>. Это не тег и не элемент, регистр в нём неважен, а единственная задача этой строки переключить браузер в режим соответствия стандартам. Перед ней не должно быть ничего: ни комментария, ни разметки, ни текста.

Дальше корневой элемент и обязательная обвязка:

<!DOCTYPE html>
<html lang="ru">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Заголовок страницы</title>
</head>
<body>
  <h1>Заголовок</h1>
</body>
</html>

Объясните порядок внутри <head>. Объявление кодировки ставится первым, потому что браузер определяет её по первым байтам документа: если оно встретится позже, разбор уже начавшегося текста придётся повторить. Атрибут lang нужен не для красоты, от него зависят переносы, подсказка переводчику и произношение в программах экранного доступа. Мета-тег про viewport отвечает за масштаб на мобильных экранах.

Полезно добавить, что формально <html>, <head> и <body> можно опустить, браузер достроит дерево сам, но в реальном коде так не пишут.

Где спотыкаются

Пишут длинное объявление с указанием DTD, как было принято в четвёртой версии HTML. Оно работает, но выдаёт возраст шаблона: короткой формы достаточно.

Ставят что-то перед объявлением типа: комментарий, вывод серверного шаблонизатора, невидимую метку порядка байтов. Браузер уходит в режим совместимости, где часть правил считается по старым соглашениям, и вёрстка едет без видимой причины.

Забывают charset и lang. Первое даёт нечитаемые символы, когда сервер отдал другой заголовок, второе тихо портит доступность и автоматический перевод страницы.