anker setzen?

lauras · 28. Dezember 2007

Ich habe davon gehört dass man auf einer webseite sogenannte anker setzen kann, um auf teilabschnitte per link oÄ verweisen zu können... kann mir jemand sagen wie das geht?

Foster · 29. Dezember 2007

Ein Anker ist ähnlich wie ein Verweis (Link) aufgebaut.
Wie der Name vielleicht vermuten lässt steht der Anker für eine bestimmte Stelle innerhalb einer HTML-Datei und ist mit dieser Stelle verankert.
Ein normaler Link, so wie du ihn kennst, kann dann auf diesen Anker verweisen und den Betrachter der Seite direkt zu dieser verankerten Stelle in deiner Datei bringen.
Anker sind folgendermaßen aufgebaut:

<a name="ANKERNAME">Anker</a>
oder wahlweise auch nur:
<a name="ANKERNAME">

Entsprechend der Link, der zu dem Anker verweist:

<a href="#ANKERNAME">Zum Anker!</a>

Willst du auf einen Anker in einer anderen HTML-Datei verweisen, lautet der Link entsprechend:

<a href="zieldatei.htm#ANKERNAME">Zum Anker!</a>

Zum Ausprobieren kannst du auch mal folgenden Code in eine HTML-Datei einfügen und mit dem Browser aufrufen:

HTML

<html>
<body>
<a name="anfang" />
Der Anker vom Seitenanfang hat keinen Namen




<br />
<br />




<br />
<br />
<a href="#anker">zum anker!</a>
<br />
<br />
<br />




<br /><br />




<br />
<br />
<br />
<br />
<br />
<br />




<br /><br />




<br />
<br />
<br />
<br />
<br />
<br />




<br /><br />




<br />
<br />
<br />
<br />
<br />
<br />




<br /><br />




<br />
<br />
<br />
<br />
<br />
<br />




<br /><br />




<br />
<br />
<br />
<br />
<br />
<br />




<br /><br />




<br />
<br />
<br />
<br />
<br />
<br />




<br /><br />




<br />
<br />
<br />
<br />
<br />
<br />




<br /><br />




<br />
<br />
<br />
<br />
<br />
<br />




<br /><br />




<br />
<br />
<br />
<br />
<br />
<br />




<br /><br />




<br />
<br />
<br />
<br />
<br />
<br />




<br /><br />




<br />
<br />
<br />
<br />
<br />
<br />




<br /><br />




<br />
<br />
<br />
<br />
<br />
<br />




<br /><br />




<br />
<br />
<br />
<br />
<br />
<br />




<br /><br />




<br />
<br />
<br />
<br />
<br />
<br />




<br /><br />




<br />
<br />
<br />
<a name="anker" >bla</a> &nbsp;&nbsp;&nbsp; &lArr; das ist der Name des Ankers
<br />
Schau auch mal, was gerade noch in der Adresszeile im Browser an die URL angehangen wurde.
<br />
<br />
<a href="#anfang">Wieder zum Seitenanfang</a>




<br /><br />




<br />
<br />
<br />




<br />
<br />
<br />




<br /><br />




<br />
<br />
<br />




<br />
<br />
<br />




<br /><br />




<br />
<br />
<br />




<br />
<br />
<br />




<br /><br />




<br />
<br />
<br />




aksdfjaöksdfl.<br />
<br />




<br />
<br />
<br />




<br /><br />




<br />
<br />
<br />




aksdfjaöksdfl.<br />
<br />




<br />
<br />
<br />




<br /><br />




<br />
<br />
<br />




aksdfjaöksdfl.<br />
<br />




<br />
<br />
<br />




<br /><br />




<br />
<br />
<br />




aksdfjaöksdfl.<br />
<br />




<br />
<br />
<br />




<br /><br />




<br />
<br />
<br />




aksdfjaöksdfl.
</body>
</html>

Alles anzeigen

lauras · 30. Dezember 2007

danke fürs erklären...:P

Peter Gedamke · 31. Dezember 2007

eigenartig ist nach wie vor, dass IE und Firefox (aus eigener Erfahrung) ohne diesen Top-Anker

auskommen... also aus jedem Link der auf Top verweist auch ohne dem diesen Befehl ausführt.

Opera kann das wieder mal nicht.

Ich setze ihn eigentlich nicht ein, da dann nie ganz korrekt der Seitenanfang erreicht wird, sondern immer um das Mass dieser einen Zeile niedriger verbleibt.

Axel · 31. Dezember 2007

Sollte bei allen Browsern (auch Opera) problemlos funktionieren - zur Sicherheit der komplette Code (mit abschließenden </a>, was im obigen Beispiel fehlt

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">




<head>




    <title>Sprungmarken mit Anker</title>




    <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
    <link href="style.css" type="text/css" rel="stylesheet" />
</head>
<body>




<p>
<a name="anfangsanker">Der Anker vom Seitenanfang hat keinen Namen</a>
<br />
<a href="#endanker">zum Anker am Ende springen</a>




<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<a name="endanker">End-Anker</a> das ist der Name des Ankers</a>
<br />
Schau auch mal, was gerade noch in der Adresszeile im Browser an die URL angehangen wurde.
<br />
<br />
<a href="#anfangsanker">Wieder zum Seitenanfang</a>
</p>




</body>
</html>

Alles anzeigen

Guten Rutsch (oder mit Anker guten Sprung:) ) ins neue 2008
Axel

Peter Gedamke · 31. Dezember 2007

ist ja schon klar - und vielleicht falsch verstanden...
ich meinte, bei OPERA funkt es nicht wenn dieser Top-Anker <a name="anfang" /> fehlt

dem IE und Firefox ist das Wurscht - er bringt dich immer zum korrekten Seitenanfang

Axel · 31. Dezember 2007

Zitat von "Peter Gedamke"

ist ja schon klar - und vielleicht falsch verstanden...
ich meinte, bei OPERA funkt es nicht wenn dieser Top-Anker <a name="anfang" /> fehlt

Das mag sein - allerdings gibt es die Anker-Geschichten immer nur im Doppelpack (alles andere ist kein sauberes XHTML) und immer an den END-TAG denken, also

<a name="anfang">Anfang</a>

Herzliche Grüße
Axel

anker setzen?

Jetzt mitmachen!

Teilen