Drill 16: Inputs and outputs — Project: your profile page

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Amina Rahman — Frontend Developer</title>
  </head>
  <body>
    <header>
      <h1>Amina Rahman</h1>
      <p>Frontend developer in Dhaka, building accessible products.</p>
      <nav aria-label="Contact">
        <a href="mailto:amina@example.com">Email</a>
        <a href="https://github.com/">GitHub</a>
      </nav>
    </header>

    <main>
      <section aria-labelledby="about">
        <h2 id="about">About</h2>
        <p>I turn complex interfaces into <strong>calm, usable</strong> experiences.</p>
      </section>

      <section aria-labelledby="projects">
        <h2 id="projects">Projects</h2>
        <ul>
          <li><a href="/projects/ledger">Community ledger</a> — offline-first bookkeeping.</li>
          <li><a href="/projects/reader">Reader</a> — a distraction-free reading mode.</li>
        </ul>
      </section>
    </main>

    <footer>
      <p>© 2026 Amina Rahman</p>
    </footer>
  </body>
</html>