Verwendung von HTML5 Tags

[phzu]

Hallo!

Ich arbeite schon seit langem mit HTML, auch schon ein Weilchen mit HTML5.

Zum Einstieg in HTML5 habe ich mir ein Buch zugelegt, welches relativ gute Erklaerungen beinhaltet. Leider befuerchte ich, dass einiges darin falsch ist.

Vor allem die grundsaetzliche Formatierung einer Seite in HTML5. Genau dazu habe ich ein paar Fragen.

1. Im Buch wird deren Beispielseite auf eine Breite von 960px limitiert. Sie geben dem BODY diese Eigenschaft. Ist das valide oder muss die gesamte Seite in ein DIV welches dann auf 960px eingestellt wird?

2. Das ASIDE Tag findet man in Online-Beschreibungen haeufig dazu verwendet, eine Sidebar zu gestalten. Dem Namen nach macht das Sinn, allerdings wird im Buch ausdruecklich geschrieben, dass das ASIDE Tag dazu dient, um in Artikeln Zitate oder Nebeninformationen darzustellen.

3. Das SECTION Tag. Es wird im Buch verwendet um einzelne Artikel (mit ARTICLE Tag definiert) sowie eine Sidebar zu beinhalten. Allerdings liest man im Internet oft, dass das SECTION Tag nicht dazu dient, andere Elemente zu gruppieren und dafuer das DIV verwendet werden soll.

4. Die Navigation mit dem NAV Tag. Im Buch wird die Navigation in den HEADER Tag der Seite inkludiert. Im Internet sieht man oft, dass das NAV Tag alleinstehend nach dem HEADER verwendet wird. Wie wird es richtig verwendet?

Ich weiss dass diese Punkte keine Darstellungsprobleme oder anderes verursachen, allerdings moechte ich einfach die Sachen richtig benutzen. Da ich meinem Buch leider nicht mehr ganz vertraue, frage ich hier noch einmal nach.

Vielen Dank fuer eine kurze Aufklaerung!
Bis dann!

 

[Cheffchen]

Hallo,

also das die html5 Sachen alle noch in der Betaphase sind ist dir schon klar?
Und damit wohl die meisten Bücher eher suboptimal sind, sagen zumindest leute die solche Bücher leider mal gekauft haben.
Das Html5 nicht auf allen Browser angezeigt werden ist dir auch klar, was bei Non-Profit Seiten ja kein stört aber wenn es um Geld geht, hört nun mal der Spaß auf :O).

Also BODY begrenzen, das sagt doch schon einiges über dein Buch aus. Wenn das machst wette ich fast, das spätter einige probleme bekommen wirst mit zoom sachen, die ja meistens den body abgreifen um sich zu positionieren und ein dunklen Layer zu erstellen. Also schrott.

Die anderen Sachen kann ich nichts zu sagen da ich zwar auch in html5 sachen mache aber halt nur das was immer funktioniert und so lang die Besucher noch weit über 2 stellig prozentpunkte mit ASIDE oder ARTICLE nichts anfangen können nehme ich nur das was mir das leben erleichtert.

Cheffchen

 

[Marv]

Hi, ich glaube nicht, dass was im Buch steht falsch ist. Vielmehr, dass in der Praxis halt Sachen anders gemacht werden, als empfohlen und gedacht ist.

1) Hier wurde ja als Beispiel der Body angesprochen, in der Praxis kann es aber unflexibel sein wenn du den body schon begrenzt, valide sollte es trotzdem sein.
4.) Eine Navigation bleibt eine Navigation, egal wo sie steht.

zu 2 / 3 bin ich mir gar nicht sicher wie wichtig das ist, da HML5 eh noch nicht ganz festgelegt ist.
Ein ASIDE soll wohl wirklich nur nebeninfos bringen zum Artikel, viele benutzen es aber trotzdem für den Aufbau der Seite... Viele Websiten bestehen eben nicht aus klassischen Artikeln, das W3C hat wohl Wikipedia als Beispiel genommen .

Das SECTION Element würde ich auch eher als Sektionen sehen und nicht zwingend um jeden Artikel legen, sondern wahrscheinlich auch ein div verwenden.

Vielleicht zerbrechen sich die Leute auch umsonst den Kopf...
Ich würde beim W3C nachgucken:
HTML5 Reference

 

[phzu]

Cheffchen

Hallo,

also das die html5 Sachen alle noch in der Betaphase sind ist dir schon klar?
Und damit wohl die meisten Bücher eher suboptimal sind, sagen zumindest leute die solche Bücher leider mal gekauft haben.
Das Html5 nicht auf allen Browser angezeigt werden ist dir auch klar, was bei Non-Profit Seiten ja kein stört aber wenn es um Geld geht, hört nun mal der Spaß auf :O).

Also BODY begrenzen, das sagt doch schon einiges über dein Buch aus. Wenn das machst wette ich fast, das spätter einige probleme bekommen wirst mit zoom sachen, die ja meistens den body abgreifen um sich zu positionieren und ein dunklen Layer zu erstellen. Also schrott.

Die anderen Sachen kann ich nichts zu sagen da ich zwar auch in html5 sachen mache aber halt nur das was immer funktioniert und so lang die Besucher noch weit über 2 stellig prozentpunkte mit ASIDE oder ARTICLE nichts anfangen können nehme ich nur das was mir das leben erleichtert.

Cheffchen
​

Ja das das alles noch Beta ist, ist mir schon klar. Ich mache mit HTML auch nix beruflich bzw. gewerblich. Erstelle und verwalte ein paar Seiten von lokalen Sportklubs, alles ehrenamtlich.

Grund warum ich HTML5 verwende ist, dass ich einfach gerne auf dem neuesten Stand bin. Ob das nun alles perfekt ist was ich mache soll dahingestellt sein. Wenn allerdings immer alles auf alten Standards erstellt wird, wird die implementierung in die Browser auch nie umgesetzt.

Aber doch muessen sich die "Entwickler" von HTML5 Gedanken darueber gemacht haben, wie solche Elemente verwendet werden, und darueber wollte ich mich informieren.

Das Buch, wie gesagt, ich vertraue ihm auch als Anfaenger nicht mehr wirklich.

Marv

Das SECTION Element würde ich auch eher als Sektionen sehen und nicht zwingend um jeden Artikel legen, sondern wahrscheinlich auch ein div verwenden.
​

Es wird im Buch nicht um jeden einzelnen Artikel gelegt, sondern um alle auf der Seite angezeigten. (Ich gehe jetzt einfach mal von einem Blog-Layout aus)

Mfg

 

[Tronjer]

Das <section> Tag lässt sich sowohl für die Sektion einer Seite als auch den Abschnitt eines Artikels verwenden.

<!-- Sektion -->
<section>
    <article>
        <!-- Kapitel -->
        <section>
             .......
        </section>
    </article>
</section>

Davon abgesehen gibt es zwar sehr viel Literatur, aber noch keine einheitlichen Standards oder gar best practices für HTML5. Ich bevorzuge da Quellen im Netz, und wenn ein Autor ohne zwingenden Grund den Body begrenzen will, würde ich ihm ohnehin nicht vertrauen.

Vielleicht hilft dir ja ein Flowchart für den Einstieg. Außerdem gibt es diverse HTML5-Frameworks, die man sich herunterladen und anpassen kann.

http://html5doctor.com/downloads/h5d-sectioning-flowchart.pdf