Probleme bei Firefox 149

Zitat von Mira_Belle

Danke.

Gerne wie immer

Poste mal "Dein" CSS., oder ist es der aus #37 ?

Dann spiele mal mit den Werten

		/* Symbole für alle inaktiven Einträge */
		#viewSidebarMenu >  menuitem[type="checkbox"]::before {		

			width: 22px !important;
			height: 22px !important;
			margin-left: -6px !important;
			margin-right: -11px !important;


			background-position:  3px 3px !important;
		}

Am besten Du deaktivierst den Betreffenden Tein direkt in Deiner CSS
und kopiert ihn ich die Browser-Werkzeuge,
da kannst Du ja direkt sehen was passiert.

Hat mir Grok vor die Füße gerotzt.
Ich kann mit der Antwort nichts anfangen.

Zitat von Horstmann

, aber wo ist der Funktionsaspekt, bzw. der funktionale Unterschied zw. checkbox und radio

Es besteht ein grundlegender Unterschied zwischen ihnen. In einer Checkbox-Gruppe kann ein Benutzer mehrere Optionen auswählen. Jede Checkbox funktioniert einzeln, sodass der Benutzer jede Antwort einzeln aktivieren oder deaktivieren kann. Optionsfelder hingegen funktionieren als Gruppe und bieten sich gegenseitig ausschließende Auswahlmöglichkeiten.
Wobei die Darstellung Menüleiste > Ansicht > Sidebar als Checkboxen dann nicht richtig wäre, die unter Webseiten-Stil als Radiobuttons aber schon...

Im Quellcode: type="checkbox"

Im Quellcode: type="radio"

Zitat von Mitleser

Designregel Nr. 1: Form follows function...

Ohje. „Form follows function” erinnert in gewisser Hinsicht an „Never change a running system” – ein häufig völlig missverstandener Spruch und im fremden Kontext auch nicht unumstritten. Der Satz stammt aus dem 19. Jahrhundert und stand in Zusammenhang mit der Architektur von Gebäuden. Der Satz erhebt nicht den Anspruch, eine Universalregel für Software-Design zu sein. Und definitiv ist das im Software-Design nicht die „Designregel Nr. 1”, die über allem anderen schwebt und ausnahmslos gilt.

Ja, es ergibt grundsätzlich Sinn, im Design zwischen Checkboxen und Radio-Buttons zu unterscheiden. Deswegen gibt es auch die Konvention, Checkboxen viereckig und Radio-Buttons rund darzustellen. Aber man muss selbstverständlich auch im Design immer den Kontext betrachten.

Kontext und Fakt ist: Firefox macht im Menü keine Unterscheidung, weil eine solche Unterscheidung an der Stelle aus Nutzersicht schlicht und ergreifend nicht erforderlich ist. Im Gegenteil könnte das an der Stelle sogar mehr als verwirrend und nicht als hilfreich wahrgenommen werden. Im Kontext der Menüleiste von Firefox ist für den Nutzer nur wichtig, ob eine Option aktiv ist. An keiner Stelle im Firefox-Menü ist es möglich, dass mehr als eine Option innerhalb einer Gruppe gleichzeitig aktiviert ist. Es gibt damit keinen Grund, die Option „Nur Text zoomen” (Checkbox) im Menü anders darzustellen, als die Konfiguration der Lesezeichen-Symbolleiste (Radio-Button). Hier wird also Konsistenz im Design höher gewichtet und das ist keineswegs falsch, sondern in diesem Kontext sinnvoll. Funktionalität ist etwas anderes. Mozilla verwendet das eine oder andere, je nachdem, was das jeweils passendere Element ist. Aber im Design der Menüleiste von Firefox wird ganz bewusst auf einen Unterschied verzichtet.

Und wenn Firefox von Haus aus keine Unterscheidung vornimmt, dann gibt es auch für individuelle Anpassungen keinen Grund, eine Unterscheidung einzuführen. Das hätte keinen Vorteil für den Anwender.

Zitat von Sören Hentzschel

Ohje. „Form follows function” erinnert in gewisser Hinsicht an „Never change a running system” –

Der Ausdruck Form follows function (englisch für: ‚Form folgt Funktion‘, im Deutschen oftmals auch als vollständiger Satz „Die Form folgt der Funktion“ gebraucht) (FFF) ist ein Designleitsatz insbesondere aus dem Produktdesign und der Architektur. Die Gestalt (äußere Form) von Gegenständen soll sich dabei aus ihrer Funktion oder ggf. ihrem Zweck ableiten; im Gegenzug kann man nach Abschluss der Formgebung aus der Form des designten Gegenstands gegebenenfalls auf dessen Funktion bzw. Zweck rückschließen.

[Wikipedia]

Zitat von Sören Hentzschel

Aber im Design der Menüleiste von Firefox wird ganz bewusst auf einen Unterschied verzichtet.

Linux fügt hier die Systemsymbole hinzu:

Aber scheinbar habe ich das lediglich falsch verstanden. Im Sidebar-Untermenü verwirrt mich die Darstellung schon ein wenig.

Zitat von bananovic

Mira_Belle es ist der CSS aus #37. Ich habe lediglich den Wert für margin-right in Zeile 28 auf -19px und in Zeile 44 auf 5px geändert. Auch habe ich die Werte von width und heigth auf 16px geändert. Ferner habe ich nach Zeile 47 padding-left: 8px eingefügt. Das ist alles.

Du musst dann halt ausprobieren und testen.
Eventuell haut bei Dir ja auch noch anderer Code dazwischen.

Zitat von Horstmann

Ah, jetzt macht das Sinn;

Welche Symbole zeigt denn der Mac an diesen Menüpunkten? Nichts/nur Checkboxen? Aber jetzt verstehe ich auch dein "gleichmachendes" css aus Beitrag #35.
Ich betrachte allerdings die Menüleiste als Teil des Browsers und dort wird ja auch zwischen den Check/Radiobuttons unterschieden. Jedenfalls auf Linux:

Menüleiste eingeblendet bei offenem Einstellungstab ist dann doch verwirrend, wenn in der Ml. nur Checkboxen zu sehen sind.
Aber das ist schon kleinlich...So und nun blende ich sie wieder aus..

Zitat von Horstmann

im Submenü mit Immer anzeigen etc. sind alle Einträge Radios.

Das hatte ich mir schon gedacht. Im den Screens 1+2 sind aber Symbole für Checkboxen (content: "\2713"; /* a checkmark */) dargestellt.

Naja, in Linux eben nicht da sind Radios Radios und Checkboxen Checkboxen, so wie es im Quellcode steht. Deshalb die Verwirrung.

Aber warum ist deine Darstellung (Screen 3+4) der Radiob. so angelehnt an die Checkb.? Radiob. auch im Zusammenhang mit Websitecontent/about:preferences könnten dort sinnvoller sein. So aber jetzt stelle ich die Menüleiste endgültig auf display:none;!

Zitat von Mitleser

Der Ausdruck Form follows function (englisch für: ‚Form folgt Funktion‘, im Deutschen oftmals auch als vollständiger Satz „Die Form folgt der Funktion“ gebraucht) (FFF) ist ein Designleitsatz insbesondere aus dem Produktdesign und der Architektur. Die Gestalt (äußere Form) von Gegenständen soll sich dabei aus ihrer Funktion oder ggf. ihrem Zweck ableiten; im Gegenzug kann man nach Abschluss der Formgebung aus der Form des designten Gegenstands gegebenenfalls auf dessen Funktion bzw. Zweck rückschließen.

Ich weiß wirklich nicht, was das Zitieren aus Wikipedia aussagen soll und vor allem, was das mit meiner Aussage zu tun haben soll, die du zitiert hast. Ich kenne diesen Spruch. Wie ich bereits schrieb, ist das keine pauschale Regel, die im Software-Design immer richtig ist, schon gar nicht die „Regel Nummer 1”. Aus dem Software-Design kommt dieser Satz ja auch gar nicht. Natürlich kann man Sätze aus völlig fremden Bereichen auch in anderen Bereichen anwenden. Und oft funktioniert das auch, oft aber auch nicht. Man muss immer den Kontext betrachten. Und dass dieser Spruch gerne völlig „blind” in Diskussionen geworfen wird, ähnlich wie der andere von mir genannte Spruch, sehe ich häufig genug. Hier war der Spruch für mich unpassend, das sehe ich nach wie vor so.

Zitat von Mitleser

Linux fügt hier die Systemsymbole hinzu:

Ich kann es gerade nicht auf Linux testen, aber weder auf Windows noch macOS ist das so und damit ist das für 94 Prozent der Firefox-Nutzer nicht zutreffend.

Zitat von Mitleser

Im Sidebar-Untermenü verwirrt mich die Darstellung schon ein wenig.

Kein Wunder: Das Problem ist, dass Mozilla an der Stelle de facto eine Mischung aus beidem braucht: Die Eigenschaft, dass nur ein Eintrag ausgewählt werden kann (Radio-Button, Checkboxen erlauben eine Mehrfachauswahl), sowie die Eigenschaft, dass man einen aktiven Eintrag auch wieder deaktivieren kann (Checkbox, das ist mit einem Radio-Button nicht möglich). Es existiert kein standardisiertes Element, welches beide Eigenschaften kombiniert. Also was soll an dieser Stelle verwendet und vor allem dargestellt werden?

Im Übrigen verwendet Mozilla in der Menüleiste tatsächlich weder das eine noch das andere. Das sind alles gleichwertige menuitem-Elemente. Mozilla simuliert lediglich bestimmte Eigenschaften von Checkboxen und Radio-Buttons auf Grundlage eines Attributs.

Was die optische Darstellung betrifft, kann es eigentlich nur um eine Frage gehen: Was bringt dem Anwender den größten Wert? Oder konkreter auf die Situation bezogen: Was hat der Nutzer davon, wenn an einer Stelle viereckige Elemente und an der anderen Stelle runde Elemente verwendet werden, wenn die Ausgangssituation de facto an ausnahmslos allen Stellen identisch ist? Wie gesagt gibt es in der Menüleiste keine Situation, in der mehr als eine Option pro Gruppe aktiv sein kann. Es ist für den Nutzer also überall das Gleiche. Dass Mozilla eine technische Unterscheidung im Wert des entsprechenden Attributs vornimmt, ist lediglich der gewünschten Verhaltensweise geschuldet, die simuliert werden soll (ob ein Element abwählbar sein soll oder ob immer eine Option aktiv sein muss). Aber das ist ein Implementierungsdetail und für den Anwender an der Stelle nicht relevant.

Zitat von Mitleser

Ich betrachte allerdings die Menüleiste als Teil des Browsers und dort wird ja auch zwischen den Check/Radiobuttons unterschieden. Jedenfalls auf Linux:

Der Screenshot zeigt die Einstellungen. Das ist ein ganz anderer Kontext. Und dort ist die Unterscheidung auch sinnvoll, weil dort zahlreiche Stellen gibt, an denen eine Mehrfachauswahl möglich ist, und andere Stellen, an denen das nicht möglich ist. Der Unterschied muss dem Nutzer daher dort auch irgendwie vermittelt werden.

Die optische Unterscheidung für radio oder check empfinde ich angenehmer, dann weiss ich sofort, dass nur eines oder mehrere zutreffen können. Ubuntu zeigt es mir wie bei Mitleser an, Windows nur einen Haken: Bsp:

Ubuntu
Webseitenstil
o Kein Stil
o Standard-Stil

Windows:
Kein Stil
✓ Standard-Stil

So zieht es sich durch so ziemlich alle Menüs mit einer Auswahl. Allerdings bin ich im Menü nur ganz selten, daher eher untergeordnet und auch nicht mit einem CSS behaftet.

In den Einstellungen hingegen gibt es unter Windows wieder diese Unterscheidbarkeit.

Für mich ist das eher antrainiert, ich gestalte meine UI-Dialoge auch so, zT mit nem Kasten drumrum, wenn es eine Einstellung betrifft, ähnlich wie Firefox.

In den Einstellungen von Firefox gibt es da wie gesagt auch eine Unterscheidung, dort ist es auch notwendig. Aber wenn ich nur auf Menüleisten schaue, ist es im Übrigen überall, wo ich geschaut habe, genau so wie in Firefox: Chrome, Figma, FileZilla, … Keine einzige von mir getestete Anwendung zeigt in der Menüleiste etwas anderes als ein Häkchen ohne Hintergrund oder gar nichts an.

Wie dieser Thread ja schon ziemlich geschreddert ist, würde ich vorschlagen ich mache einen Neuen auf!
Denn ich hätte da noch ein paar Fragen.

Behandlung von Radio-Buttons & Checkboxen