Anfangs...vor Jahrzehnten...war ich noch mit dem Netscape Navigator unterwegs. Wer kennt ihn noch? ;-) Darauf folgte dann irgendwann der gar nicht mal so üble Internet Explorer for Mac. Ich staune gerade selbst darüber!
2002 kam Firefox. Ich weiß schon gar nicht mehr, ob ich den effektiv nur ein Jahr verwendete, bis 2003 Apple's Safari das Licht der Welt erblickte, oder ob ich noch bis zur nächsten Safari-Version anno 2007 wartete. Das scheint schon Äonen her zu sein...

Und da wäre noch Google's Chrome, um den man leider nicht drum herum kommt, da sich einige Websites sonst nicht wirklich verwenden lassen. Hier habe ich übrigens einen echt gut geschriebenen Kommentar dazu entdeckt.

Jedenfalls habe ich mich nun 2019 absolut von der Idee verabschiedet, MacOS X 10.6 noch länger verwenden zu können. Alles läuft prima und scheiden tut weh (vor allem von der funktionierenden Hardware, auf der kein neueres System mehr läuft, aber die problemlos ihren Dienst tut), aber sowohl eine der Hauptbeschäftigungen zu Hause (Surfen im Netz) wie auch eine Nebenbeschäftigung in der Firma (Recherchieren im Netz) sind mit den für 10.6 verfügbaren Browsern einfach nicht mehr machbar. Toll, dass sich das flexbox-Modell so schnell durchgesetzt hat und viele Websites zudem irgendwelche JavaScript-Bibliotheken verwenden, die sogar die letzte 32bit-Version von Chrome überfordern.

Genervt von Chrome ("Ab sofort geben wir vor, was im Web Standard ist!") und Safari (irgendwie hässlich und Feature-arm geworden) wären da ja noch viele andere alternative Browser, die allerdings überwiegend auf WebKit (wie Safari) oder Blink (wie Chrome...mehr oder weniger auch wieder WebKit) setzen.

Sorgen wir doch lieber mal dafür, dass Firefox wieder ein bisschen Marktanteil gut macht, denn bei dem guten Feuerfuchs hat sich einiges unter der Haube getan. Ich war erstaunt, welche Anpassungsmöglichkeiten dieser Browser bietet.

Kleiner Tipp bei einem Download: Die ESR-Variante herunterladen, die einen nicht dauernd mit einem vollen Versionsupdate nervt, bei dem dann wieder alles anders aussieht oder irgendwas nicht funktioniert.

Voll flexibles GUI: userChrome.css

"Chrome" lautet die Bezeichnung aller Elemente außerhalb der Website. Also Adress-Leiste, Vor-/Zurück-Buttons etc.
Eigentlich sollte "Firefox" "Chrome" heißen – nicht Googles Browser. Denn bei Firefox ist der/die/das Chrome wirklich was Besonderes und durch den Benutzer vollständig hackbar. Es lassen sich nicht nur Themes installieren, die das Aussehen der Browser-Kontrollen ändern. Ãœber eine css-Datei lässt sich jeder Aspekt dieser nicht ganz so nebensächlichen 5% des Browser-Fensters anpassen. Hier lassen sich sogar Dinge ändern, die mich bei Google Chrome schon immer genervt hatten.

userChrome.css "freischalten"

Ab Firefox in Version 69 muss man sich das noch explizit freischalten, dass die userChrome.css überhaupt interpretiert wird. Will Mozilla es nun anderen langweiligen Browsern gleichtun und so langsam die praktische Individualisierung streichen?
Jedenfalls muss nun unter about:config die Property toolkit.legacyUserProfileCustomizations.stylesheets auf true gesetzt werden.

Wie kommt man an userChrome.css?

Adresse about:support im Firefox öffnen, worauf unter anderem der Speicherort des Benutzer-Ordners gelistet sein sollte. Auf den Button "Im Finder öffnen" klicken.

In diesem recht vollen Verzeichnis muss, sofern noch nicht vorhanden, ein Ordner namens chrome erstellt werden, worin man seine css-Datei namens userChrome.css ablegen kann.

Problem ist nur, wie man die einzelnen Bedienelemente nun ansprechen soll. Aber dazu kommen wir später.

Im Folgenden ist meine userChrome.css-Datei gelistet. Jene führt dazu, dass die Bedienelemente des Browsers (in Verbindung mit dem Theme Brushed Metal) in etwa so aussehen:

Änderungen im Gegensatz zum Standard sind:

• Keine Favicons in Tabs und der Lesezeichen-Leiste, außer es handelt sich um angeheftete/pinned Tabs
• Tabs leicht gerundet und kein hässlicher blauer Balken über dem aktiven Tab
• X-Icon, um Tab zu schließen, auf der für Mac üblichen linken Seite. Nur bei Mouseover eingeblendet
• +-Icon, um neuen Tab zu erstellen nur bei Mouseover über die Tab-Leiste
• Kleines Dropdown-Icon für Lesezeichen-Ordner in der Lesezeichen-Leiste

Das ganze erinnert natürlich stark an das minimalistische Safari-UI ;-)

Updates meiner UserChrome.css

• Firefox 103: Nen paar kleine Anpassungen
• Firefox 91: Der Trick von Version 89 funktioniert leider nicht mehr. Ich muss meine UserChrome.css erst komplett überarbeiten, damit diese wieder funktioniert. Außerdem füge ich noch weiteres CSS von diese GitHub-Seite hinzu, um Änderungen des neuen Proton-Interface rückgängig zu machen
• Firefox 89: Achtung: Das neue Proton-Interface muss erst de-aktiviert werden, damit die UserChrome funktioniert. about:config => browser.proton.enabled auf false setzen
• Firefox 78: Das Dropdown bei Bookmark-Ordnern in der Lesezeichen-Symbolleiste war verschwunden
• Firefox 77: URL-Bar nicht vergrößern, wenn sie Fokus hat (wie nervig!)
• Firefox 69+75: Footer mit allen Suchmaschinen aus der SearchSuggestions-Liste entfernen

Meine userChrome.css

Meine userChrome.css v3.2, die bis einschließlich Firefox 90 funktioniert, kann hier heruntergeladen werden.

Für Firefox ab Version 91 installiere ich erst das Firefox-UI-Fix von black7375 und füge folgenden CSS-Code dann am Ende seiner userChrome.css-Datei hinzu.
Außerdem muss noch der Ordner mit meinen Icons mit zur .css-Datei gelegt werden.

Elemente identifizieren

Snippets für diese userChrome.css findet man zu genüge. Doch stellt sich die große Frage, wie die Leute darauf kommen, dass das Favicon im Tab .tabbrowser-tab .tab-icon-image benannt ist.

Wie man mit dem Webinspektor den Inhalt von Websiten analysieren kann, kann man das über Umwege auch mit dem restlichen Browser-Chrome von Firefox machen.

Dazu im Webentwickler-Menü erst die Werkzeuge einblenden lassen (oberster Menüpunkt)... ...und dann die Webentwickler-Einstellungen öffnen. Die untersten beiden Punkte der erweiterten Einstellungen, "Debugging-Werkzeuge für Browser-Chrome und Add-ons aktivieren" und "Externes Debugging aktivieren" aktivieren.
Dies ist eine einmalige Geschichte.

Um das Debugging zu starten...

...muss man im Webentwickler-Menü die Browser-Werkzeuge öffnen. (Nicht zu verwechseln mit Werkzeuge ein-/ausblenden oder Browser-Inhaltswerkzeuge)

Darauf sollte sich eine zweite Firefox-Instanz öffnen, in welcher man nun mit dem Objekt-Auswahl-Pfeil nicht nur auf Website-Inhalte sondern auch auf Browser-Chrome-Elemente klicken kann.

Hat bei mir allerdings immer zu einer Fehlermeldung Component returned failure code: 0x804b000d geführt.

Hier half nur, den Debugging-Vorgang manuell zu starten:

Firefox beenden und per Kommandozeile mit extra-Option öffnen.
Ich gehe hier davon aus, dass das Programm direkt im Programme-Ordner liegt und nicht umbenannt wurde:

/Applications/Firefox.app/Contents/MacOS/firefox --start-debugger-server 6000

Nun öffnet sich der Browser wieder und das Debugging wird auf Port 6000 gestartet. Es kann natürlich auch ein anderer Port gewählt werden.

Nun im Webentwickler-Menü den Menüpunkt "Verbinden..." wählen. Es sollte sich wieder eine zweite Firefox-Instanz öffnen, in der man die Verbindungsdaten eingeben muss.
Natürlich auf localhost und in diesem Fall Port 6000

Das Debugging des Browser-Chromes sollte nun möglich sein.

Seltsamerweise funktionierte es bei mir nach dieser einen erfolgreichen Verbindung auch über den vorher beschriebenen einfacheren Weg mit den "Browser-Werkzeugen".

Andere UI-"Verbesserungen"

Extra Such-Eingabefeld statt Omnibox

Was ich außerdem an Firefox schätze: Während alle anderen "großen" Browser die Adress- und Such-Felder zu einer "Omibox" verschmolzen haben, kann man bei Firefox selbst entscheiden, ob man ein separates Eingabefeld für Suchbegriffe haben möchte oder nicht.
Das hat mich in Chrome und Safari oft genug genervt, dass die eingegebene IP-Adresse manchmal in Google gesucht wurde, statt dass sie einfach geöffnet wurde...also her damit!

Dummerweise sucht Firefox auch bei aktiviertem separaten Such-Feld in Google, wenn man in das URL-Eingabefeld etwas eingibt, was Firefox nicht für eine URL hält.
Das ist etwas...inkonsequent.
Kann man aber in den versteckten Einstellungen de-aktivieren.

Dafür gibt man in das URL-Eingabefeld die Adresse about:config ein, sucht nach dem Schlüsselwort keyword.enabled und setzt dieses von vermeintlich true auf false

Website-Zoom durch Scrollen deaktivieren

Auch stellte sich schnell als lästig heraus, dass Firefox die angezeigte Website zoomt, wenn man die Apfel-Taste (cmd) gedrückt hält, während man scrollt. Das passierte mir doch sehr häufig, wenn ich einen Link in einem anderen Fenster öffnen möchte, aber gerade noch etwas am scrollen bin, während ich schon die Apfel-Taste drücke.
Lässt sich ebenso über about:config deaktivieren: mousewheel.with_meta.action auf den Wert 0 setzen.

Mögliche Werte neben der Null, also was passieren soll, wenn man die Apfel-Taste festhält und scrollt, wären übrigens: