[Ben]

Hi,
ich habe da mal eine Frage zur Auszeichnungen von Überschriften mittels <h1> und Co.

Ich habe im "header" der Seite den Titel der Seite stehen und habe dort das <h1> verwendet.
Ich würde jetzt aber eigentlich gerne das <h1> an anderer Stelle verwenden, nämlich für die Überschrift jeder einzelnen Seite, also z.B. "Tutorials".

Wie löse ich das jetzt geschickt?
Ist es irgendwie egal, ob ich <h1> jetzt mehrfach verwende? Wäre mir persönlich neu .. hab so im Hinterkopf, dass man drauf achten sollte. Obwohl ich auch Seiten habe, auf denen mehrfach <h3> vorkommt.

Danke für eure Hilfe ..

Grüße Ben.

[_root]

Die Tags kannst du mehrfach verwenden, solange du immer mit dem selben CSS Arbeitest Sprich Wie die überschriften gleich gross und gleich sind wie die Header schrift spielt das keine Rolle.
Am besten machst du dir darüber mal genau gedanken wie du das ganze strukturieren willst bevor du damit beginnst. Nachträglich kann das ansonsten einen ziemlichen ärger und aufwand geben.

[Ben]

Hi,

Zitat von _root

solange du immer mit dem selben CSS Arbeitest Sprich Wie die überschriften gleich gross und gleich sind wie die Header schrift spielt das keine Rolle.

So. Und jetzt mal bitte auf deutsch.
Da habe ich genau nix von verstanden!

Zitat von _root

Am besten machst du dir darüber mal genau gedanken wie du das ganze strukturieren willst bevor du damit beginnst. Nachträglich kann das ansonsten einen ziemlichen ärger und aufwand geben.

Is' ja nicht so, dass ich noch nie 'ne Webseite erstellt hätte ..

[_root]

Zitat von Ben

Hi,

Is' ja nicht so, dass ich noch nie 'ne Webseite erstellt hätte ..

Stimmt
ich lese immer nur Ben, das wörtchen darunter (Projektleiter) ist mir bis anhin noch gar nie aufgefallen.

Also zum Thema, <h1> bis <h6> kannst du auf deiner Seite so oft einsetzten wie du willst. Was du aber nicht darfst soweit ich weis, nach einer Definition in einem CSS. Die Atribute wieder ändern <h1 style="bla:4px;"> sollte nicht der Fall sein.
Wen du jetzt bei deiner Seite den Header mit <h1> gemacht hast kannst du es für die Themenüberschrift immer noch benützen solange keine umformatierung notwenig ist ala style="bla:4px;".
Verständlich?

[Ben]

Jo. Haste dazu mal einen Link .. ich muss ganz ehrlich sagen, dass ich in der Spezifikation nicht so wirklich fündig werde ..

[CIX88]

Nachträglich kann das ansonsten einen ziemlichen ärger und aufwand geben.

Wohl sicher nicht, wenn man mit CSS arbeitet.
Dazu ist es ja da

[_root]

http://www.w3schools.com/tags/tag_hn.asp
http://www.w3.org/TR/REC-html40/
http://www.w3.org/TR/REC-html40/stru...l.html#edef-H1
http://de.selfhtml.org/html/text/ueb...htm#definieren

[_root]

Zitat von CIX88

Wohl sicher nicht, wenn man mit CSS arbeitet.
Dazu ist es ja da

Ich spreche nicht von der Formatirung mit CSS sondernvon der Plazierung der <h1-6> Tags, und deren Sinn und Zweck im Template.

[CIX88]

Ich spreche nicht von der Formatirung mit CSS sondernvon der Plazierung der <h1-6> Tags, und deren Sinn und Zweck im Template.

Achso, sorry hatte am Monitor nichts gehört

und wo steht, dass ich für zB ein h1 Tag nicht mehrere Stiyles festlegen darf?

[_root]

Zitat von Fat Tony

und wo steht, dass ich für zB ein h1 Tag nicht mehrere Stiyles festlegen darf?

Finde es selbst grad nicht eher sogar eine wiederlegung. Die Regelungen sind hier ziemlich offen, aber sieht selbst:


Da steht das man in den <h[1-6]> die universalattribute normal verwenden darf. Diese wären class, id, style, title. Weiter kommen Regionale dazu dir, lang. Und javascript attribute die ich hier jetzt nich aufliste.
http://de.selfhtml.org/html/referenz...bute.htm#h1_h6
http://de.selfhtml.org/html/referenz...ersalattribute
Damit sollten alle Fragen geklärt sein oder?

[Lars]

Es ist einfach ein Faut-pas. Man sollte es also einfach nicht machen. Genau wie fünffach verschachtelte Tabellen

[_root]

Zitat von Lars

Es ist einfach ein Faut-pas. Man sollte es also einfach nicht machen. Genau wie fünffach verschachtelte Tabellen

Jetzt habe ich es wieder, es ist in einer coding guideline eines kleinProjekts
Aber was solls am besten man glaubt nur noch noch w3c, den die werdens schon wissen

[Cojote]

h1 darf so oft verwendet werden wie man lustig ist.
Es ist von Vorteil h1 auf einer Seite mehrfach zu verwenden. Gerade aus Sicht der Barrierefreiheit.
h1-h6 sollten aber nicht fröhlich gemischt werden. Wenn man das Dokument später von oben nach unten durchgeht soll die Reihenfolge der hs also einen Sinn ergeben ähnlich eines Inhaltsverzeichnis, ansonsten ist der Einsatz von h's zwar löblich verwirren aber einen Screenreader mehr als sie ihm nützen.

Passt der Style nicht so ist es sogar besser ihn einmalig durch ändern der CSS-Formatierung wie angegeben anzupassen.

[Ben]

Zitat von Cojote

h1 darf so oft verwendet werden wie man lustig ist.

Das ist korrekt .. steht ja auch hier ..

HTML unterscheidet 6 Überschriftenebenen, um Hierarchieverhältnisse in Dokumenten abzubilden.
[..]
Die Nummer steht für die Überschriftenebene. 1 ist die höchste Ebene, 6 die niedrigste.

http://de.selfhtml.org/html/text/ueberschriften.htm

Zitat von Cojote

Es ist von Vorteil h1 auf einer Seite mehrfach zu verwenden. Gerade aus Sicht der Barrierefreiheit.

Das ist nicht korrekt. Das hat nicht wirklich was mit Barrierefreiheit, wenn man <h1>..</h1> im Überfluss verwendet.
Die Diskussion ist hier aber fehl am Platze .

Zitat von Cojote

ansonsten ist der Einsatz von h's zwar löblich verwirren aber einen Screenreader mehr als sie ihm nützen.

Wäre mir neu .. hast du eventuell einen Link zu einer bestätigten Aussage dazu?

Grüße Ben.

[Cojote]

Stimmt natürlich dass man h s nicht im Überfluss sondern eher sparsam verwenden sollte. Hier steht die Sinnigkeit im Vordergrund. Es bringt genauso wenig auf sinnvolle h s zu verzichten wie plötzlich alle Elemente als Überschrift der ersten Ebene zu setzen. Ich sehe die h-Elemente eigentlich immer gleichbedeutend mit einem kleinen Inhaltsverzeichnis der jeweiligen Seite

Wäre mir neu .. hast du eventuell einen Link zu einer bestätigten Aussage dazu?

Ich nehme an du meinst dass ich das generell über Überschriften gemeint habe. Ich meinte jedoch dass die Überschrift nur in einer sinnvollen Reihenfolge einen Sinn machen. Screenreader können beispielsweise durch bestimmte Tastenkombinationen die jeweiligen h s erreichen. Dies geschieht von oben nach unten auf der jeweiligen Überschriftenebene. Sind die Überschriften nicht in einer sinnvollen Reihenfolge wird der Benutzer dadurch verwirrt, die Überschriften machen für ihn keinen Sinn.

Ich würde vielleicht ganz von h1-h6 abrücken.
Wenn Du spezielle Überschriften definieren willst, die Du aber mehrfach einsetzen willst, bist Du darauf garnicht angewiesen.
Du definierst einfach eigene Überschriften....
Beispiel: Überschrift für alle Seitenüberschriften

HTML-code:

<div class="main_header">
ich bin eine seitenüberschrift
</div>

CSS-code:

.main_header
{
font-size: 1.3em;
font-color: #333333;
font-weight: bold;
font-family: verdana, sans-serif;
text-align: center;
}


Jetzt brauchst Du sämtliche Seitenüberschriften einfach nur in <div>-tags mit Angabe dieser Klasse einschliessen.
Auf diese Weise kannst Du Dir auch ewig viele verschiedene Überschriftsarten selber definieren.

Ich hoffe, ich bin nicht am Thema vorbei, und konnte Dir helfen.

Grüße
flupsi

[robo47]

@flupsi
Wenn ich ne Überschrift will, dann nutze ich auch eine und keine Div-Layer, das wäre rein semantisch betrachtet nicht sauber, vor allem für die allgemeine struktur die beim Thema Barrierefreiheit eine große Rolle spielt, sollte man auf ein saubere und logische html-struktur achten, es zählt nicht nur wie es im browser am ende aussieht.

mfg
robo47

Wenn ich ne Überschrift will, dann nutze ich auch eine und keine Div-Layer, das wäre rein semantisch betrachtet nicht sauber

Das ist faktisch falsch. Div-Layer sind sematisch einwandfrei und in Verbindung mit einer sauberen CSS-Datei Grundlage von XHTML.

Tags, wie <h1-6> sind inzwischen völlig überflüssig geworden. Zudem schränken sie einen ein.
Man kann sie zwar auch ebenso per CSS definieren, wäre aber auf 6 Überschriftsarten beschränkt. Wobei das natürlich für viele Seiten ausreicht.

vor allem für die allgemeine struktur die beim Thema Barrierefreiheit eine große Rolle spielt

Sorry, aber das ist Quatsch.
Mit Barrierefreiheit hat das nicht das geringste zu tun. Barrierefreiheit schaffst Du z.B., indem Du relative Schriftgrößen nutzt und nicht px oder gar pt. Der Einsatz von <h1-6> anstatt eines Div-Layers fördert in keinster Weise die Barrierefreiheit.

[robo47]

Zitat von flupsi

Das ist faktisch falsch. Div-Layer sind sematisch einwandfrei und in Verbindung mit einer sauberen CSS-Datei Grundlage von XHTML.

Tags, wie <h1-6> sind inzwischen völlig überflüssig geworden. Zudem schränken sie einen ein.
Man kann sie zwar auch ebenso per CSS definieren, wäre aber auf 6 Überschriftsarten beschränkt. Wobei das natürlich für viele Seiten ausreicht.

Sorry, aber das ist Quatsch.
Mit Barrierefreiheit hat das nicht das geringste zu tun. Barrierefreiheit schaffst Du z.B., indem Du relative Schriftgrößen nutzt und nicht px oder gar pt. Der Einsatz von <h1-6> anstatt eines Div-Layers fördert in keinster Weise die Barrierefreiheit.

Da bin ich aber anderer Meinung. Semantik gehört zur Barrierefreiheit, Überschriften etc gehören in die passenden tags, nur so können User von Screenreadern etc, eine Struktur in einer Seite erkennen. Alles in divs zu knallen wird eine einzige div-suppe draus.

Barrierefreiheit ist NICHT nur der optische Teil, eben auch die User die nicht sehen können sollen möglichkeiten haben Inhalte zu erfassen, dass ist wie, dass man eben <strong> und <em> anstatt <b> und <i> verwendet, weil das eine wirklich eine bedeutung hat / von Screenreadern anders betont wird und 2teres eben nur eine grafische andere Darstellung hervorruft (nicht bei allen Screenreadern) und nicht noch auf die Idee kommt auch das via CSS zu lösen.

mfg
robo47