Sicarius

Zahn Jahre nach dem Meilenstein

Allgemein

Ich geb’ ja normalerweise nicht gerne an. Aber heute mache ich mal eine Ausnahme. Es ist nämlich exakt zehn Jahre her, seit dieses Bild entstanden ist:

Da haben sich zwei gefunden!

Ja, wir haben das erste Jahrzehnt im Bund der Ehe “geschafft”. Ich kann an dieser Stelle nur für mich sprechen, aber ich habe die Entscheidung bislang – selbst in unseren nicht so schönen Momenten – für keine Sekunde bereut. Lysanda ist weiterhin die Frau, mit der ich unbedingt den Rest meines Lebens verbringen möchte. Ein Satz, der sich selbst nach all den Jahren in einer festen Beziehung immer noch extrem surreal anfühlt. In meinen 20ern war zwar ein kleiner Funke Hoffnung da, dass auch ich jemanden finden werde. Aber dass es tatsächlich passiert? Aus meiner damaligen Sicht absolut unvorstellbar.

Zum Glück hatte das Leben was anderes für mich parat. In diesem Sinne: Auf das nächste Jahrzehnt!

Sicarius

Ein bisschen was neu im September

Seitennews

Reden wir heute mal ausschließlich über die Webseite. Ihr wisst ja, dass ich sowas immer gerne für die Nachwelt (=mich) ausführlich festhalten will. Denn dem ein oder anderen ist vielleicht aufgefallen, dass ich noch ein bisschen mehr am Design von Beim Christoph rumgespielt habe. Meine ersten Erfahrungen mit Claude in der Hinsicht haben mich quasi angefixt, weitere Punkte anzugehen, die mir schon ewig auf den Geist gingen:

Mobile Darstellung

Alle Infos auf weniger Platz

Die Tabellen wie z.B. die “Gespielt“-Übersicht, haben auf Smartphones immer das Layout gesprengt. Also sie sind nach rechts übergelaufen. Ich hab’ mir das entsprechend jetzt nochmal angeschaut und im ersten Lösungsversuch einen horizontalen Scrollbalken eingeführt. Das hat an sich technisch auch funktioniert – das Layout wurde nicht mehr gesprengt. In Sachen “Usability”, wie man so schön sagt, war es für unterwegs trotzdem nicht geeignet.

Entsprechend habe ich in den sauren Apfel gebissen und ein eigenes mobiles Design für diese Unterseiten definiert. Über eine @media-Regel wird nun bei einer Darstellungsbreite von unter 700px automatisch gewechselt. Es war dabei Chattys Vorschlag, den Tabelleninhalt als sogenannte “Cards” darzustellen. Sprich: die gleichen Informationen, aber halt kompakter. Dadurch fällt zwar die Sortierfunktion weg, doch die Übersichtlichkeit auf dem Smartphone ist viel besser.

Da die Tabellen auf den Unterseiten selbstverständlich nicht identisch sind (Anzahl Spalten, Spaltentypen, usw.), ist die style.css-Datei durch diese Anpassung allerdings um einiges länger geworden. Oder ums in Zahlen auszudrücken: Vorher hatte sie rund 650 Zeilen, jetzt sind wir bei knapp 1.250. Hätte es eine elegantere Lösung gegeben? Möglicherweise. Aber vermutlich dann nur mit Hilfe von Methoden, die ich nicht unbedingt benutzen möchte oder von einigen Besuchern sowieso standardmäßig blockiert werden (z.B. mehr JavaScript). Insofern eben die “Quick ‘n’ Dirty”-Lösung mit der Konsequenz, dass ich daran denken muss, die Datei anzupassen, wenn ich doch mal die Spaltenaufteilung der Tabellen ändern sollte.

Das Ergebnis sieht aus meiner Sicht definitiv schick aus. Nun müsste ich besagte Unterseiten nur mal wieder auf den aktuellen Stand bringen… Bislang habe ich es nur mal geschafft, das jQuery-Plugin Tablesorter von Version 2.0.5 auf 2.32.0 zu aktualisieren. Das ermöglicht die Sortierfunktion für die Tabellen. Keine Ahnung, was sich durch den Versionssprung geändert hat. Aber schon allein weil in der Zwischenzeit irgendwelche Sicherheitslücken behoben worden sein könnten, ist bei sowas ein Update immer sinnvoll.

MOAR SPACE!

Jetzt haben wir also die Ansicht für kleine Bildschirme verbessert. Die nächste Änderung habe ich hingegen für diejenigen unter uns gemacht, die was Größeres auf dem Schreibtisch stehen haben: Beim Christoph nimmt jetzt mehr Platz ein. 2014 haben wir die Seite für eine Bildschirmauflösung von 1920×1080 entwickelt. Das ist auch immer noch eine sehr verbreitete Auflösung. Und die Inhalte müssen am Ende immer noch anständig lesbar sein. Es hat glaube ich keiner was davon, wenn meine Einträge auf einem 8K-Ultrawide zu einem Strich verkommen. Trotzdem: Auf großen Monitoren war recht viel leerer Platz links und rechts neben dem Inhalt. Entsprechend habe ich das ein wenig angepasst.

Vertraut und doch irgendwie anders?

Konkret bedeutet das: Ab einer Größe von 1.600px wird der Inhaltsbereich jetzt 1.400px breit dargestellt. Das sind 230px mehr als bisher (1.170px) bei immer noch guter Lesbarkeit. Die beiden Kästen “Kategorien” und “Kommentare” sind hingegen unverändert breit (292px). Mir ist freilich bewusst, dass manche “moderne” Seiten tatsächlich mittlerweile hergehen und den Lesebereich sogar auf 700-800px verringern. Aber der Grund dafür erschließt sich für mich ehrlich gesagt nicht. Also außer, dass ich mehr Platz für Werbung an den Seiten habe :tongue: . Dank “Responsive Design” kann ich im Zweifel die Seite eh so hinschieben, wie es für mich am angenehmsten ist. Jetzt gibt es einfach noch eine weitere Konfigurationsebene dafür.

Passend dazu habe ich auch mal Bootstrap aktualisiert. Das ist das Framework, das viel von diesen Responsive-Sachen ermöglicht. Davon war noch die Version 3.0.0 aus 2013 installiert. Allerdings bin ich nicht auf die aktuelle Version 5.3 gewechselt. Bootstrap hat nämlich so einige Sachen grundlegend geändert. Entsprechend müsste ich tiefergreifende Änderungen am Theme machen. Das war mir erstmal zu heikel. Es bleibt aber auf meiner ToDo-Liste und immerhin läuft jetzt Version 3.4.1 im Hintergrund.

Dunkel war’s, der Sicarius schien helle

Ein Vorteil, den allerdings der Wechsel auf Bootstrap 5.3 gebracht hätte, wäre die native Unterstützung eines Dunkelmodus gewesen. Das ist nämlich die nächste Änderung, welche die Schattenliebhaber unter uns (=ich) bereits festgestellt haben. Ist euer System entsprechend eingestellt, blendet euch Beim Christoph nun nicht mehr. Das geht wieder über eine @media-Regel in der style.css.

Es gab natürlich ein paar Knackpunkte, die ich noch im Detail fixen musste. Mein Logo hatte beispielsweise plötzlich einen weißen Rand und war logischerweise in Schwarz nicht mehr wirklich gut erkennbar. Aber durch das Erzwingen von Transparenz und einer Invertierung war das tatsächlich ohne Bildanpassung erledigt. Und die Rundungen bei “Kategorien” und “Kommentare” auf der rechten Seite sind jetzt per CSS definiert. In der normalen Darstellung kommen hier hingegen Bilder zum Einsatz, die so nicht mehr funktionierten.

Bei den bereits erwähnten Tabellen waren hingegen die Überschriften nicht mehr lesbar, weil ich sie falsch definiert hatte und auch der Button zum Abschicken der Kommentare wollte eine Sonderbehandlung. Am meisten Aufwand hat hingegen vermutlich die Simple Lightbox verursacht. Dank dieses Plugins könnt ihr die Bilder anklicken und eine größere Version sehen. Das hat zwar von Haus aus eine dunkle Variante im Angebot – in den Einstellungen ist es aber eine 0 oder 1-Entscheidung, also nicht dynamisch. Sprich, ich erzwinge nun die passende Darstellung, wenn ihr im entsprechenden Modus unterwegs seid.

So viele Zeilen Code für ein bisschen Ergebnis

Aufgrund des dazugehörigen Aufwands (ja, selbst mit Claude-Unterstützung) gibt es jedoch keinen Umschalter. Wenn ihr es doch wieder hell wollt, müsst ihr stattdessen die Einstellung in eurem System/eurem Browser ändern. Sollte ich aber jemals auf Bootstrap 5.3 (oder neuer) wechseln, dann kommt damit vielleicht auch der Umschalter in der Navigationsleiste.

Mit dem Ergebnis bin ich definitiv zufrieden – sonst hätte ich es schließlich nicht so gelassen :wink: . Selbstverständlich hat Beim Christoph im dunklen Modus einen etwas anderen Charme als im hellen und das eine oder andere Detail am Design geht dadurch verloren. Aber im Gegenzug beim Konsum der Seite montags pünktlich um Mitternacht nicht mehr geblendet zu werden, ist diesen Kompromiss definitiv wert.

Unter der Haube

Und das müssten die für euch sichtbaren Änderungen gewesen sein, die ich an der Seite durchgeführt habe. Nicht nur, aber auch mit der Hilfe von Claude. Am Backend habe ich aber ebenso weiter rumgeschraubt. Neben Analysen der Webseitedateien durch Claude, bei denen er veraltete Methoden und sogar Schreibfehler gefunden hat, habe ich mich dafür vor allem auf die Seite PageSpeed Insights gestützt. Die analysiert neben der Geschwindigkeit der Seite auch die Barrierefreiheit, ob moderne Methoden eingesetzt werden und grundlegende SEO-Sachen. Und das sowohl für die Desktop- als auch die mobile Ansicht. Sehr coole Sache.

Beim Christoph war grundsätzlich schon in einem ganz guten Zustand, als ich angefangen habe. Hauptpunkte waren die Barrierefreiheit (81 Punkte) und die Performance in der mobilen Ansicht (ebenfalls irgendwo in den 80ern). Daraus ist beispielsweise die Umstellung der Bilder auf das WebP-Format entstanden. Aber auch die Reihenfolge, in der die Seite geladen wird, und wann der Browser tatsächlich Sachen neu laden muss statt sie aus dem Cache zu nehmen, habe ich nun optimiert. Und siehe da: Jetzt sind die Werte in den einzelnen Bereichen alle zwischen 96 und 100 von 100 Punkten. Bitte? Ob man davon tatsächlich bei der Nutzung der Seite in irgendeiner Weise merkt? Keine Ahnung. Schaden wird es nicht und wenn das Tool glücklich ist, dann bin ich auch glücklich. Lobet die Software, den Algorithmus und den geheiligten Chatbot!

Das aktuelle Desktop-Ergebnis von PageSpeed Insights

P.S.: Bei der ganzen Aktion habe ich festgestellt, dass sich Vivaldi auf dem Smartphone sehr stark an den Cache klammert. Ich konnte meine ganzen Änderungen nur in einem privaten Tab überprüfen und musste dann schlussendlich mal den kompletten Browsercache leeren. Anders hätte ich die neue Darstellung nicht bekommen.

Sicarius

Ein Unterhosenwechsel

Hard- und Software

Ich bin definitiv eher der loyale Typ. Im Gegensatz zu manch anderen, die gefühlt ihre Identität wie Unterhosen wechseln, trage ich zum Beispiel meinen Nicknamen schon seit 2004 – technisch gesehen sogar noch länger. “Sicarius” (lat. “Attentäter”) ist jetzt nicht so weit von “The Killer” entfernt. Meinen Avatar, ein Purple Heart, habe ich seit 2005 in Benutzung. Damals ist Battlefield 2 erschienen und hatte erstmals Medaillen mit im Paket. Das Bild ist in der Zwischenzeit nur etwas moderner in der Gestaltung geworden und verstößt hoffentlich nicht mehr gegen das Copyright von EA :wink: . Meine private E-Mail-Adresse hat sogar damals noch unser Don Quichotte angelegt, als wir 1996 ISDN im Elternhaus bekommen haben.

2003 lässt grüßen: Wir sind alt!

Und auf den Internetbrowser Maxthon bin ich schon gewechselt da hieß er noch MyIE2 und basierte auf Trident (Internet Explorer). Die Namensänderung war 2004 (!). Selbst als 2016 der Skandal rund um den Versand von sensiblen Daten nach China – da kommt der Browser her – durch die Medien ging, habe ich dem Produkt nicht den Rücken gekehrt. So bescheu… äh loyal bin ich!

Zu myIE2 hat es mich hingezogen, weil es schon damals viele Features bot, die wir mittlerweile als selbstverständlich ansehen: Tabs, Mausgesten, Drag & Drop, Skins und nachdem Firefox auf den Markt kam, konnte man sogar auf Knopfdruck den Core wechseln (also zwischen Trident und Gecko). Zur Einordnung: Die erste stabile Version von Mozilla Firefox kam erst Ende 2004 auf den Markt! Google Chrome sogar erst 2008. Insofern war MyIE2 aus meiner Sicht nicht nur seiner Zeit weit voraus – ich hatte bislang nie einen Grund zu wechseln.

Schluss, aus!

Doch auch ich habe meine Limits. Und bei Maxthon war dieses vor einigen Monaten erreicht. Zum einen setzen die Entwickler mittlerweile massiv auf KI. Beispielsweise wurde der englische Community Manager im Forum durch einen Bot ersetzt. Wie gut das Forum jetzt noch funktioniert, könnt ihr euch denken. Außerdem pushen sie schon seit vielen Versionen nicht nur bei der Installation ein entsprechendes Produkt – auch in der Anwendung selbst zieht der Kram zusammen mit Krypto immer mehr ein.

Zum anderen basiert Maxthon schon seit 2020 nur noch auf Chromium. Das ist an sich kein Problem und hatte seine Vorteile. Aber die Updatezyklen sind mittlerweile, ums auf Deutsch auszudrücken, unter aller Sau. Die aktuelle Version von Maxthon, 7.5.2.5801, nutzt Chromium 140. Das aktuelle Release ist 152 (!) und 153 steht frisch in den Startöchern. Schon der Wechsel auf Chromium 140 Anfang des Jahres hat mehr als ein Quartal gedauert. Eine richtige Begründung, warum die Entwickler sich mit der Aktualisierung so schwer tun, gab es dazu imForum auch nie.

In der Praxis bedeutet das nicht nur, dass Maxthon auf einem massiv veralteten Chromium-Unterbau sitzt und damit auch bei Sicherheitsupdates hinterherhinkt. Auch viele Seiten stellen bei mir mittlerweile ihre Funktion ganz oder teilweise deswegen ein. Sprich ich musste über die letzten Monate sowieso schon auf Mozilla Firefox oder Microsoft Edge ausweichen, um die eine oder andere Sache zu erledigen. Beispielsweise Lysandas Videos auf ihren TikTok-Kanal hochladen. Da mir das massiv gegen den Strich ging, habe ich nun nach fast 25 Jahren die Konsequenzen gezogen und Maxthon sowohl von meinem Rechner als auch meinem iPhone verbannt.

Gruß aus Norwegen

Jetzt ist es mit Browsern ja wie mit Linux-Distributionen: Es gibt so viele wie Sand am Meer und wenn man 10 Leute fragt, bekommt man 100 Antworten. Es dürfte entsprechend wenig verwundern, dass ich das gemacht habe, was heutzutage viele machen: Ich habe mit Google Gemini einen Chatbot befragt. Am Ende der Diskussion bin ich dann bei Vivaldi gelandet.

Ich hatte vorher noch nie von diesem Browser gehört. Dabei ist er auch schon elf Jahre alt und stammt von Jon Stephenson von Tetzchner. Das ist einer der Mitbegründer der norwegischen Firma Opera Software. Also eigentlich kein Unbekannter. Der war damals aber unglücklich damit, wohin sich der Opera-Browser entwickelte. Vor allem mit dem verringerten Funktionsumfang war er äußerst unzufrieden. Entsprechend hat er sich gesagt: “Mach‘ ich halt was Eigenes!”.

Und ums direkt zu sagen: Hat er gut gemacht, der Mann! Ich bin nach der ersten Eingewöhnungsphase wirklich zufrieden mit dem Browser.

Die Software

Alles Wichtige auf einen Blick!

Bei der Suche nach meinem Ersatzdesktopbrowser hatte ich fünf Anforderungen, an denen nicht zu rütteln war:

  • Mausgesten
  • Parallele Tab-Anzeige
  • Zügige Core-Aktualisierungen
  • Unterstützung von Chrome-Erweiterungen
  • Eine Version für Handys mit Desktopmodus

Und ja, alle diese Anforderungen erfüllt Vivaldi und bietet sogar noch viel mehr. Aber um es gleich vorweg zu nehmen: Nein, er ist nicht perfekt. Die Vorteile übertreffen aber ganz klar die kleinen Unstimmigkeiten, die ich bislang bemerkt habe. In Bezug auf die Mausgesten beispielsweise ist es für mich durchaus eine Umgewöhnung, diese nicht zu sehen. Maxthon hat, ähnlich wie im Videospiel Arx Fatalis, nämlich eure Geste beim Zeichnen angezeigt. Das macht Vivaldi nicht. Wenn ich im Eifer des Gefechts also irgendwo einen falschen Haken mache, dann sehe ich das nicht frühzeitig. Und beim Rausholen von Tabs in eine neue Instanz ist das System irgendwie hilfreicher, als es wirklich nützlich ist. Schon das ein oder andere Mal deswegen aus versehen eine Webseite in ein Word-Dokument eingefügt. Das ist mit Maxthon nie passiert. Auf dem iPhone hingegen habe ich bislang noch keine Einstellung gefunden, um alle Webseiten in den dunklen Modus zu zwingen, selbst wenn sie offiziell keinen haben.

Auf der Habenseite stehen dafür Sachen wie

  • Zwei Tabs nicht nur nebeneinander anzeigen, sondern auch untereinander
  • Mehr als zwei Tabs gleichzeitig anzeigen lassen
  • Blitzschnelle Core-Updates
  • Eigenes, unabhängiges Erweiterungsökosystem, aber mit voller Chrome-Kompatibilität
  • Umfangreiche Konfigurationsmöglichkeiten (Maxthon war hier stark beschränkt)
  • Kommt aus Norwegen und nicht aus China oder den USA
  • Keine integrierte Werbung, keine “optionalen” Programme bei der Installation, kein KI-Krempel – einfach nur ein kostenloser Browser.

Oder um es nochmal deutlich auszudrücken: Ich habe bislang den Wechsel weder am Desktop noch auf dem Smartphone bereut. Mal schauen, wie es in 25 Jahren aussieht :wink: .

Nächste Seite »