Die neue FIfF-Website
Ich freue mich mit dieser neuen Website, nicht nur fast 42 Jahre Arbeit des FIfF sichtbar und durchsuchbar gemacht zu haben, sondern auch ein Stück nachhaltige und gemeinwohlorientierte Best-Practice-Web-Technologie für das FIfF umgesetzt zu haben. Hier ein kurzer nicht allzu technischer Einblick, welche Entwicklung das Internets aus unserer Sicht sinnvoll ist, welche Wünsche wir an die FIfF-Website hatten und wie der Verein diesen ein ganzes Stück näher gekommen ist.
www.fiff.de jetzt auch mobil-tauglich
www.fiff.de jetzt auch mobil-tauglich
Alternativtext:
Der Willkommensbildschirm der neuen FIfF-Website auf einem modernen Smartphone.
website-smartphone.webp
Beim Wischen auf dem Smartphone und Klicken im Browser bleibt für die meisten unsichtbar, was hinter den Buttons, Kacheln und Nachrichten-Feeds steckt. Tatsächlich kommt hier ein ganzer Dschungel von Technologien zum Einsatz, die ineinander greifen, um dafür zu sorgen, dass nach Klick auf einen Button schon im nächsten Augenblick wieder das Nächste auf dem Display erscheint.
Die Web-Technologien entwickeln sich rasend schnell und schnell sind auch gute Lösungen nach wenigen Jahren wieder überholt und nicht mehr ohne viel spezialisierten Wartungsaufwand nutzbar. Ein Wechsel zu einer neuen Lösung, um Schritt zu halten ist oft gar nicht so einfach. Hat man einmal auf eine passende Lösung gesetzt, ist der Aufwand, alle Inhalte in ein neues System zu migrieren mitunter kaum zu stemmen. Hinzu kommt, dass Lösungen von großen Tech-Konzernen so gestaltet sind, dass Schnittstellen nicht immer so vorhanden sind, wie man sich das wünscht. Das Onboarding wird besonders einfach gehalten, aber eine Migration weg von einem Dienstleister oder Verknüpfung mit anderen wird wenig unterstützt, da ein Interesse an Kundenbindung besteht. Zusätzlich zu dem scheinbar kostenlosen Lockangebot, wird mitunter aber für jedes noch so kleine Feature, das man dann benötigt, um das Angebot sinnvoll weiter zu nutzen, ein neuer kleiner oder größerer Betrag in Rechnung gestellt. Das ist der Festungsgraben, der daran hindert im Dschungel nach neuen Lösungen zu suchen und die User im Framework hält.
Die Alternative
Das Open-Source-Universum darf, kann und will da anders ticken. Hier sind offene Standards zum Austauschen und Umzug von Daten das erklärte Ziel. Vieles läuft nach der uralten Unix-Philosophie von vielen kleinen Tools, die ihre Aufgabe sehr gut und zuverlässig erledigen und technisch ohne irgendwelche Lizenzhürden miteinander verbunden werden können. Das schöne an Free- und Open-Source-Lösungen ist, dass jeder Mensch die Möglichkeit hat in den Code zu schauen, dabei lernen kann, wie etwas funktioniert und dann einzelne Teile austauschen kann, ohne gleich eine komplett neue Lösung für alles finden zu müssen. Wenn ein Feature benötigt wird, kann dieses genutzt werden, ohne dass die tatsächlich technischen Möglichkeiten künstlich dadurch begrenzt sind, wie viel eine Organisation dafür in der Lage ist auszugeben.
Während große Tech-Firmen monolithische Lösungen für ihre Machtmonopole schaffen wollen, die nur in sich funktionieren, kann Open-Source dafür sorgen, dass alle Informationen für alle zur Verfügung stehen und online geteilt werden können. Das Internet in einer Version, wie man es mal im Kopf hatte, als Interconnected Network also Netzwerk von Netzwerken.
Best-Practice für die neue Website
Nachdem die ehemalige* Website des FIfF eines Tages nicht mehr auf unserem Hardware-Setup lief und schon länger der Bedarf einer neuen Lösung deutlich war, sammelte das FIfF Kriterien für eine neue Website zusammen. In der Zwischenzeit wurde die alte Website nahezu unveränderbar statisch quasi als Momentaufnahme gespeichert und als Archiv ins Netz gestellt. Neue Beiträge wurden mit einer einfachen Blog-Software veröffentlicht.
Die neue Website sollte natürlich responsiv sein, also sowohl auf großen Bildschirmen als auch auf mobilen Geräten laufen und dabei selbstverständlich möglichst barrierearm und auch für nichtsehende Menschen per Screenreader zugänglich sein. Sie sollte zum Stöbern, Lesen und Recherchieren einladen und sichtbar machen, was das FIfF aktuell tut und einen Rückblick auf Vergangenes bieten. Die Seite sollte technisch selbstverständlich auch langfristig also nachhaltig angelegt und natürlich möglichst sicher sein. Im Gegensatz zum weltweiten Trend immer mehr Speicher, Übertragungskapazität und Rechenkapazität in Anspruch zu nehmen und dadurch Unmengen an Strom in den Rechenzentren und für die Auslieferung in der Übertragungs-Infrastruktur des Internets bereithalten zu müssen, sollte die Website des FIfF so genügsam sein wie möglich.
Statischer Seitengenerator
Vor allem, um diese letzten Kriterien zu erfüllen, hat sich in den letzten Jahren Static-Site-Generator (SSG) weiterentwickelt. Statt für jede Besucher:in jede Seite neu zu generieren und dabei Strom für die Prozessoren zu verbrauchen, wird die komplette Website ein mal statisch zu fertigen HTML-Dateien generiert und dann nur noch an den Browser ausgeliefert. Das bedeutet nicht nur weniger Stromaufwand – nach Klick auf den Button, kann das Nächste ohne Verzögerung ausgeliefert und angezeigt werden.
Hervorgetan hat sich unter den SSGs das Projekt 11ty von Zach Leatherman. Zach hat keine Lust auf aggressiven Investoren im Hintergrund und setzt sich für Web-Technologien ein, mit denen alles mit allen geteilt werden kann und mit 11ty sogar für das Generieren möglichst wenige Ressourcen in Anspruch genommen werden. Die komplette Website des FIfF mit aktuell 656 Einzelseiten baut sich mit 11ty innerhalb von sportlichen 13,05 Sekunden (Edit: auf meinem Laptop, auf dem FIfF-Server sogar nur 4,65 Sekunden).
Die Wahl auf 11ty (Sprich "Eleventy") fiel auch, da es alle möglichen Standards unterstützt Inhalte zu aggregieren. Quellen von Inhalten wie Texten, Videos und Bilder können nicht nur lokale Dateien sein, sondern von fast beliebigen auch externen Schnittstellen zusammengesammelt werden. Es unterstützt eine ganze Reihe von sinnvollen Formatierungen und drängt sich nirgends mit einer bestimmten Technologie auf. Die Wahl der Oberfläche, also die "Sprache" (bzw. das Framework), in der beschrieben wird, wie alles aussieht und angeordnet wird, ist und bleibt mit 11ty vollkommen frei.
Man kann sich die Software 11ty als sehr fleißige Krake vorstellen, die aus verschiedensten Datenquellen mit verschiedensten Strickmustern, die man ihr gibt, in atemberaubender Geschwindigkeit eine Website zusammenstrickt. Diese fertiggestrickte Website kann dann auf einem schnöden Internet-Server liegen, der nichts weiter können muss, als URLs entgegennehmen und die fertig gestrickten Seiten zurückgibt (z.B. Apache oder nginx). Die Anforderungen an die Rechenkraft des Servers und die installierte Software sind dabei so gering wie möglich. Selbst wenn zugrundeliegende Server-Systeme sich komplett ändern, können wir auf einem einfachen Laptop unsere Seite generieren und sie in Zukunft mit sehr großer Wahrscheinlichkeit auf einem beliebigen Server ablegen und die Website so auf allen Systemen online bringen. Die Einfachheit dieser Architektur macht die Website auch zur sichersten Variante. Im Gegensatz zu einem komplexen Content-Management-System wie WordPress, hat eine statische Website deutlich weniger Angriffsvektoren für z. B. Defacing.
Gestaltung
Für das Design haben wir uns für das recht etablierte Bootstrap (ein Open-Source-CSS-Framework) entschieden, das mit einer Auswahl von anzupassenden Standardelementen, die Inhalte sowohl auf großen als auch auf kleinen Displays darstellen kann.
Gerade am Wochenende erreichte mich noch das Feedback von einer blinden Person, die die Website freundlicherweise mit einem Screenreader auf Usability untersucht hat und gut zurecht kam.
Ich konnte mit meiner Sprachausgabe alle Links ansteuern, mir alles auf der Website vorlesen lassen und auch alle Menüpunkte problemlos erreichen, ansagen lassen und aktivieren. Mir fällt tatsächlich nichts auf bzw. ein, was mir noch fehlen würde, um mich auf der Homepage gut zurechtzufinden.
Sicher gibt es auch für Screenreader noch Verbesserungsmöglichkeiten. Ich freue mich über weiteres Feedback, das ganz einfach über den -Knopf im Menü abgegeben werden kann.
Inhalte zurück bis 1984 - Texte, Publikationen, Veranstaltungen
In vielen Stunden Arbeit der Regionalgruppe Berlin, wurden nun also alte Inhalte aus dem Archiv übertragen. Trotz allerlei Möglichkeiten der Automatisierung, war das eine riesige Fleißarbeit. Die Signalgruppe zur Koordinierung hatte als Kanalbild ein Mammut, das einen roten Luftballon (das Logo von 11ty) im Rüssel hält und damit versucht abzuheben.
Artikel und Pressemitteilungen wurden in Markdown übertragen und mit einem neu erdachten Schlagwortsystem auffindbar gemacht. Für jedes Thema ist eine Seite entstanden, welche die dazu passenden Beiträge, Aktivitäten und verwandte Themen auflistet. Die Startseite begrüßt die Besuchenden mit einem Überblick über alles und lädt ein zum Stöbern und zum Vertiefen in alle möglichen Aspekte des FIfF - von kurzen einführenden Texten zu Long-Reads.
In diesem Zuge habe ich auch alle Ausgaben der FIfF-Kommunikation online gestellt und grob verschlagwortet. Außerdem sind aus dem umfangreichen Archiv der Wayback Machine vom Internet Archive uralte Websites zu vergangenen FIfF-Jahrestagungen eine fast vollständige Übersicht über alle FIfF-Konferenzen entstanden. Hier gibt es noch ein paar wenige inhaltliche Lücken – wir freuen uns Material dazu digital zugeschickt zu bekommen.
Das FIfF zeigt Gesicht
Beteiligte und Autor:innen können nun Personenseiten anlegen, die in Beiträgen, Themenseiten, Aktivitäten und Arbeitskreisen verlinkt werden und die Aktivitäten zusammenfassen. So stellen sich auch der Vorstand und die Regionalgruppen vor. Außerdem hat jedes Thema nun Ansprechpersonen, die z. B. von Journalist:innen gefunden werden können, um gezielt Interviewanfragen stellen zu können.
Neue Features: Suchen, Teilen und als FIfF-App auf dem Smartphone
Im Sinne des freien Datenaustauschs, hat fast jede Seite der neuen Website, Metadaten, die in verschiedenen Kontexten Sichtbar werden. Beim Teilen einer Seite per URL, wird in vielen Apps und sozialen Medien automatisch der Titel, das Titelbild und ein kurzer Beschreibungstext angezeigt, der eigens für die Verwendung außerhalb der Website selbst getextet wird. Auch in Suchergebnissen von Suchmaschinen werden diese kurzen Zusammenfassungen angezeigt. Mit der neuen Sortierung von z. B. Veranstaltungen, Arbeitskreisen und Pressemitteilungen sind nun auch sprechendere URLs möglich geworden, die auch ohne Metainformationen gepostet z.B. auch das Erscheinungsjahr eines Beitrages sichtbar machen.
Auf Laptops und Desktop-Rechnern können per Klick auf bequem URL, Titel und Kurztext kopiert werden, um sie von Hand zu posten. Auf mobilen Geräten kann man hier die geöffnete Seite mit anderen Apps teilen. Im Menü von Smartphone-Browsern gibt es außerdem die Möglichkeit www.fiff.de als App zu installieren und auf dem Home-Screen als Logo zu platzieren.
Da die Seite statisch ist, ist eine Volltextsuche nicht ohne Weiteres möglich. Im Suchfeld kann www.fiff.de aber über verschiedene Suchmaschinen, für die Datenschutz und Nachhaltigkeit Priorität haben, durchsucht werden.
Ich bedanke mich bei allen Helfer:innen für die Zuarbeit, freue mich über Hinweise per -Knopf und wünsche allen Besucher:innen eine inspirierende Lektüre von 42 Jahren FIfF-Aktivitäten.
* Eine Plone-Instanz damals fürs FIfF realisiert von Hendrik Bunke – Ein Dank an meinen Vorgänger dafür an dieser Stelle für Design, Implementierung und Skriptprogrammierung! Ein besonderer Dank geht auch an Dietrich Meyer-Ebrecht für die jahrelange Pflege der Plone-Instanz.
Mitwirkende
Dazu passende Themen
Digitalisierung und Nachhaltigkeit
Die Themen und Aktivitäten des FIfF berücksichtigen den engen Zusammenhang von Digitalisierung und ökologischer Nachhaltigkeit sowie sozialer Gerechtigkeit. Die Themen und Aktivitäten des FIfF berücksichtigen den engen Zusammenhang von Digitalisierung und ökologischer Nachhaltigkeit sowie sozialer Gerechtigkeit.
IT-Sicherheit
IT-Sicherheit benötigt wirksame Gesetze und den Willen, diese umzusetzen, um IT-Systeme zu entwickeln, die resilient sind und bösartigen Angriffen oder selbstverschuldeten Ausfällen standhalten. IT-Sicherheit benötigt wirksame Gesetze und den Willen, diese umzusetzen, um IT-Systeme zu entwickeln, die resilient sind und bösartigen Angriffen oder selbstverschuldeten Ausfällen standhalten.
Dazu passender Arbeitskreis
IT-Infrastruktur
Die IT-Infrastruktur des FIfF setzt maßgeblich auf selbstgehostete Open Source und Free Software (FOSS) wie Nextcloud, Debian, Mailman, Dokuwiki und 11ty. Mithelfer:innen sind gern gesehen. Die IT-Infrastruktur des FIfF setzt maßgeblich auf selbstgehostete Open Source und Free Software (FOSS) wie Nextcloud, Debian, Mailman, Dokuwiki und 11ty. Mithelfer:innen sind gern gesehen.