---

<!DOCTYPE html>
<html lang="ru">

<head>
  <meta charset="UTF-8">
  <title>Резюме джуниор-фронтенд-разработчика</title>
</head>

<body>
  <!-- Шапка сайта -->
  <header>
    <h1>Имя Фамилия</h1>
    <h2>Джуниор-фронтенд-разработчик</h2>
    <img src="photo.jpg" alt="Моё фото для резюме" width="150">
    <nav>
      <ul>
        <li><a href="#about">Обо мне</a></li>
        <li><a href="#skills">Навыки</a></li>
        <li><a href="#projects">Опыт</a></li>
        <li><a href="#contacts">Контакты</a></li>
      </ul>
    </nav>
  </header>

  <main>
    <!-- Раздел обо мне -->
    <section id="about">
      <h2>Обо мне</h2>
      <p>Здесь напиши несколько предложений о себе.</p>
    </section>

    <!-- Раздел навыков -->
    <section id="skills">
      <h2>Навыки</h2>
      <ul>
        <li><strong>HTML и CSS</strong></li>
        <li><em>JavaScript</em></li>
      </ul>
    </section>

    <!-- Раздел опыта (проекты) -->
    <section id="projects">
      <h2>Опыт</h2>
      <article class="project">
        <h3>Проект 1</h3>
        <p>Семантическое резюме (HTML)</p>
      </article>
      <article class="project">
        <h3>Проект 2</h3>
        <p>Сайт-портфолио (HTML, CSS, JS)</p>
      </article>
    </section>

    <!-- Дополнительная информация -->
    <aside>
      <h3>Хобби</h3>
      <p>Здесь можно написать о своих увлечениях или добавить цитату.</p>
    </aside>
  </main>

  <!-- Футер -->
  <footer>
    <section id="contacts">
      <h2>Контакты</h2>
      <p>Соцсети: ...</p>
      <p>Email: example@yandex.ru</p>
      <p>Мессенджер: ...</p>
    </section>
    <p><small>&copy; 2025 Имя Фамилия. Все права защищены.</small></p>
  </footer>
</body>

</html>