Überschriften richtig verlinken
Da Besucher Ihrer Webseite gerne auf Überschriften klicken stellt sich die Frage, “wie verlinke ich eigentlich richtig Überschrifte? Was kommt zuerst, das A-Tag oder der H-Tag? Ganz einfach!
Wichtig ist, dass ein A-Tag ein Inline-Element ist und ein H-Tag ist ein Block-Element.
Inline-Elemente dürfen nur in Block-Elemten stehen. Andersrum geht es nicht!
Das bedeutet, Sie sollten ihre überschrift immer so verlinken:
Erst das H dann das A
Dank HTML5 muss das bald nicht mehr beachtet werden!
Guten Abend,
der Meinung bin ich auch. Ich würde beim Verlinken von Überschriften immer das Tag vor dem Tag setzen.
Vom logischen Ansatz her sollte der A-Tag im H-Tag stehen, weil die Überschrift die übergeordnete Funktion erfüllt.
Wenn es nach der logik geht sollte ein htag nie verlinkt sein. für mich ist logisch das ein inline elemt im block element steht. leider achtet kaum jemand auf barrierefreies sauber gecodetes xhtml. da ist egal ob html5 6 oder 7 neuerungen bringt. ich finde jede seite und das eingeschlossen der unterseiten sollte w3c valide sein- ohne ausnahme.
Ein H-Tag sollte tatsächlich nie verlinkt sein, sondern lieber Passagen aus dem Content. Es macht auch nicht unbedingt viel Sinn, wenn eine Überschrift verlinkt ist.
Natürlich sollten Überschriften verlinkt sein. User klicken oft auf Teaser-Überschriften um auf den Beitrag zu kommen. Natürlich kann man ihnen auch eine andere Klasse geben aber es sind nunmal überschriften und wenn User drauf klicken, dann soll man sie auch verlinken. Das ist Usability.
Frage an Gabriel: und warum dank HTML5 muss das bald nicht mehr beachtet werden?
Schon krass – wusste gar nicht das es da nen Unterschied gibt
Man sollte allein aus dem Grund der klaren inhaltlichen Definition der Webseiten Überschriften immer mit h-Tags kennzeichnen. Suchmaschinen bewerten das positiv.
Ich muß dem Admin da zustimmen. Das Teaser-Beispiel zeigt z.B. eine richtige Anwendung. Anders ist es bei einem Ausgegeben Artikel, also der, der nach dem Klick auf die Überschrift kommt – dort hat ein Link auf der Überschrift nichts mehr zu suchen.
Es wäre ein Fehler keinen Link in den Überschriften zu benutzen, klar SEO technisch, aber vor allen Dingen leidet das schnelle Surfen, die Usability.
Im Endeffekt entscheidet der Doctype wo was zu stehen hat.
Es ist also keine Ansichtssache
Mein vorredner hat vollkommen Recht. Nichts desto weniger trotz, erst Block, dann inline. Alternativ noch zusätzlich das inlineobjekt mittels Stylesheet als Block deklarieren, damit die usability Optimiert wird.
Würde auch gerne mal wissen, was HTML5 daran verändert? Revolution?
Wenn die Überschrift als Anker benutzt wird, kann die Frage auch gestellt werden. – aber -
Schicke ich meine Seiten durch einen Validator, dann erledigen sich die Fragen schon von selbst.
nicht zu vergessen bei der Thematik der Spagat zwischen Validierung und dem guten Ton und dem absoluten “dem Kunden-wunsch”
Danke. Solche Beiträge schaden nie. Auch wenn es mehr als simpel ist. Ich habe – zum eigenen Erschrecken – selbst vor kurzem darüber nach gedacht.
Bei meiner letzten Änderung auf einer Webseite, die ich noch auf Basis von ASP selber programmiert habe, ist mir genau ein solcher Fehler unterlaufen, da habe ich die Reihenfolge von In und Out nicht beachtet und doch glatt einen Bug produziert. Leider bin ich selber erst gar nicht dahinter gekommen, da der Firefox diesen Fehler ganz einfach ignoriert hat und alles normal gemacht hat. Als der Kunde dann angerufen hat und sagte er kann da nichts anklicken, habe ich die Seite mit dem IE getestet und siehe da, der zeigte wirklich den Link nicht an.
Sofort nach tauschen der beiden Befehle lief es auf beiden Browsern wie gewünscht.
Allen Lesern wünsche ich einen guten Rutsch, Gesundheit und Erfolg im 2010.
Karl-Heinz Weidlinger
Danke für den Tipp, jetzt weiß ich, wie es geht
Klasse – hatte mal ein ähnliches Problemchen. Habe gerätzelt und geknobelt. Danke für den Tip, werde mir die Lektion zu Herzen nehmen
Ich sehe nicht wirklich den Sinn darin, eine Überschrift zu verlinken. Zumindest nicht in sehr vielen Fällen…
In HTML5 ist das Regelwerk dahingehend geändert worden, dass A-Tags auch Blockelemente umschließen dürfen.
http://dev.w3.org/html5/spec/Overview.html#the-a-element
Grüße aus Wien
Jeder gute Webdesign-Editor macht das eh richtig, geht gar nicht andersrum…siehe Dreamweaver.
Ich mach’s verlasse mich zwar nicht auf einen Editor, nichtmal auf meinen Dreamweaver, ist aber von der Logik her klar, dass A in H stehen muss.