Minz schaut über den Tellerrand

Überschriften oder nicht Überschriften..?

8/26/2003

Mit dieser Frage kämpfe ich immer wieder:

 
<div id="headmast"> 
	<h1>Intermediate XHTML</h1> 

</div> 

<div id="content"> 
	<h2>Coursework</h2> 
	<p>Just some content here.....</p> 

</div>  
<div id="navigation"> 
<!-- Navigation --> 
	<h?>Week 1</h?> 
	<a href="/">The week one link</a> 
	<h?>Week 2</h?> 
	<a href="/">The week two link</a> 



</div>

Nun, was denkt ihr? Die Überschriften im Navigationsblock folgen dem Inhalt, sind aber für sich gesehen ein ganz neuer Abschnitt im Dokument.
Ist es besser diese Überschriften als <h3> oder als <h1> auszuzeichnen???

Oder würdet ihr es vorziehen keine Überschriften in der Linkliste zu haben, und anstattdessen eine Liste zu verwenden, wie zum Beispiel:

 
<ul> 
	<li>Week One: 
		<ul> 
		<li><a href="/">Link one</a></li> 
		<li><a href="/">Link two</a></li> 
		</ul> 
	</li> 



</ul>

Meinungen?

Kommentare

/:

I always use this scheme:

<h1>Page Title</h1>

<h2>Recent entries (or "Content" or some such)</h2>

<h3>Entry Title</h3>
<h3>Entry Title</h3>
<h3>Entry Title</h3>

<h2>Navigation</h2>
<ul>...</ul>

Abgegeben am 8/26/2003 um 53:43 AM

Anne van Kesteren:

Using h2 is correct. You can style them (why am I telling this, you know that :) ) to a smaller size with CSS. And with a descendent combinator you can style those different from the main content.

O and about ugly sites on the X-Philes list :), you know you can do a lot better. You CSS Zen Garden design betrayed you :p.

Abgegeben am 8/26/2003 um 59:30 PM

Minz Meyer:

Okay, thanks. <h2> sounds good for me.

@ Anne:
[..]you know you can do a lot better[..]

Veel dank voor de bloemen. (ouch, was this dutch? :))
But using 3 alternate styles for a homepage you have to make compromises (or blow up your source code).
I am quite satisfied with mine, although there are always things to improve (you know, I guess).

@/:
Just curious, I am eager to know who Mr. Or Mrs. / is :))

Abgegeben am 8/26/2003 um 33:52 PM

Arthur!:

'Bedankt voor die bloemen uit Holland', is what the pope always says :)

Abgegeben am 8/26/2003 um 54:03 PM

Thomas Scholz:

Ich denke, das ist einer der Fälle, in denen eine eigene <h1> für die Navigation richtig ist.
Die einzelnen Abschnitte bekommen dann eine <h2>, werden damit aber nicht mehr der <h1> des Haupttextes untergeordnet. Gerade für Voicebrowser, oder genauer: deren Nutzer, ist eine eigene Überschrift über der Navigation sehr willkommen. Die kann man aus optischen Gründen ja "verstecken".
Hauptsache, die Outline stimmt und hilft den Lesern. :)

Thomas

Abgegeben am 8/26/2003 um 47:08 PM

Minz Meyer:

Hallo Thomas,

anscheinend führen hier einmal wieder alle Wege nach Rom ;)
Aber die Sache mit der <h1> als Hauptüberschrift in der Navi erscheint mir plausibel (klatsch an die Stirn, hätt ich auch mal selber drauf kommen können).

In punkto Voicebrowser hatt ich da heute auch schon eine gegenteilige Aussage, was mich zu der Frage bringt:
Gibt es Voicebrowser, die das title Attribut unterstützen?

Beispiel:
<h2 title="Link to the week 2 assignment">Week 2</h2>

Abgegeben am 8/26/2003 um 19:55 PM

Thomas Scholz:

Ich glaube nicht, daß noch Voicebrowser unterwegs sind, die 'title' *nicht* unterstützen. Wie es mit Screenreadern aussieht, weiß ich nicht.
Diejenigen, die wie JAWS über die Accessibility-Schnittstelle auf den IE zugreifen, bekommen es. Aber eben nur im IE.

Ich würde ein Accessibility-Deature nicht vom 'title'-Attribut abhängig machen. Und wenn, dann gehört es in deinem Beispiel in den Link, nicht in die Überschrift, wenn ich das richtig sehe, oder?

Vorteil einer sauberen Outline ist eben, daß man manchen modernen Browsern (auch graphischen) von Überschrift zu Überschrift springen kann oder sich die Outline vorher ausgeben läßt.

Thomas

P.S.:Deine Umlaute fehlen ja immer noch. :)
P.P.S.: Sehe gerade einen komischen Bug in Opera Beta6: Text in der 'textarea', der in den 'padding'-Bereich hineinragt, wird beim Scrollen ganz komisch abgeschnitten ... hmm, muß ich doch mal ein Testcase basteln...

Abgegeben am 8/27/2003 um 30:15 AM

Minz Meyer:

[..] Und wenn, dann gehört es in deinem Beispiel in den Link, nicht in die Überschrift, wenn ich das richtig sehe, oder? [..]

Äh, jein.
Präziser formuliert hätte es heißen sollen:
<h2 title="Links to the week 2 assignment">Week 2</h2>
<a href="/" title="Link to the Review Questions of week 2">Review</a>
<a href="/" title="Link to the Project of week 2">Project</a>

nur um weitere erklärende Informationen zur Überschrift mit zu liefern, falls jemand sich entschliesst, sich nur die Überschriften der Webseite vorlesen zu lassen.

P.S. In meinem Opera 7.11 kann ich nichts von einem Textarea Bug erkennen.
P.P.S. Besser jetzt mit den Umlauten?

Abgegeben am 8/27/2003 um 07:58 AM

Thomas Scholz:

Ach so, jetzt kapier ich das mit den Überschriften. VIelleicht solltest du das leicht umformulieren, damit die Ansage nicht mit "Link" oder "Links" beginnt; das wird nämlich auch vor Hyperlinks gesagt.

Der 'textarea'-Bug scheint neu in dieser Beta zu sein. Zumindest ist er mir in früheren Betas nicht aufgefallen.

Und die Umlaute sind jetzt da. Sogar im Submit-Button. :)

Thomas

Abgegeben am 8/27/2003 um 42:47 PM

pid:

consider using a definition list, if you want to put a title and link/definition.

Abgegeben am 9/5/2003 2 um 55:25 PM

Niket:

Neither are wrong from pure (X)HTML standpoint. But since "semantics" is the buzzword around, lets analyze:
What are links? In a way they are "bookmarks" to your site. Its just like "table of contents" for a book (but much more than that). If thats the case, how can using <h#> be correct?

<div id="navigation">
<h2>Navigation</h2>
...

In this case, Navigation header is OK, because it denotes a section "Navigation". However, Week 1, Week 2 and so forth are not subsections but merely items in the navigation. So, from a semantic point of view, nested lists is a better choice.

Alternatively, often you have more than one tables at the begining of a book. For example, table of contents, list of figures, list of tables etc. So each of these in a navigation bar can form navigation "subsections".

In a nutshell, my point is (though its not so clear from foregoing discussion)
- Both nested lists and headers are equally "appropriate"
- One should select one over the other depending on situation. If the nested loops visually look nested, then that is the appropriate choice.
- In general, semantic propriety is directly related to visual display. So even from semantic point of view, content and style are STRONGLY RELATED. "Separation of style from content" is an inappropriate jargon if one is already pursuing standards-compliant design.

(Note: Merely validating XHTML and CSS does not imply standard compliance)

Abgegeben am 9/6/2003 5 um 11:06 AM

Minz Meyer:

..as we can see, there are different approaches to this problems, all more or less correct.
Maybe one day this will be solved using the navigation list as proposed in the XHTML 2.0 Working draft:

<nl>
<label>Week 1</label>
<li href="/">Project</li>
<li href="/">Review</li>
</nl>

Abgegeben am 9/8/2003 1 um 40:01 AM