nav oder menu

[franzsen]

Habe mir die beiden Elemente angesehen. Gibt es da eigentlich einen Unterschied? Bei beiden verwendet man Listen und das optische Erscheinungsbild ist wie bei Listen. Der einzige Unterschied ist, daß man mischen kann und zusätzliche Attribute zu Verfügung stehen. Der Inhalt ist ebenfalls ein link. Was macht eigentlich den Unterschied aus? Was sind das für Argumente eine Auswahl darin zu treffen?

LG
Franz

[MrMurphy1]

Hallo,

das Element menu kenne ich nicht. Das scheint auch nur vom Firefox unterstützt zu werden.

Im Element nav gibt es auch keine Pflicht Listen zu verwenden.

Gruss

MrMurphy

[franzsen]

Hallo,

das Element menu kenne ich nicht. Das scheint auch nur vom Firefox unterstützt zu werden.

Im Element nav gibt es auch keine Pflicht Listen zu verwenden.

Zu finden unter "http://wiki.selfhtml.org/wiki/HTML/Interaktiv/menu".

Navigation erstellt man ja mit ungeordneten Listen? Zumindest habe ich es bei jedem Menü-Beispiel so gesehen.

LG
Franz

[TS]

Hallo und guten Tag,

das Element menu kenne ich nicht. Das scheint auch nur vom Firefox unterstützt zu werden.

Im Element nav gibt es auch keine Pflicht Listen zu verwenden.

Zu finden unter http://wiki.selfhtml.org/wiki/HTML/Interaktiv/menu.

Und hier http://www.w3schools.com/tags/tag_menu.asp auch mit Beispiel beschrieben.

Ist das nun ein offizielles HTML5-Element, oder nicht?

Grüße
TS

[Matthias S.]

Ist das nun ein offizielles HTML5-Element, oder nicht?

In den Referenzen gibt es Links zu W3C-Spezifikation (HTML5.1 Draft)

Manche Sachen (bes. seltenere HTML-Elemente, SVG, etc) sind den Browser-Herstellern aber nicht so wichtig wie andere neue Features.

Herzliche Grüße

Matthias Scharwies

Grüße
TS

es wachse der Freifunk

https://harz.freifunk.net

[MrMurphy1]

Hallo,

in dem Beitrag kannst du auch sehen, dass das menu-Element zur Zeit nur vom Firefox unterstützt wird. Für die Praxis ist das deshalb (noch) nicht zu gebrauchen.

Navigation erstellt man ja mit ungeordneten Listen?

Nein, das muss nicht sein. Es ist nicht verkehrt, aber auch weder vorgeschrieben noch notwendig.

Das Problem ist eher, das viele Webseitenersteller Listen als Pflicht verkaufen wollen und mit seltsamen "Argumenten" Navigationen ohne Listen-Element als unzulässig verdammen. Auch für die Semantik oder Barrierefreiheit (besser: Zugänglichkeit) sind Listen auch nicht erforderlich.

Durch die Listen wird die Darstellung per CSS häufig ohne zwingenden Grund erschwert.

Also: Wer Listen verwendet = in Ordnung. Wer keine Listen verwendet = in Ordung. Wer Listen in Navigationen vorschreiben will = Falsch.

Gruss

MrMurphy

[Gunnar Bittersmann]

@@MrMurphy1

Durch die Listen wird die Darstellung per CSS häufig ohne zwingenden Grund erschwert.

Wie sollte? Zusätzliche Elemente sollten das Stylen erleichtern.

<nav>
  <a>foo</a>
  <a href="bar">bar</a>
  <a href="baz">baz</a>
</nav>

ist schwerer zu stylen als

<nav>
  <ul>
    <li><a>foo</a></li>
    <li><a href="bar">bar</a></li>
    <li><a href="baz">baz</a></li>
</nav>

Natürlich wird man list-style: none, margin-left: 0 und padding-left: 0 setzen wollen.

LLAP 🖖

[MrMurphy1]

Hallo

Zusätzliche Elemente sollten das Stylen erleichtern.

In der Praxis grade nicht. Anstatt einem müssen drei Elemente gestylt werden ohne dadurch einen Vorteil zu haben.

Gruss

MrMurphy

[Melvin Cowznofski]

Hallo MrMurphy,

Zusätzliche Elemente sollten das Stylen erleichtern. In der Praxis grade nicht. Anstatt einem müssen drei Elemente gestylt werden ohne dadurch einen Vorteil zu haben.

ich denke, da hast Du Gunnar nicht verstanden. Von müssen war nie die Rede! Was Gunnar meinte, und damit hat er natürlich Recht, ist, dass man umso mehr Style-Möglichkeiten hat, je mehr semnatisch richtige html Elemente man verwendet. Das hat auch den Vorteil, die lange Zeit so modernen div-Suppen zu vermeiden, um eine bestimmte Designidee verwirklichen zu können.

Mit lieben Grüßen

Melvin Cowznofski

[MrMurphy1]

Hallo,

Was Gunnar meinte, und damit hat er natürlich Recht, ist, dass man umso mehr Style-Möglichkeiten hat, je mehr semnatisch richtige html Elemente man verwendet.

Er hat an meiner Aussage vorbei geantwortet, deshalb musste ich ihn korrigieren. Danke für die Bestätigung.

Mir geht es nicht um zusätzliche Style-Möglichkeiten, die niemand benötigt. Sondern darum, den Quelltext und die CSS-Angaben möglichst schlank zu halten, um zu dem gleichen Ergebnis zu kommen. Das ist die Philosphie von und die Herangehensweise an aktuelles HTML und CSS.

Mal abgesehen davon, dass es schlechter Stil ist, Elemente nur zum Stylen in den Quelltext einzubringen, müssen unnötige Elemente zwangsweise zusätzlich per CSS angepasst werden.

Du musst dir dazu nur mal Listen-Navigationen in der Praxis anschauen. In über 99% aller Fälle sind die verwendeten Listen schlicht überflüssig und ihr Vorhandensein erschwert bzw. verkompliziert das Styling.

Gruss

MrMurphy

[Felix Riesterer]

Lieber MrMurphy1,

hast Du Dir eine Navi, die nur eine Aneinanderreihung von <a>-Elementen (in einem <nav>) ist, ohne Styles angeschaut? Wenn man einen nicht-CSS-fähigen Browser benutzt, oder wenn man z.B. im FF unter Ansicht->Webseiten-Stil->kein Stil die Seite betrachtet, dann ist das gegenüber der Listenvariante tatsächlich eine Erschwerung. Und spätestens dann, wenn Du eine Hierarchie bei Deinen Links hast, kommst Du wohl oder übel um eine verschachtelte Liste nicht herum, wenn Du wenigestens ein Bisschen Semantik einsetzen willst.

Mir ist nicht bekannt, inwiefern eine Liste für blinde User hilfreicher oder bequemer nutzbar ist, als eine lose Aneinanderreihung von Links.

Liebe Grüße,

Felix Riesterer.

[Gunnar Bittersmann]

@@franzsen

Was macht eigentlich den Unterschied [zwischen nav und menu] aus?

Die Elemente haben grundsätzlich verschiedene Funktionen:

• “The nav element represents a section of a page that links to other pages or to parts within the page: a section with navigation links.” [HTML 5.1]
  Links zu anderen Seiten, wie sie in einem Navigationsmenü zu finden sind.

• “The menu element represents a list of commands.” [HTML 5.1]
  Aktionen, die auf derselben Seite (per JavaScript) ausgeführt werden, bspw. um Daten hinzuzufügen, zu ändern oder zu löschen.

LLAP 🖖