Karsten Mitka: Position der Navigation

Hallo,

eine Frage zum Seitenaufbau. Wo platziert man am besten die Navigation im HTML Dokument, gleich als erstes im <body>, oder besser ans Ende. Mit CSS (z.B. grid) kann sie ja im Viewport dennoch als erstes angezeigt werden.
Die Frage zielt auf Google und co. ab, ich möchte natürlich nicht, das die Navigation als erstes indexiert wird und in den Suchergebnissen auftaucht.
Auf meta description möchte ich verzichten, da der Inhalt sehr dynamisch ist.

Gruß

Karsten

  1. Hallo,

    Die Frage zielt auf Google und co. ab, ich möchte natürlich nicht, das die Navigation als erstes indexiert wird und in den Suchergebnissen auftaucht.

    Als Navigation an sich in den Suchergebnissen? Kann ich nicht nachvollziehen. Es mag sein, daß das bei manchen Seiten der Fall ist. Und dann wahrscheinlich auch nur, wenn die Seiten unterhalb der Navigation ziemlich inhaltsfrei gewesen sind. Sprich: Wenn die Navigation mehr Inhalt bietet als die darunterliegende Seite selbst.

    Auf meta description möchte ich verzichten, da der Inhalt sehr dynamisch ist.

    Das ist ungefähr so als wäre Dir die Darstellung Deiner Seiten in den Suchergebnissen egal.

    MfG

    1. Hallo pl,

      Als Navigation an sich in den Suchergebnissen? Kann ich nicht nachvollziehen. Es mag sein, daß das bei manchen Seiten der Fall ist.

      Bei bekannten Seiten, also mit großer Nachfrage, zeigen Die Suchmaschinen bei den Treffern bereits die Navigation(bzw. Auszüge daraus) sozusagen als hilfreiches Inhaltsverzeichnis(schnelles Sprungziel).

      Wenn die Navigation mehr Inhalt bietet als die darunterliegende Seite selbst.

      Also eher umgekehrt 😉

      Gruss
      Henry

      1. hi

        Als Navigation an sich in den Suchergebnissen? Kann ich nicht nachvollziehen. Es mag sein, daß das bei manchen Seiten der Fall ist.

        Bei bekannten Seiten, also mit großer Nachfrage, zeigen Die Suchmaschinen bei den Treffern bereits die Navigation(bzw. Auszüge daraus) sozusagen als hilfreiches Inhaltsverzeichnis(schnelles Sprungziel).

        Nach welchen Kriterien diese Seiten von GG für das Suchergebnis excerpiert worden sind, kann ich nicht beurteilen. Beim Erstellen einer SPA für SELFWIKI jedenfalls habe ich kein Kriterium gefunden, was Seiten als Index bzw. Container für Unterseiten auszeichnet. Gerade das ist es ja, was eine griffige Navigation haben sollte. Im urSELFHTML war das besser geregelt.

        MfG

        1. Hej pl,

          Bei bekannten Seiten, also mit großer Nachfrage, zeigen Die Suchmaschinen bei den Treffern bereits die Navigation(bzw. Auszüge daraus) sozusagen als hilfreiches Inhaltsverzeichnis(schnelles Sprungziel).

          Nach welchen Kriterien diese Seiten von GG für das Suchergebnis excerpiert worden sind, kann ich nicht beurteilen.

          Geht mir auch so. Das verrät Google ja auch nicht.

          Hier wird es auch für die Homepage einer normalen Arztpraxis (Dr. Schnicke) angeboten. Keine große Gemeinschaftspraxis, „nur“ ein einzelner Arzt…

          Google-Suche nach Hautarzt Schnicke

          Marc

  2. Hallo Karsten,

    Suchmaschinen arbeiten weitaus komplexer(intelligenter) als du vermutest. Denen ist relativ egal wo was steht. Dennoch ist es sinnvoll eine klare Struktur zu haben. Wobei hier häufig der Begriff Semantik fällt. Hier gibt's noch ein Tutorial für den Aufbau. Ein Punkt darin wäre jetzt nicht unbedingt meine Vorgehensweise (was die Empfehlung zur Naviposition betrifft), weil ich ohne CSS dennoch eine gewohnte Seite anzeigen möchte, aber das ist Ansichtssache.

    Gruss
    Henry

    1. Hej Henry,

      Hier gibt's noch ein Tutorial für den Aufbau. Ein Punkt darin wäre jetzt nicht unbedingt meine Vorgehensweise (was die Empfehlung zur Naviposition betrifft), weil ich ohne CSS dennoch eine gewohnte Seite anzeigen möchte, aber das ist Ansichtssache.

      Nicht wirklich, denn die Bedienbarkeit mit der Tastatur leidet darunter. Für Sehende!

      Zum Glück macht es der Artikel im mitgelieferten Beispiel dann anders (besser), als es in der Empfehlung steht…

      Denn es ist immer gut, sich an Konventionen zu halten.

      Marc

      1. Hallo marctrix,

        Zum Glück macht es der Artikel im mitgelieferten Beispiel dann anders (besser), als es in der Empfehlung steht…

        Vielleicht magst du die Empfehlung anpassen?

        Bis demnächst
        Matthias

        --
        Rosen sind rot.
        1. Hej Matthias,

          Zum Glück macht es der Artikel im mitgelieferten Beispiel dann anders (besser), als es in der Empfehlung steht…

          Vielleicht magst du die Empfehlung anpassen?

          Deinem Angebot entnehme ich, dass mein Vorschlag konsensfähig ist 😉

          Ich habe die Empfehlung gelöscht. Damit ist das Tutorial in sich konsistent. Es wird nur noch beschrieben, was am Ende auch als Beispiel rauskommt.

          Nur für die Akten: die Empfehlung hat zur Neupositionierung auch noch position: absolute; vorgeschlagen, was ich niemals getan hätte, vor flex und grid aber noch diskutabel war. Heute auf keinen Fall mehr machen. Wenn überhaupt, dann position: sticky;

          Marc

  3. Hallo,

    Die Frage zielt auf Google und co. ab, ich möchte natürlich nicht, das die Navigation als erstes indexiert wird und in den Suchergebnissen auftaucht.

    Ich erinnere mich dunkel an diesen Ratschlag, ich glaube, ich hab ihn vor ca. 20 Jahren gelesen. Ob er noch aktuell ist, weiß ich nicht, würde mich aber wundern…

    Auf meta description möchte ich verzichten, da der Inhalt sehr dynamisch ist.

    hier vermag ich keinen kausalen Zusammenhang erkennen…

    Gruß
    Kalk

    1. Auf meta description möchte ich verzichten, da der Inhalt sehr dynamisch ist.

      hier vermag ich keinen kausalen Zusammenhang erkennen…

      Hallo,

      Google zeigt doch in der Trefferliste den Inhalt der description an und diese ist nun mal statisch. Siehe dieses Forum:

      SELFHTML Forum: Foren
      https://forum.selfhtml.org/
      Forum als Ergänzung zum SELFHTML-Wiki und zur Dokumentation SELFHTML.

      Gruß Karsten

      1. Hej Karsten,

        Auf meta description möchte ich verzichten, da der Inhalt sehr dynamisch ist.

        hier vermag ich keinen kausalen Zusammenhang erkennen…

        Google zeigt doch in der Trefferliste den Inhalt der description an

        Meistens, aber nicht zwingend und nicht immer. Für Google ist die meta description nur ein gut gemeinter Vorschlag.

        und diese ist nun mal statisch. Siehe dieses Forum:

        SELFHTML Forum: Foren
        https://forum.selfhtml.org/
        Forum als Ergänzung zum SELFHTML-Wiki und zur Dokumentation SELFHTML.

        Das stimmt so ja auch.

        Marc

      2. Hallo Karten,

        wenn der Inhalt deiner Seite dynamisch ist, dann kann es die description auch sein.

        Viele Grüße
        Robert

        1. Hej Robert,

          wenn der Inhalt deiner Seite dynamisch ist, dann kann es die description auch sein.

          Full ACK

          Kleine Ergänzung: sie muss es aber nicht. Siehe dieses Forum. Die Description macht ja vollkommen Sinn!

          Marc

          1. Hallo @marctrix,

            ich hatte still schweigend vorausgesetzt, dass kann automatisch nicht muss heißt 😉

            Viele Grüße
            Robert

            1. Hej Robert,

              ich hatte still schweigend vorausgesetzt, dass kann automatisch nicht muss heißt 😉

              Heißt es ja auch implizit. Manchmal reicht ein Wink mit dem Zaunpfahl aber nicht. Ich habe zur Sicherheit mal prophylaktisch mit dem ganzen Zaun zugeschlagen…

              Marc

        2. hallo

          wenn der Inhalt deiner Seite dynamisch ist, dann kann es die description auch sein.

          Kommt darauf an. Bei verschiedenen URLs kanns verschiedene description Inhalte geben.

  4. Hi,

    okay, also mit description.
    Aber wo soll die Navigation nun hin? Doch gleich als erstes? Damit man sie mit der Tastatur auch gleich erreicht?

    Gruß

    Karsten

    1. Hej Karsten,

      Aber wo soll die Navigation nun hin? Doch gleich als erstes? Damit man sie mit der Tastatur auch gleich erreicht?

      Das ist eigentlich egal. Die kann sogar nerven (Man muss die ja jedesmal komplett durchtabben. Dafür gibt es aber Lösungsansätze für große Navigationen). Was man für sehende Tastaturnutzer vermeiden sollte ist das Verschieben per CSS. Weill dann tabbt man durch die Seite und kommt einfach cniht in die Navigation. Weil der Tastaturfokus folgt der Reichenfolge im Quelltext nicht der der optischen Darstellung. Da kann man sicher so macnehn Tastaturnutzer mit in die Verzweiflung treiben, wenn er glaubt, nciht an die Navigation zu kommen…

      Marc

  5. @@Karsten Mitka

    eine Frage zum Seitenaufbau. Wo platziert man am besten die Navigation im HTML Dokument, gleich als erstes im <body>, oder besser ans Ende. Mit CSS (z.B. grid) kann sie ja im Viewport dennoch als erstes angezeigt werden.

    Mit dedlfix’ Worten: Kann man machen, sollte man aber nicht.

    Mit meinen Worten: Kann man machen, ist dann aber Kacke.

    Oder Klartext: Kann man nicht machen. (Wenn man bedienbare Seiten erstellen will, wovon ich stillschweigend ausgehe.)

    Wenn die visuelle Reihenfolge von der Reihenfolge der Elemente im DOM abweicht, führt das zu unbedienbaren Seiten.

    Die Frage zielt auf Google und co. ab,

    Die Frage sollte aber auf Menschen abzielen, die deine Seite besuchen.

    LLAP 🖖

    --
    „Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“ —Kurt Weidemann
    1. Hi,

      okay, also nach vorne ins Dokument, so wie sie auf der Seite zu sehen ist.

      Gruß und Dank

      Karsten

      1. Hej Karsten,

        okay, also nach vorne ins Dokument, so wie sie auf der Seite zu sehen ist.

        Sooo!

        (und nicht anders)

        Marc

      2. @@Karsten Mitka

        okay, also nach vorne ins Dokument, so wie sie auf der Seite zu sehen ist.

        Ja. Und einen skip link noch davor. ☞ Beispiel

        LLAP 🖖

        --
        „Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“ —Kurt Weidemann
        1. Hej Gunnar,

          @@Karsten Mitka

          okay, also nach vorne ins Dokument, so wie sie auf der Seite zu sehen ist.

          Ja. Und einen skip link noch davor. ☞ Beispiel

          Ja, Skip-Links sind sinnvoll. Je weiter der Hauptinhalt vom Seitenanfang entfernt ist, desto mehr.

          Die gehören aber nicht direkt vor die Navigation, sondern noch weiter nach oben (wie in deinem Beispiel, @Gunnar Bittersmann ) also ganz an den Anfang der Seite, als erstes in den `body´

          In Gunnars Beispiel sieht man, dass zwischen Skip-Link und Navi noch eine h1 ist. Da könnte sich aber noch deutlich mehr befinden.

          Typische Inhalte sind neben dem Namen der Site (seit wann schreibst du die h1 in den header und nicht in den Hauptinhalt, Gunnar? — SCNR 😉):

          • Slogan
          • Suche
          • Meta-Navigation (Impressum, Hilfe, Sprachwechsel, Inhaltsverzeichnis, Kontrastversion…)

          Nach der Hauptnavigation, aber immer noch vor dem Hauptinhalt findet man dann noch oft allgemeine Texte, Werbung, Breadcrumb, vielleicht sogar eine auf Desktops links angesiedelte Seitenleiste.

          Den ganzen Kram will man überspringen, wenn man direkt zum Hauptinhalt will.

          Nur als Ergänzung und um klar zu machen, dass es nicht darum geht „nur“ die Hauptnavigation zu überspringen, sondern dass man sofort nach dem Öffnen der Seite eine Möglichkeit hat, direkt zu dem Text zu kommen, wegen dem man letzten Endes hier auf dieser Seite ist.

          Marc

          1. hallo

            Nur als Ergänzung und um klar zu machen, dass es nicht darum geht „nur“ die Hauptnavigation zu überspringen, sondern dass man sofort nach dem Öffnen der Seite eine Möglichkeit hat, direkt zu dem Text zu kommen, wegen dem man letzten Endes hier auf dieser Seite ist.

            Skiplinks sind auch eine Navigation, nämlich eine seiteninterne. Und ich bin einverstanden, dass interne Navigation vorrang vor externer Navigation hat.

            1. Hej beatovich,

              Nur als Ergänzung und um klar zu machen, dass es nicht darum geht „nur“ die Hauptnavigation zu überspringen, sondern dass man sofort nach dem Öffnen der Seite eine Möglichkeit hat, direkt zu dem Text zu kommen, wegen dem man letzten Endes hier auf dieser Seite ist.

              Skiplinks sind auch eine Navigation, nämlich eine seiteninterne. Und ich bin einverstanden, dass interne Navigation vorrang vor externer Navigation hat.

              Mit welchen Konsequenzen? Dass das Inhaltsverzeichnis einer Seite wie in der Wikipedia eigentlich vor der site-Navigation (bei einem Lexikon also idR die Suche) stehen müsste?

              Tut sie aber nicht. Fühlt sich aber trotzdem richtig an, wie Wikipedia das macht, oder? 😉

              Marc

              1. hallo

                Hej beatovich,

                Nur als Ergänzung und um klar zu machen, dass es nicht darum geht „nur“ die Hauptnavigation zu überspringen, sondern dass man sofort nach dem Öffnen der Seite eine Möglichkeit hat, direkt zu dem Text zu kommen, wegen dem man letzten Endes hier auf dieser Seite ist.

                Skiplinks sind auch eine Navigation, nämlich eine seiteninterne. Und ich bin einverstanden, dass interne Navigation vorrang vor externer Navigation hat.

                Mit welchen Konsequenzen? Dass das Inhaltsverzeichnis einer Seite wie in der Wikipedia eigentlich vor der site-Navigation (bei einem Lexikon also idR die Suche) stehen müsste?

                Das kommt darauf an… Relevant ist ja die Position von Navigation und Inhaltssektionen, wo Information nur eindimensional vorliegt. hierbei ist zu berücksichtigen, welche Instrumente dem User zum springen und navigieren zur Verfügung stehen.

                Lass mich eine Analogie verwenden. Du fährst mit einem Auto in eine Stadt.

                • Das erste, was du brauchst, ist der Hinweis, dass du angekommen bist.
                • Danach die Info, wo gehts zum Zentrum,
                • Danach Richtungshinweise zur Peripherie,
                • Danach Richtungshinweise zu Autobahnanschlüssen.

                Geht's darum schnell zum Hauptinhalt (also main) zu gelangen, dürfte der 1.Link zutreffen.

                Das ist die logische Ordnung. Aber in einem visuellen Kontext hast du heute Freiheiten, optisch diese Bereiche anders zu präsentieren.