zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > (X)HTML
Seite neu laden Navigation: Zwei aufeinander folgende NAV oder NAV mit zwei Kindern SECTION?

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 03.03.2021, 07:23
Benutzerbild von AndreasB
Erfahrener Benutzer
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 29.11.2005
Beiträge: 1.375
AndreasB wird schon bald berühmt werden
Standard Navigation: Zwei aufeinander folgende NAV oder NAV mit zwei Kindern SECTION?

Moin.


Folgendes Markup bildet die Navigation.
Es geht um ein Fahrradmagazin. Alle paar Monate erscheint ein neue Ausgabe.
Ich habe zwei Navigationsbereiche: einen generischen, der sich nicht auf eine spezifische Ausgabe bezieht und einen, der sich auf eine Ausgabe bezieht.


Code:
<nav aria-label="Service-Navigation" class="service">
    <ol>
        <li><a href="/">Startseite</a></li>
        <li><a href="/ueber-uns">Über uns</a></li>
        <li><a href="/faq">FAQ</a></li>
        <li><a href="/archiv">Archiv</a></li>
        <li><a href="/datenschutz">Datenschutz</a></li>
    </ol>
</nav
<nav aria-label="Navigation innerhalb der Ausgabe" class="issue">
<div class="navtitle">Ausgabe 30</div>
    <ol>
        <li class="active"><strong>Editorial</strong></li>
        <li><a href="/30/leserbriefe">Leserbriefe</a></li>
        <li><a href="/30/pedelec-versus-muskelkraft-umfassende-kritik">Pedelec versus Muskelkraft&nbsp;– eine umfassende Kritik</a></li>
        <li><a href="/30/stvo-novelle">XX. StVO-Novelle: besserer Schutz für Radfahrer? Eine kritische Analyse</a></li>
        <li><a href="/30/steckdose-unterwegs-8">Steckdose unterwegs&nbsp;– Teil&nbsp;8</a></li>
        <li><a href="/30/pedal-mit-schmiernippel">Vintage-Pedal von Suntour&nbsp;– mit Schmiernippel, wartungsfreundlich und reparierbar</a></li>
        <li><a href="/30/lieblingsrad">Lieblingsrad? Welches?</a></li>
        <li><a href="/30/hohlspeiche">Hohlspeiche</a></li>
        <li><a href="/30/impressum">Impressum</a></li>
    </ol>
</nav>

In einem anderen Thread verwendetet McMurphy stattdessen



Code:
<nav>
  <section>...</section>
  <section>...</section>
</nav>
Ich neige zu der bisher von mir verwendeten Variante, weil die Nav-Blöcke so ihre Eigenständigkeit bewahren. Sie lassen sich dann z.B. bei Bedarf auch völlig getrennt voneinander platzieren ohne am Markup was ändern zu müssen.

Ob meine oder McMurphys Variante in Bezug auf Barrierearmut Vorteile hat, bin ich nicht sicher.

Über Kommentare freue ich mich. Danke.
__________________

Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 03.03.2021, 10:21
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 10.01.2010
Beiträge: 1.099
MrMurphy ist ein sehr geschätzer MenschMrMurphy ist ein sehr geschätzer MenschMrMurphy ist ein sehr geschätzer Mensch
Standard

Zitat:
In einem anderen Thread verwendetet McMurphy stattdessen
Nein, das war dein Wunsch, ich habe mich nach deinen Vorgaben gerichtet:

https://xhtmlforum.de/74199-flexbox-...pper-divs.html

Du hast zunächst die Container vorgegeben und eine Anordnung mit Flexbox ohne Hilfscontainer gewünscht.

Da das mit Flexbox nicht geht habe ich ein Beispiel mit Grid erstellt.

Dann war dein Wunsch weitere Infos zu einer Lösung mit Flexbox zu bekommen, wenn Hilfscontainer akzeptiert werden.

Daraufhin habe ich ein Beispiel mit Flexbox und einem Hilfscontainer erstellt.

Das war also deine Forderung.

Zitat:
Ich neige zu der bisher von mir verwendeten Variante, weil die Nav-Blöcke so ihre Eigenständigkeit bewahren. Sie lassen sich dann z.B. bei Bedarf auch völlig getrennt voneinander platzieren ohne am Markup was ändern zu müssen.
Das sehe ich genau so und habe das das in dem ersten Beispiel deshalb auch so umgesetzt.

Zitat:
Ob meine oder McMurphys Variante in Bezug auf Barrierearmut Vorteile hat, bin ich nicht sicher.
In Hinblick auf Barrierearmut hat die Lösung ohne Hilfscontainer leichte Vorteile. Viel wichtiger in Hinblick auf Barrierearmut ist die korrekte Anwendung von HTML. Das ist nämlich schon von sich aus auf Barrierearmut angelegt.

In den HTML-Regel steht unter anderem:

- Unnötige Container sind zu vermeiden.

- div-Container sollen nur verwendet werden, wenn es keine geeigneteren gibt.

Der Barrierearmut dient auch, dass im aktuellen HTML alle Elemente eine Bedeutung haben. Die korrekte Anwendung von HTML-Elementen ist die Grundlage und der wichtigste Schritt zur Barrierearmut.

Was ansonsten vollmundig und aggressiv behauptet wird bringt wenig oder gar nichts. Auch wenn es sich wichtig anhört.
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 03.03.2021, 10:40
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 30.01.2014
Beiträge: 2.161
cloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblick
Standard

Zitat:
Zitat von MrMurphy Beitrag anzeigen
- div-Container sollen nur verwendet werden, wenn es keine geeigneteren gibt.
Bevor das jemand mit "keine divs verwenden" verwechselt: Divs können gerne und auch genug eingesetzt werden, dafür sind sie ja da. Es ist nur wichtig das in den divs dann Elemente mit semantischer Bedeutung sind.
Mit Zitat antworten
  #4 (permalink)  
Alt 03.03.2021, 10:56
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 10.01.2010
Beiträge: 1.099
MrMurphy ist ein sehr geschätzer MenschMrMurphy ist ein sehr geschätzer MenschMrMurphy ist ein sehr geschätzer Mensch
Standard

Zitat:
Divs können gerne und auch genug eingesetzt werden, dafür sind sie ja da.
Nein. In den HTML-Regeln steht dazu:

Zitat:
Authors are strongly encouraged to view the div element as an element of last resort, for when no other element is suitable. Use of more appropriate elements instead of the div element leads to better accessibility for readers and easier maintainability for authors.
Mit Zitat antworten
  #5 (permalink)  
Alt 03.03.2021, 10:58
Benutzerbild von AndreasB
Erfahrener Benutzer
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 29.11.2005
Beiträge: 1.375
AndreasB wird schon bald berühmt werden
Standard

Zitat:
Zitat von MrMurphy Beitrag anzeigen
- div-Container sollen nur verwendet werden, wenn es keine geeigneteren gibt.

Findest Du denn

Code:
<nav><section></section><section></section></nav>
geeigneter als
Code:
<div><nav></nav><nav></nav></div>
Ich bin da nicht sicher.

Weiterhin wäre noch ein Nesting von nav möglich.
__________________

Mit Zitat antworten
  #6 (permalink)  
Alt 03.03.2021, 11:25
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 30.01.2014
Beiträge: 2.161
cloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblick
Standard

Zitat:
Zitat von MrMurphy Beitrag anzeigen
Nein. In den HTML-Regeln steht dazu:
Und nichts anderes sagte ich ja auch: Verwende div (und auch span) gerne und oft. Für alles, was die Seite "unterteilt" ... Falls es ein geeignetes Element gibt, verwende dieses.

Um es anders zu formulieren:
HTML-Code:
<div> <div> <nav /> <section /> </div> <main /> <aside /> </div>  
wenn es für die Darstellung hilft, gerne div verwenden.

Anders gesagt: Für die Barrierefreiheit einfahc alle divs und span wegdenken, dann muss die Seite auch noch logischen Sinn ergeben.
Mit Zitat antworten
  #7 (permalink)  
Alt 03.03.2021, 12:50
Benutzerbild von inta
free as in freedom
XHTMLforum-Kenner
 
Registriert seit: 04.12.2006
Ort: Berlin
Beiträge: 5.035
inta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz sein
Standard

Ein Beispiel haben wir gleich hier:
HTML-Code:
<div class="navtitle">Ausgabe 30</div>
Das ist nicht sinnvoll ausgezeichnet und sollte meiner Meinung nach eine Überschrift sein.

Ich halte auch ol für die falsche Wahl und würde hier auf jeden Fall zu ul greifen (irgendwie klingelt es da bei mir, hatten wir das Thema schon mal?).

Wenn die einzelnen Navigationsbereiche nichts miteinander zu tun haben, würde ich auch zu zwei nav-Elementen greifen.
Mit Zitat antworten
  #8 (permalink)  
Alt 03.03.2021, 13:19
Benutzerbild von AndreasB
Erfahrener Benutzer
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 29.11.2005
Beiträge: 1.375
AndreasB wird schon bald berühmt werden
Standard

Zitat:
Zitat von inta Beitrag anzeigen
Ein Beispiel haben wir gleich hier:
HTML-Code:
<div class="navtitle">Ausgabe 30</div>
Das ist nicht sinnvoll ausgezeichnet und sollte meiner Meinung nach eine Überschrift sein.
Das macht weder für Screenreader noch für Suchmaschinen Sinn.

Zitat:
Zitat von inta Beitrag anzeigen
Ich halte auch ol für die falsche Wahl und würde hier auf jeden Fall zu ul greifen.
Nein. OL gilt für Screenreader als besser.

Falsch/richtig sind schonmal gar keine passende Kategorien.
__________________

Mit Zitat antworten
  #9 (permalink)  
Alt 03.03.2021, 15:32
Benutzerbild von inta
free as in freedom
XHTMLforum-Kenner
 
Registriert seit: 04.12.2006
Ort: Berlin
Beiträge: 5.035
inta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz sein
Standard

Zitat:
Zitat von AndreasB Beitrag anzeigen
Das macht weder für Screenreader noch für Suchmaschinen Sinn.
Da kann ich dir nicht folgen. Warum sollte es keinen Sinn ergeben eine Überschrift als solche auszuzeichnen? Du überschreibst doch deine Navigationsliste damit. Da sich die ganze folgende Navigation dem Anschein nach auf diese „Ausgabe 30“ bezieht, ist das für mich ein sehr starkes Indiz dafür, dass es eine Überschrift sein müsste.

Zitat:
Zitat von AndreasB Beitrag anzeigen
Nein. OL gilt für Screenreader als besser.
Das höre ich zum ersten Mal. Eine ol hat eine definierte Reihenfolge, das trifft nach meinem Verständnis auf diese Listen nicht zu.

Die beiden Punkte sind für mich sehr viel klarer als die Abgrenzung, ob man ein oder zwei nav-Elemente verwendet, daher habe ich sie angesprochen.
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 03.03.2021, 16:39
Benutzerbild von AndreasB
Erfahrener Benutzer
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 29.11.2005
Beiträge: 1.375
AndreasB wird schon bald berühmt werden
Standard

Markup für "Ausgabe 30":

Kürzlich stieß ein SEO-Spezialist zur Redaktion. Das erste, was er geändert haben wollte, war die Überschriftenstruktur. hn nur noch für den Artikel und dessen Zwischenüberschriften.
Ursprünglich hatte ich nämlich für "Ausgabe 30" eine h2.



Die Überschriftenhierarchien waren seit jeher ein strittiges Thema. Das W3C schweigt sich letztlich dazu aus, wie man damit am besten umgehen soll - außerhalb des Hauptinhaltes (wo es unstrittig ist).

Wenn dazu jemand eine fundierte Betrachtung kennt, inklusive der Berücksichtigung aktueller Screenreader und aktuellem Wissensstand aus dem SEO: lese ich gern


OL oder UL:

Die Artikel haben eine bewußt festgelegte Reihenfolge.

OL ist allein von daher in dieser Liste sinnvoll.

Toll wäre ja:


Code:
<nav>
    <caption>Ausgabe 30
    <li href="...">foo
    <li>bar
    <li href="...">zot
</nav>
Hamwanich. Jibbetnich.
Also abwarten, bis für die Navigation mal bessere Möglichkeiten existieren.
__________________


Geändert von AndreasB (03.03.2021 um 16:49 Uhr)
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Verschiebungen bei größerem Bildschirm seelefant CSS 4 28.07.2014 15:43
Dynamische Größen Killhunter CSS 0 14.05.2011 16:56
Problem mit 3 Navigationsebene im CSS-Menü im Internet Explorer Chellisa CSS 0 15.08.2008 10:28
Multi-Level Navigation mit Grafiken koncrete CSS 3 02.08.2008 02:28
Probleme beim ausrichten Mojo83 CSS 4 25.06.2008 19:54


Alle Zeitangaben in WEZ +2. Es ist jetzt 05:51 Uhr.