Ich habe gelesen, dass ein <h1> -Tag für ein Logo nicht geeignet ist . Aber wenn Ihr Logo einfacher Text ist, was sollten Sie verwenden? Ich denke, <p> und <span> sind ebenfalls ungeeignet. Hier ist ein Beispiel:
Danke!
In Anbetracht Ihres Markup-Beispiels scheinen Sie nach einem Link im Element nav zu fragen. Wenn dies der Fall ist, sollten Sie kein Überschriftenelement dafür verwenden, da das Überschriftenelement den Abschnitt nav beschriftet (das ist wahrscheinlich nicht das, was Sie vermitteln möchten; wenn Sie eine Überschrift in nav hätten, sollte es wahrscheinlich etwas wie "Navigation").
In diesem Fall benötigen Sie kein spezielles Element, sondern listen Sie die Links in nav auf (idealerweise in ul ):
Wenn Sie jedoch über den Site-Namen sprechen, der (normalerweise) in der siteweiten Banner / Header auf jeder Seite angezeigt wird, macht die Verwendung von h1 Sinn, da es die Site darstellt, in der alle Seitenabschnitte sollten (z. B. die Site-weite Navigation) sein, und es gibt dem Dokumentenumriß ein Label der obersten Ebene (was im übrigen nicht spezifiziert wäre). In diesem Fall darf es nicht Teil der nav sein; Der nächste Abschnitt sollte der body -Sektionswurzel sein.
Semantisch macht es keinen Unterschied, ob der Site-Name / das Logo als Bild oder als Text angezeigt wird. Im Falle eines Bildes liefert das Attribut alt äquivalenten Inhalt als Text.
Also für ein Website-Logo haben Sie vielleicht:
%Vor%Und für einen Site-Namen haben Sie vielleicht:
%Vor% Es gibt keinen "semantischen" Weg (d. h. Syntax), um ein Logo in HTML zu markieren, also gibt es auf einer fundamentalen Ebene keinen richtigen oder falschen Weg. Allerdings würde ich kein <h1> für ein Logo verwenden, da die heading-Tags Ihr HTML strukturieren sollten.
Ich benutze normalerweise ein einfaches <div> oder <a> mit dem Logo als Hintergrundbild, weil ich denke, das ist der beste Weg, es vor Bildschirmlesern zu verstecken. Ehrlich gesagt, sehe ich keinen großen Wert darin, das Logo als <img> in <section> zu setzen, da ein Bereich eine thematische Gruppierung von Inhalten umfassen sollte.
In Ihrem Fall würde ich Ihre <a> als inline-block formatieren und das Logo als Hintergrundbild festlegen.
Ich glaube, dass das Tag hauptsächlich dir überlassen wird.
Ich sehe nicht, warum es nicht h1 sein sollte, da es sich um einfachen Text handelt.
Aber wenn ich deinen Fall analysiere, würde ich das tun.
Option 1. Verwenden Sie h1 und bestimmen Sie es als das Tag, das zum Anzeigen des Logos verwendet werden soll. Nie wieder sollte es in der Dom benutzt werden.
Option 2. Erstellen Sie ein neues Tag für das Logo, z. Diese heißen "Benutzerdefinierte Elemente". Es sollte so etwas gehen:
%Vor%Dann müssten Sie das Logo mit CSS formatieren.
Lesen Sie dieses , um ein wenig mehr über die benutzerdefinierten Elemente zu lernen! :)
Tags und Links html semantic-markup