Anfängerfrage HTML(5) - Navigation

haunt

Lieutenant
Registriert
Juni 2010
Beiträge
584
Hallo zusammen,
ich hab mal eine ganz doofe Frage. Mein Wissen bzgl. Webseitendesign liegt 12 Jahre zurück :D
Früher hatte man noch Frames und hat die dann mit Inhalt befüllt.

Also ich möchte gerne eine kleine HTML App bauen welche es mir ermöglicht täglich Daten dort einzutragen und diese dann als Report zu versenden. Jetzt möchte ich zunächst das Gerüst aufbauen. Später will ich dann die Daten versenden. Wobei ich da auch noch nicht weiß wie das geht...

ich habe folgendes Beispiel im Netz gefunden:

<body>

<div id="header">
<h1>Überschrift</h1>
</div>

<div id="nav">
Morning Check<br>
Report<br>
About<br>
</div>

<div id="section">
<h1>Morning Check</h1>
<p>
Test
</p>
</div>

</body>

So wie ich das verstehe navigiere ich über <nav> in <sections> und <articles>? Aber wie?
oder baue ich mir jeweils eine Seite die quasi identisch bis auf section und article ist und verweise dann via href auf diese?

Steh da gerade auf dem Schlauch. Zu meiner Zeit hätte sich jetzt in Frame3 <- der section quasi die Report Seite, die Morning Check Seite oder About geöffnet....

Ich habe noch folgendes Beispiel probiert:
<div id="menu">
<ul>
<li><a href="Test2.html">Link1</a></li>
<li><a href="#">Link2</a></li>
<li><a href="#">Link3</a></li>
</ul>
</div>

aber dann verlasse ich ja meine Seite? Wie behalte ich denn den Header und meine Menüleiste? :D

Und falls mir jemand ein gutes Buch empfehlen könnte

Danke,

Haunt
 
Zuletzt bearbeitet:
haunt schrieb:
So wie ich das verstehe navigiere ich über <nav> in <sections> und <articles>? Aber wie?
Nein, das ginge nur mit einer ergänzenden Scriptsprache wie Javascript oder PHP. Die neuen HTML5-Elemente dienen nur der Auszeichnung.


haunt schrieb:
oder baue ich mir jeweils eine Seite die quasi identisch bis auf section und article ist und verweise dann via href auf diese?
Korrekt. Du kannst alternativ die "statischen" Bereiche mit Includes inkludieren, z.B. mit PHP.
 
Mrdk schrieb:
Nein, das ginge nur mit einer ergänzenden Scriptsprache wie Javascript oder PHP. Die neuen HTML5-Elemente dienen nur der Auszeichnung.

Das geht schon so. Es braucht halt weiterhin Links, die kommen jetzt nur innerhalb nav-Tags, um den Bereich entsprechend zu markieren. Ohne Frames muss man bei statischen Seiten den entsprechenden Code entweder in jede Datei einfügen oder das Menü irgendwie dynamisch machen. Bei statischen Seiten bliebe hier praktisch nur JavaScript, das muss der Benutzer dann zwingend aktivieren (was allerdings Standard ist). Kommt auch eine serverseitige Generierung in Frage, hast Du Qual der Wahl.
 
danke für die Antworten.
Ich will ja erstmal nur eine kleine App fürs Büro schreiben.
 
haunt schrieb:
Ich habe noch folgendes Beispiel probiert:
<div id="menu">
<ul>
<li><a href="Test2.html">Link1</a></li>
<li><a href="#">Link2</a></li>
<li><a href="#">Link3</a></li>
</ul>
</div>

Sollte so aussehen:


Code:
<nav id="menu">
    <ul>
        <li><a href="Test2.html">Link1</a></li>
        <li><a href="#">Link2</a></li>
        <li><a href="#">Link3</a></li>
    </ul>
</nav>


haunt schrieb:
aber dann verlasse ich ja meine Seite? Wie behalte ich denn den Header und meine Menüleiste? :D

Zwei Möglichkeiten:

1. "Den Rahmen" bauen und darauf jede Seite aufbauen
2. Ein CMS nutzen welches es erlaubt Templates zu benutzen.

Da du ja eher Anfänger bist würde ich vorschlagen du machst Möglichkeit 1 ;)
 
Cool Master schrieb:
Sollte so aussehen:


Code:
<nav id="menu">
    <ul>
        <li><a href="Test2.html">Link1</a></li>
        <li><a href="#">Link2</a></li>
        <li><a href="#">Link3</a></li>
    </ul>
</nav>

korrektur ;)
Code:
<nav>
    <ul>
        <li><a href="Test2.html">Link1</a></li>
        <li><a href="#">Link2</a></li>
        <li><a href="#">Link3</a></li>
    </ul>
</nav>
 
@kling1

Würde ich so nicht machen. Ich vergebe IMMER eine ID. Vor allem weil ein <NAV> auch zweimal vorkommen kann (Footer Menü).
 
Das gleiche dann aber beim <header> und den <section> en auch machen bzw. die ganze Struktur auf HTML5 Basis
 
Cool Master schrieb:
@kling1

Würde ich so nicht machen. Ich vergebe IMMER eine ID. Vor allem weil ein <NAV> auch zweimal vorkommen kann (Footer Menü).

dafür gibt es ja die header und footer tags in du das nav tag packen kannst.. ich würde mitlerweile.. auf klassen und ids (außer für irgendwelche javascript geschichten) komplett verzichten.. und einfach sauberes html schreiben
 
@kling1

Angewohnheit. Wenn man das nun seit rund 15 Jahren macht wird man es nicht mehr los ;) Dazu kommt wie du schon sagst da immer mehr JS eingesetzt wird ist man somit schon mal auf der sicheren Seite und es vereinfacht alles erheblich.

@Dragon Sun

Kommt darauf an was man machen will. Für eine "News" Seite etc. würde ich <article> etc. nehmen ansonsten würde ich beim guten alten div bleiben.
 
Zurück
Oben