Links nach w3c-Standard organisieren

Pille456

Hio,
Ich arbeite gerade an einer Internetseite. Nichts besonders, bisschen PHP, aber zum Großteil CSS/HTML.
Nun versuche ich diese Internetseite aber so passend wie möglich auf die W3C Vorschriften anzupassen und meine Seite möglichst zugänglich zu machen.
Darum nun meine Frage, wie kann man am laut w3c-Standard die Links am besten organisieren? Tabellen fallen ja raus. Dann gibts noch div oder span. Momentan tendiere ich ehr zu span-Elementen, da man die auch nebeneinander anordnen kann. (Divs kann man ohne Tabelle, laut meines Wissens ja nicht nebeneinander anordnen oder?)
Oder gibts da noch ne andere Möglichkeit?

Danke.

Der praktische Unterschied zwischen <div> und <span> ist, dass <div> ein blockendes Element (display: block;) ist, und <span> nicht. Es ist also völlig wurscht, welches du benutzt. Nimm das, was in deine Seitenstruktur am besten passt. Erfahrungsgemäß wird das meist <div> sein.

zwutz

weder noch... links sind durch <a></a> bereits wunderbar als Element definiert... den Rest kannst du mit ein wenig CSS selbst so machen, wie du es haben willst

<span> macht im Grunde garnix, kann man also, wenn man es nicht zur formatierung von Inline-Text verwenden will, getrost ad acta legen.
<div> definiert den Inhalt nur als Block. Dieses Verhalten kannst du aber mit "display: block;" selbst definieren, in deinem Fall also auch nicht nötig

Außer natürlich, du willst mehrere Links zu einer Gruppe zusammenfassen, da rate ich dir aber zu <span>, da es dir mehr Möglichkeiten für spätere Änderungen am Design offenlässt und nicht schon eigene Formatierungen mitbringt

Schau dir mal bei SelfHTML das Box-Modell an. Damit kann man wunderbar anordnen und mit CSS hat man sehr gute Möglichkeiten zu Formatieren.
Sieht kompliziert aus, ist es aber nicht wenn man das Prinzip verstanden hat.

OhneName

In den meißten Fällen handelt es sich doch um eine Auflistung von Links, oder? Also ist die unordered list <ul> das richtige Element.

<ul>
    <li>
        <a href="...">...</a>
    </li>
    <li>
        <a href="...">...</a>
    </li>
</ul>

Wenn man die einzelnen Links nun nebeneinander anordnen will, so kann man entweder den <li>s display:inline; geben oder sie mit float:left; ausstatten.

Die relativ semantiklosen Elemente <div> und <span> gruppieren mehrere andere Elemente. Der Unterschied zwischen ihnen ist das <div> ein Blockelement ist (darf Inline- und Blockelemente enthalten) und <span> ein Inlineelement ist (darf nur Inlineelemente enthalten). Sie sind nur die letzte Alternative, wenn kein anderes Element eine passende Bedeutung hat. Sonst entsteht nur eine semantiklose Divsuppe.

Headhunter

Hier auch der offizielle W3C Link über Links: http://www.w3.org/TR/html4/struct/links.html

Interessant könnte noch das LINK-Tag sein, bei dem per rel-Attribut noch weitere semantische Informationen angeben kann. Benutzt das einer?

OhneName

Auszug aus dem Quelltext der SELFHTML-Dokumentation:

<link rel="stylesheet" type="text/css" href="src/selfhtml.css">
<link rel="shortcut icon" type="image/x-icon" href="src/favicon.ico">
<link rel="author" title="Impressum" href="editorial/impressum.htm">
<link rel="contents" title="Inhaltsverzeichnis" href="navigation/inhalt.htm">
<link rel="index" title="Stichwortverzeichnis" href="navigation/stichwort.htm">
<link rel="search" title="Suche" href="navigation/suche/index.htm">
<link rel="help" title="Hilfe" href="editorial/index.htm">
<link rel="copyright" title="Urheberrecht" href="editorial/copyright.htm">
<link rel="alternate" type="application/rss+xml" title="SELFHTML Newsfeed (RSS)" href="http://aktuell.de.selfhtml.org/news.xml">

Dort wird das <link>-Element durchgängig verwendet. Von vielen anderen Seiten, die sich die Mühe machen dieses Element in dieser Art zu verwenden, weiß ich aber nicht. Aus diesen Informationen können manche Browser z.B. seitenspezifische Menüs generieren, die dann Buttons für diese Verweise enthalten. Und afaik verwendet Opera rel="next" und rel="prev" für seine "vorwärts"/"zurück"-Funktion. Sehr nützlich, aber leider nur auf wenigen Seiten vorhanden.

minhen

Headhunter schrieb:

Interessant könnte noch das LINK-Tag sein, bei dem per rel-Attribut noch weitere semantische Informationen angeben kann. Benutzt das einer?

Ich hab es bei meiner Webseite verwendet, würde es bei einer neuen Webseite jedoch nicht mehr verwenden oder berücksichtigen. Es lohnt sich bei der aktuellen und absehbaren Browser-Unterstützung bzw deren praktisch nicht vorhandenen einfach nicht.

OhneName schrieb:

Und afaik verwendet Opera rel="next" und rel="prev" für seine "vorwärts"/"zurück"-Funktion. Sehr nützlich, aber leider nur auf wenigen Seiten vorhanden.

Opera hat eine "nächste Seite"-Funktion und wertet dafür auch rel="next" aus. Opera sucht für diese Funktion aber auch nach Links mit "Vorwärts-Pfeilen" oder "next" oder "nächste" und dergleichen im Text. Daraus wird dann ein Wert berechnet und der Link mit dem höchsten Wert als "nächste Seite" verwendet. Nun ergibt rel="next" für den entsprechenden Link zwar einen sehr hohen Wert, aber es ist für die Funktion nicht notwendig. So kann man mit der entsprechenden Mausgeste auch in diesem Forum z.B. bequem durch die Threads vorwärts blättern - ganz ohne <link>, nur aufgrund der Linktexte eben.
Die Vorwärts/Zurück-Funktionen für die Navigation gemäss History funktionieren bei Opera so wie bei allen anderen Browsern.

darthdespotism

minhen schrieb:

Opera hat eine "nächste Seite"-Funktion und wertet dafür auch rel="next" aus. Opera sucht für diese Funktion aber auch nach Links mit "Vorwärts-Pfeilen" oder "next" oder "nächste" und dergleichen im Text. Daraus wird dann ein Wert berechnet und der Link mit dem höchsten Wert als "nächste Seite" verwendet. Nun ergibt rel="next" für den entsprechenden Link zwar einen sehr hohen Wert, aber es ist für die Funktion nicht notwendig. So kann man mit der entsprechenden Mausgeste auch in diesem Forum z.B. bequem durch die Threads vorwärts blättern - ganz ohne <link>, nur aufgrund der Linktexte eben.

Schade dass die Funktion bei allen SMF Boards nicht funktioniert, sonst wäre sie wirklich nützlich

minhen

darthdespotism schrieb:

Schade dass die Funktion bei allen SMF Boards nicht funktioniert, sonst wäre sie wirklich nützlich

Davon abgesehen, dass ich diese Einschätzung nicht teilen würde, selbst wenn sie zuträfe: wie kommst du darauf? Google schickt mich bei SMF zu Simple Machines Forum, wo "Fast Forward" sehr wohl funktioniert. Zwar nur bei mehreren Seiten innerhalb eines Threads, aber das ist doch auch das Wichtigste. Bei Threadübersichten in Unterforen fehlen dagegen tatsächlich entsprechende Hinweise in den Link-Texten (wie hier in diesem Forum "Weiter"). Dort wäre dann wirklich ein '<link rel="next"..' angebracht.

darthdespotism

Hm vll hab ich da ein Update verpasst aber bei mir wurde ich da immer auf die erste Seite des Nächsten Treads weitergeleitet statt auf die nächste Seite des selben Threads ...

EDIT://
http://forums.codeblocks.org/ + Opera 9.50 gibt noch das gleiche Problem

minhen

Ja, stimmt. Ist mir nicht aufgefallen. Aber was erwartest du? Woher soll Opera denn wissen, dass der "next >>"-Link gar nicht die nächste Seite, sondern den nächsten Thread meint? Hier wäre dann auch klar ein link-Tag mit der "richtigen" nächsten Seite angebracht. Denn, wie gesagt, eine entsprechende link-Angabe ist stärker gewichtet als alles andere.

Wie du da die Schuld bei Opera statt bei dir (weil du die nächste Seite des Threads und nicht den nächsten Thread als "nächstes" erwartest) oder besser bei den Forenentwicklern (weil sie den nächsten Thread und nicht die nächste Seite als "nächstes" annehmen) suchst, ist mir schleierhaft