Anastasia W.: Startseite mit mehreren Bereich inkl. Navigation

Sehr geehrte Damen und Herren,

vielleicht können Sie mir weiterhelfen. Ich benötige für meine Homepage drei Unterseiten welche Wiederrum jeweils 2-3 Bereiche haben:

  • Startseite

    • Kontakt
    • Bilder
    • Leistungen
  • Über mich

    • Beschreibung
    • Bild
    • Referenzen
  • Impressum

    • Inhalt
    • Kontaktformular
    • Googlemap

Folgende Design schwebt mir im Kopf. Wenn die Startseite aufgerufen wird soll ein großes Bild zu sehen sein welches über die ganze Seite geht. Unten am Bildschirmrand sollte sich meine Navigation befinden. Scrollt der User nach unten sollte die Navigation mit dem großen Bild mitwandern, allerdings irgendwann ganz oben stehen bleiben, sobald man in den zweiten Bereich der Startseite gelangt. Scrollt der User wieder nach unten sollte die Navigation wenn der User im ersten Bereich mit dem großen Bild angekommen ist wieder mit nach unten wandern.

Was ich im Internet zusammen gesucht / gefunden habe wäre diese Aufbau.

<section>

	<div>Hier kommt ein Text für Google rein, der über das Bild gelegt wird</div>
	
	<nav>
	<img src="" alt="Logo">
	<ul>
		<li><a href="#">Startseite</a></li>
		<li><a href="#">Über mich</a></li>
		<li><a href="#">Impressum</a></li>
	</ul>
	</nav>

</section>

<section>
	<h2>Kontakt</h2>
	<p>Hier kommt eine kleine Beschreibung rein</p>
</section>

<section>
	<h2>Bilder</h2>
	<p>Hier kommt eine kleine Beschreibung rein</p>
</section>

<section>
	<h2>Leistungen</h2>
	<p>Hier kommt eine kleine Beschreibung rein</p>
</section>

Wie kann ich es erreichen dass ich mehrere Bereiche habe, die immer komplett den ganzen Bildschirm ausfüllen. Benötige ich JavaScript?

  1. Hallo Anastasia W.,

    Sehr geehrte Damen und Herren,

    So viel Förmlichkeit ist gar nicht notwendig :)

    Folgende Design schwebt mir im Kopf. Wenn die Startseite aufgerufen wird soll ein großes Bild zu sehen sein welches über die ganze Seite geht.

    <section>
    
    	<div>Hier kommt ein Text für Google rein, der über das Bild gelegt wird</div>
    

    Nur für Google oder auch für deine Besucher? Falls ersteres: Versuch nicht, google oder andere Suchmaschinen zu betrügen, indem du ihnen andere Inhalte zeigst als menschlichen Besuchern. Die merken und bestrafen das. Und das zu Recht. Schließlich sind deine Seiten für Menschen gedacht und nicht für Suchmaschinen.

    Wie kann ich es erreichen dass ich mehrere Bereiche habe, die immer komplett den ganzen Bildschirm ausfüllen.

    immer komplett? Was ist, wenn der Bildschirm kleiner ist als die Inhalte? ;-)

    min-height: 100vh; für die entsprechenden Elemente wäre ein Ansatz.

    Benötige ich JavaScript?

    Nein. Nicht dafür.

    Bis demnächst
    Matthias

    --
    Dieses Forum nutzt Markdown. Im Wiki erhalten Sie Hilfe bei der Formatierung Ihrer Beiträge.
  2. Hi,

    Unten am Bildschirmrand sollte sich meine Navigation befinden.

    Wie kann ich es erreichen dass ich mehrere Bereiche habe, die immer komplett den ganzen Bildschirm ausfüllen. Benötige ich JavaScript?

    Der Bildschirmrand ist für HTML/CSS/Javascript unerreichbar. Das muß sich auf das Browserfenster (und dort auf den für die Webseiten-Anzeige vorgesehenen Bereich) beschränken.

    cu,
    Andreas a/k/a MudGuard