Da ihr ja wohl kaum eine einseitige Homepage erstellen möchtet, hier eine kleine Anleitung wie ihr Verlinkungen auf eurer Seite plaziert. Und so einfach kann es sein:

<a href="http://www.css-roots.de/category/css-workshop/">Home</a>

Ergebnis:
Home

Aber bei Verlinkungen solltet ihr jedem Hyperlink noch ein title-Attribut hinzufügen, um die barierenfreiheit etwas zu fördern und den Suchmaschinen eine bessere Linkbeschreibung zu bieten. Hierzu fügt ihr vor dem Abschluss des > Elementes also <a href=”index.html” title=”title Text”> euer Title Attribut ein.

<a title="Startseite von CSS Roots" href="Index.html">Home</a>

Das Ergebnis sieht dann so aus, einfach mal mit dem Mauszeiger kurz über die Verlinkung gehen und schon wird der Linktext angezeigt.

Home

Im übrigem Rate ich davon ab, diese Verlinkungen als Navigation zu verwenden, seht euch hierzu lieber den Artikel: “Listenelemente” an.

Falls ihr nicht wisst was man unter barierenfreiheit versteht, im Rahmen der Verlinkungen können sich blinde Personen Hyperlinks von einem Programm vorlesen lassen, was es also empfiehlt den jeweiligen Verlinkungen einen entsprechenden Linktext hinzuzufügen der auch verständlich ist. Der Vorteil für Webdesigner liegt darin dass ihr Suchmaschinen zusätzliche Informationen übermitteln könnt.

Häufig bietet es sich bei langen Texten an am anfang des Texte ein Inhaltsverzeichnis zu integrieren, weches die Themengebiete des aktuellen Html-Dokumentes auflistet.  Hierbei ist es möglich bestimmte Textpassagen am besten in einer Div mit einer entsprechenden ID zu versehen, so zum Beispiel bei einem Text über einem Stylesheet die ID stylesheet zu vergeben.

An dieser Stelle ein Tipp für diejenigen die sich noch nicht mit dem Thema Klassen und Id´s beschäftigt haben, nähere Informationen findet ihr hier: ID´s und Klassen

Wenn ihr nun diese Id´s entsprechend innerhalb eures Inhaltsverzeichnisses verlinkt, erhaltet ihr sogenannte Anker- oder Sprungpunkte. Durch einen Klick auf die Verlinkung “springt” ihr zu dem jeweiligen Div.

Was ihr beachten solltet, ist dass ihr die Verlinkung zur Div mit einem # ankündigen müsst.

Ein Beispiel findet ihr hier:

1
2
3

<ul>
<li><a href="#stylesheet">Stylesheet</a></li>
</ul>

Die Elemente ul und li gehören allerdings zu einer Liste, für intressierte gibts hier mehr.