Hallo Matthias,

Die Navigation vor main, welche Funktion hat das Bild? Nur Schmuck? Dann könnte es Hintergrundbild von main oder nav sein. Transportiert es Informationen, wie etwa ein Foto vom Betriebsgelände, dann als Teil eines Headers vielleicht.

wie sieht dieser Aufbau aus? Denn das Titelbild soll später vielleicht ein kleiner Slider werden, also kann ich diesen nicht als Background einbinden.

<header>
  <h1>Titel der Seite</h1>
</header>

<nav>
    <ul>
        <li><a href="#">Startseite</a></li>
        <li><a href="#">Leistungen</a></li>
        <li><a href="#">Referenzen</a></li>
        <li><a href="#">Kontakt</a></li>
        <li><a href="#">Impressum</a></li>
    </ul>
</nav>

<main>
    <aside>
        <img src="img/bild.jpg" alt="Titelbild">
    </aside>

    <h2>Titel der Section</h2>
    <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
    <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
    <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
    <article>
      <h2>Leistung 1</h2>
      <figure>
      <img src="http://placehold.it/350x150" alt="Bild 1">
    </figure>
    <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
    <p>... weiterlesen</p>
    </article>
    <article>
      <h2>Leistung 1</h2>
      <figure>
      <img src="http://placehold.it/350x150" alt="Bild 1">
    </figure>
    <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
    <p>... weiterlesen</p>
    </article>
    <article>
      <h2>Leistung 1</h2>
      <figure>
      <img src="http://placehold.it/350x150" alt="Bild 1">
    </figure>
    <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
    <p>... weiterlesen</p>
    </article>
  </section>
</main>
<footer> </footer>