Impressum · Kontakt · Hilfe
Besucher online · Mitglieder



Portal > Foren > Ausschreibungssprachen und clientseitige Programmierung > HTML, XML und CSS > <hx> - Wie zeichnet man Überschriften richtig aus?
Antwort
 
Themen-Optionen
Alt 31.12.2005, 00:21   Nach oben    #1
Ben
Erfahrener Benutzer
 
Benutzerbild von Ben
 
Registriert seit: 02.12.2004
Ort: Remagen
Beiträge: 4.583
Standard <hx> - Wie zeichnet man Überschriften richtig aus?

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.
Ben ist offline  
Add Post to del.icio.usBookmark Post in TechnoratiDiesen Beitrag zu Mister Wong hinzufügen!
Mit Zitat antworten
Alt 31.12.2005, 00:29   Nach oben    #2
_root
.
 
Registriert seit: 21.09.2005
Ort: CH-JP
Beiträge: 47
Standard

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.
_root ist offline  
Add Post to del.icio.usBookmark Post in TechnoratiDiesen Beitrag zu Mister Wong hinzufügen!
Mit Zitat antworten
Alt 31.12.2005, 00:32   Nach oben    #3
Ben
Erfahrener Benutzer
 
Benutzerbild von Ben
 
Registriert seit: 02.12.2004
Ort: Remagen
Beiträge: 4.583
Standard

Hi,
Zitat:
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:
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 ..
Ben ist offline  
Add Post to del.icio.usBookmark Post in TechnoratiDiesen Beitrag zu Mister Wong hinzufügen!
Mit Zitat antworten
Alt 31.12.2005, 00:48   Nach oben    #4
_root
.
 
Registriert seit: 21.09.2005
Ort: CH-JP
Beiträge: 47
Standard

Zitat:
Zitat von Ben
Hi,
Zitat:
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 ..
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?
_root ist offline  
Add Post to del.icio.usBookmark Post in TechnoratiDiesen Beitrag zu Mister Wong hinzufügen!
Mit Zitat antworten
Alt 31.12.2005, 01:34   Nach oben    #5
Ben
Erfahrener Benutzer
 
Benutzerbild von Ben
 
Registriert seit: 02.12.2004
Ort: Remagen
Beiträge: 4.583
Standard

Jo. Haste dazu mal einen Link .. ich muss ganz ehrlich sagen, dass ich in der Spezifikation nicht so wirklich fündig werde ..
Ben ist offline  
Add Post to del.icio.usBookmark Post in TechnoratiDiesen Beitrag zu Mister Wong hinzufügen!
Mit Zitat antworten
Alt 31.12.2005, 01:40   Nach oben    #6
CIX88
Erfahrener Benutzer
 
Registriert seit: 18.03.2005
Beiträge: 576
Standard

Zitat:
Nachträglich kann das ansonsten einen ziemlichen ärger und aufwand geben.
Wohl sicher nicht, wenn man mit CSS arbeitet.
Dazu ist es ja da
CIX88 ist offline  
Add Post to del.icio.usBookmark Post in TechnoratiDiesen Beitrag zu Mister Wong hinzufügen!
Mit Zitat antworten
Alt 31.12.2005, 01:44   Nach oben    #8
_root
.
 
Registriert seit: 21.09.2005
Ort: CH-JP
Beiträge: 47
Standard

Zitat:
Zitat von CIX88
Zitat:
Nachträglich kann das ansonsten einen ziemlichen ärger und aufwand geben.
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.
_root ist offline  
Add Post to del.icio.usBookmark Post in TechnoratiDiesen Beitrag zu Mister Wong hinzufügen!
Mit Zitat antworten
Alt 31.12.2005, 01:48   Nach oben    #9
CIX88
Erfahrener Benutzer
 
Registriert seit: 18.03.2005
Beiträge: 576
Standard

Zitat:
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
CIX88 ist offline  
Add Post to del.icio.usBookmark Post in TechnoratiDiesen Beitrag zu Mister Wong hinzufügen!
Mit Zitat antworten
Alt 31.12.2005, 08:07   Nach oben    #10
Jay
Gast
 
Beiträge: n/a
Standard

und wo steht, dass ich für zB ein h1 Tag nicht mehrere Stiyles festlegen darf?
 
Add Post to del.icio.usBookmark Post in TechnoratiDiesen Beitrag zu Mister Wong hinzufügen!
Mit Zitat antworten
Alt 31.12.2005, 11:54   Nach oben    #11
_root
.
 
Registriert seit: 21.09.2005
Ort: CH-JP
Beiträge: 47
Standard

Zitat:
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?
_root ist offline  
Add Post to del.icio.usBookmark Post in TechnoratiDiesen Beitrag zu Mister Wong hinzufügen!
Mit Zitat antworten
Alt 31.12.2005, 12:02   Nach oben    #12
Lars
me pro ok?
 
Benutzerbild von Lars
 
Registriert seit: 07.09.2005
Ort: Pulheim bei Köln
Beiträge: 964
Standard

Es ist einfach ein Faut-pas. Man sollte es also einfach nicht machen. Genau wie fünffach verschachtelte Tabellen
__________________
Gedanken aus Draht stricken einen Zaun.
Lars ist offline  
Add Post to del.icio.usBookmark Post in TechnoratiDiesen Beitrag zu Mister Wong hinzufügen!
Mit Zitat antworten
Alt 31.12.2005, 12:12   Nach oben    #13
_root
.
 
Registriert seit: 21.09.2005
Ort: CH-JP
Beiträge: 47
Standard

Zitat:
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
_root ist offline  
Add Post to del.icio.usBookmark Post in TechnoratiDiesen Beitrag zu Mister Wong hinzufügen!
Mit Zitat antworten
Alt 02.01.2006, 16:50   Nach oben    #14
Cojote
Neuer Benutzer
 
Registriert seit: 02.01.2006
Beiträge: 13
Standard

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.
Cojote ist offline  
Add Post to del.icio.usBookmark Post in TechnoratiDiesen Beitrag zu Mister Wong hinzufügen!
Mit Zitat antworten
Alt 02.01.2006, 16:56   Nach oben    #15
Ben
Erfahrener Benutzer
 
Benutzerbild von Ben
 
Registriert seit: 02.12.2004
Ort: Remagen
Beiträge: 4.583
Standard

Zitat:
Zitat von Cojote
h1 darf so oft verwendet werden wie man lustig ist.
Das ist korrekt .. steht ja auch hier ..
Zitat:
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:
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:
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.
Ben ist offline  
Add Post to del.icio.usBookmark Post in TechnoratiDiesen Beitrag zu Mister Wong hinzufügen!
Mit Zitat antworten
Alt 02.01.2006, 17:26   Nach oben    #16
Cojote
Neuer Benutzer
 
Registriert seit: 02.01.2006
Beiträge: 13
Standard

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

Zitat:
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.
Cojote ist offline  
Add Post to del.icio.usBookmark Post in TechnoratiDiesen Beitrag zu Mister Wong hinzufügen!
Mit Zitat antworten
Alt 03.01.2006, 09:36   Nach oben    #17
flupsi
Gast
 
Beiträge: n/a
Standard

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
 
Add Post to del.icio.usBookmark Post in TechnoratiDiesen Beitrag zu Mister Wong hinzufügen!
Mit Zitat antworten
Alt 03.01.2006, 09:55   Nach oben    #18
robo47
BIN EIN KRASSA HELD!!!111
 
Benutzerbild von robo47
 
Registriert seit: 02.06.2005
Ort: weiher im tiefsten Odenwald
Beiträge: 1.170
Standard

@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
robo47 ist offline  
Add Post to del.icio.usBookmark Post in TechnoratiDiesen Beitrag zu Mister Wong hinzufügen!
Mit Zitat antworten
Alt 03.01.2006, 10:08   Nach oben    #19
flupsi
Gast
 
Beiträge: n/a
Standard