Фронт это всё, что видит пользователь. В том числе и вёрстка. В принципе не очень ясно, как можно адекватно заниматься фронтом, если не понимаешь, а с чем вообще имеешь дело. Куда вставляются данные, как они будут отображаться и так далее.

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

Заголовки должны идти последовательно. Можете посмотреть эту статью.

«Инструкция 1» — это заголовок h1. <h1>Инструкция 1</h1>
«Подготовка оборудования» — заголовок h2. <h2>Подготовка оборудования</h2>

С учётом центрирования вам надо будет добавить класс text-center. Получится примерно так

<h1 class="text-center">Инструкция 1</h1>
<h2 class="text-center">Подготовка оборудования</h2>

Текст обрамляйте в теги параграфов <p></p>
Все списки обрамляйте в нужные теги. <ol></ol>(нумерованный список) или <ul></ul>(ненумерованный список)

Внутри списков сами пункты обрамляются в <li></li>

<ul>
  <li>Пункт 1</li>
  <li>Пункт 2</li>
</ul>

Я бы вставил ссылку на бесплатные курсы, но этот сайт тут запрещён -_-. Просто введите в поисковик «Разметка текста HTML» и найдёте множество информации. Или можете найти Code Basics

Вначале этого будет достаточно. Посмотрите базовые структуры разметки текста.