Проблема с разметкой, подскажите, как правильней её сделать


HTML:

<html lang="ru">
  <head>
    <meta http-equiv=»Content-Type» content=»text/html; charset=UTF-8 />
    <link rel="stylesheet" href="css/style.css"> 
    <title>A+</title>
  </head>
  <body>
    <header class="main-header">
      <div class="container1">
        <div class="header-top">
          <div class="logo">
            <img src="img/logotype.png" width="182" height="81" alt="A+">
          </div>
          <nav class="main-menu">
            <ul>
              <li><a href="#" class="link main-menu__link">Программа обучения</a></li>
              <li><a href="#" class="link main-menu__link">Выпускники</a></li>
              <li><a href="#" class="link main-menu__link">Как поступить</a></li>
              <li><a href="#" class="link main-menu__link">Контакты</a></li>
            </ul>
          </nav>
        </div>
        <div class="promo">
          <div class="promo-title">Учеба еще никогда не была такой интересной!</div>
          <p>Обучаем готовых к трудоустройству специалистов на теоретических и практических курсах.</p>
          <a href="#" class="btn btn-blue">Подать заявку</a>
        </div>
      </div>
    </header>

    <section class="features1">
      <div class="container2">
        <div class="features-item">
          <div class="features-icon features-icon-schedule"></div>
          <h2 class="features-title">Гибкий график обучения</h2>
          <p class="features-text">Современный темп жизни требует гибкого подхода к расписанию.</p>
        </div>
        <div class="features-item">
          <div class="features-icon features-icon-practice"></div>
          <h2 class="features-title">Практические занятия</h2>
          <p class="features-text">На одной теории далеко не уедешь, поэтому мы обучаем на практике.</p>
        </div>
        <div class="features-item">
          <div class="features-icon features-icon-work"></div>
          <h2 class="features-title">Не оставим без работы</h2>
          <p class="features-text">Хорошие специалисты всегда в цене и Вы станете именно таким.</p>
        </div>
      </div>
    </section>

<section class="features2">
<div class="container3">
        <div class="top-section">
            <h2 class="headings learn-types-title">Формы обучения</h2>
        </div>
        <table class="learn-types-table" align="center" >
            <tr class="table-row">
                <td class="table-heading">Название</td>
                <td class="table-heading">Длительность</td>
                <td class="table-heading">Описание</td>
            </tr>
            <tr class="table-row">
                <td class="table-data"><strong>Дневное обучение</strong></td>
                <td class="table-data sooqa"><strong>4 года</strong></td>
                <td class="table-data table-data_last ">Наиболее интенсивный вариант обучения, для тех, кто не терпит компромиссов ни в чем.</td>
            </tr>
            <tr class="table__row" align="left">
                <td class="table-data "><strong>Вечернее обучение</strong></td>
                <td class="table-data sooqa"><strong>5 лет</strong></td>
                <td class="table-data table-data_last">Вынуждены совмещать учебу с работой? Дадим вам такую возможность, совмещайте на здоровье.</td>
            </tr>
        </table>
    </div>
</section>

<section class="contacts">
      <div class="container4">
        <h2 class="contacts-title">Обратная связь</h2>
        <form class="contacts-form" action="" method="post">
          <table>
            <tr>
              <td class="title">
                <label for="fullname" style="color:#000">ФИО:</label>
              </td>
              <td class="field">
                <input type="text" id="fullname" name="fullname" placeholder="Представьтесь, пожалуйста">
              </td>
            </tr>
            <tr>
              <td class="title"style="color:#000">Пол:</td>
              <td class="field">
                <label style="color:#000"><input type="radio" id="man" name="sex" value="man" checked> Мужской</label>
                <label style="color:#000"><input type="radio" id="woman" name="sex" value="woman"> Женский</label>
              </td>
            </tr>
            <tr>
              <td class="title">
                <label for="message" style="color:#000">Доп.текст:</label>
              </td>
              <td class="field">
                <textarea id="message" name="message" placeholder="Сообщите все, что считаете нужным"></textarea>
              </td>
            </tr>
            <tr>
              <td class="title"></td>
              <td class="field">
                <input type="submit" class="btn btn-green" value="Отправить">
              </td>
            </tr>
          </table>
        </form>
        <div class="contacts-instruction">
          <h3>Заинтересовались обучением на нашей кафедре?</h3>
          <p>Заполните короткую форму обратной связи и отправьте нам.</p>
          <p>Мы подготовим для вас индивидуальное предложение и выйдем на связь!</p>
          <p class="contacts-alert"><strong>Внимание!</strong> Все поля обязательны для заполнения.</p>
        </div>
      </div>
    </section>


    <footer class="main-footer">
      <div class="container5">
        <div class="footer-top">
          <div class="footer-address">
            <div class="logo">
              <img src="img/logotype.png" width="182" height="82" alt="A+">
            </div>
            <p>197101, г. Санкт-Петербург,<br> пр. Кронверкский, д. 49</p>
          </div>
          <div class="footer-menu">
            <h3>Обучение</h3>
            <ul>
              <li><a href="#">Расписание</a></li>
              <li><a href="#">Предметы</a></li>
              <li><a href="#">Практика</a></li>
            </ul>
          </div>
          <div class="footer-menu">
            <h3>Выпускники</h3>
            <ul>
              <li><a href="#">Достижения</a></li>
              <li><a href="#">Отзывы</a></li>
              <li><a href="#">Найти</a></li>
            </ul>
          </div>
          <div class="footer-menu">
            <h3>Как поступить</h3>
            <ul>
              <li><a href="#">На коммерцию</a></li>
              <li><a href="#">Целевой набор</a></li>
              <li><a href="#">На бюджет</a></li>
            </ul>
          </div>
          <div class="footer-menu">
            <h3>Контакты</h3>
            <ul>
              <li><a href="#">Обратная связь</a></li>
              <li><a href="#">Схема проезда</a></li>
              <li><a href="#">Телефон/факс</a></li>
            </ul>
          </div>
        </div>
      </div>
    </footer>
  </body>
</html>

у меня несколько вопросов (часть из них и есть ответы как поправить):

  1. стилевой лист пустой? если пустой, зачем он тут?
  2. мета-данные под какой html написаны? и чо они какие-то странные
  3. самый главный вопрос: где декларация документа?
  4. куда поехала таблица с формами обучения? может её не надо по центру выравнивать?
  5. зачем напихали столько strong вместо b в таблицу? понимаете ли разницу между этими тегами?
факультативный вопрос

зачем помещать топик в секцию Курсы, когда эта шляпа к ним не относится?

NeonHTML, проблема с тем, что текст разметки должен находиться чуть ниже, в обратной связи тег убран, если что… Извините, что так сильно начинаю бесить, разметка сделана, с материалов прошлой лекции, там создавался подобный сайт, буду рад, если укажите на ошибки, обижаться не буду, могу даже скинуть код с которого я эту разметку сделал. Извините за беспокойство заранее.

т.е. вы не понимаете то, что наверстали?

для начала поправьте свой код по замечаниям из предыдущего коммента и скажите стало ли лучше. я так понимаю это на открытом образовании курс?

upd: нашел этот курс на открытом образовании, посмотрите у вас в каждом блоке есть контейнер .container - вот ему не надо давать несколько номеров, это контейнер-центровщик, вы им весь макет будете центровать (90 пикселей слева). Также не надо давать номерные классы, вы сами запутаетесь в итоге и вообще это дурацкая практика.

В принципе тут можно скопировать почти все из рабочего проекта и 1 блок разработать самостоятельно (так что не изобретайте велосипед), то же с css, чуть-чуть подправить цвета, размеры текста, расположение. Нужно нарезать макет на картинки, картинку из блока фич вырезать нужно спрайтом.
По сути в обучающем видео же сказали, что нужно чуть поменять дизайн и все, контент то тот же остается и сетка даже почти та же