Neuerungen in WoltLab Suite 5.5: Überarbeitung des Benutzermenüs und mobilen Seitenkopfes

Ein „What You See Is What You Get“-Editor (kurz: „WYSIWYG-Editor“) hat das Ziel, eine möglichst detailgetreue Repräsentation des fertigen Textes bereits beim Verfassen bzw. Bearbeiten zu ermöglichen. Die visuelle Umsetzung von Textformatierungen, Listen oder Tabellen ermöglicht einen komfortablen Umgang ohne sich mit der technischen Funktionsweise herumschlagen zu müssen. Das Konzept ist von Mail-Programmen oder Textverarbeitungen bereits bekannt und leistet dort bereits seit Jahrzehnten wertvolle Dienste.
Der bisher verwendete Editor „Redactor II“ wird seit einiger Zeit nicht mehr weiterentwickelt und besitzt einige Schwächen, die sich im Rahmen unserer Möglichkeiten nur unzureichend beseitigen lassen. Ein großer Kritikpunkt liegt in der technischen Implementierung, die für die Umsetzung von Funktionen direkt auf der Browser-eigenen „contenteditable“-Schnittstelle aufbaut, die jedoch allgemein als sehr unzuverlässig und fehlerhaft gilt. Nutzer früherer Versionen kamen bereits mit CKEditor 4 in Kontakt, der ähnliche Probleme wie „Redactor II“ aufwies.
Die aktuelle Version 5 von CKEditor stellt eine vollständige konzeptuelle und technische Neuentwicklung dar. Mit CKEditor 5 wurde ein WYSIWYG-Editor geschaffen, der plattformunabhängig eine stabile und zuverlässige Erstellung und Bearbeitung von (umfangreichen) Texten erlaubt. Die Nutzung der unzuverlässigen „contenteditable“-Schnittstelle wird hierbei nur für das Nötigste verwendet: Die Entgegennahme von Texteingaben sowie die Darstellung des Endergebnisses. Dieser fast schon revolutionäre Ansatz gipfelt mit CKEditor 5 in einem äußerst zuverlässigen Editor, der zudem eine Vielzahl sinnvoller und hilfreicher Funktionen aufweist.
Ein neuer Editor bedeutet für uns nicht nur sehr viel Arbeit bei der Integration, sondern gibt uns auch die Möglichkeit, bestehende Praktiken auf den Prüfstand zu stellen und neu zu überdenken. Manche Entscheidungen wurden in der Vergangenheit aus reiner Gewohnheit oder als technischer Kompromiss getroffen, obwohl diese nicht immer ideal waren. Mit dem Wechsel auf CKEditor 5 haben wir einige Verbesserungen vorgenommen, die für manche Nutzer ungewohnt sein können und deren Beweggründe wir an dieser Stelle erläutern möchten.
Wichtige Aspekte in einem Text werden oftmals mit in Fettdruck oder mit kursiver Schrift ausgezeichnet, um diese gesondert hervorzuheben. Darüber hinaus gibt es Situationen, in denen die Relevanz oder Dringlichkeit eines bestimmten Aspekts stärker hervorgehoben werden soll. Üblicherweise wird hierbei auf Textfarben zurückgegriffen, die aber je nach Farbschema des Stils nur bedingt geeignet sind und bei der Nutzung mehrerer Stile teilweise auf Grund eines mangelnden Kontrasts unleserlich werden.
Die Textmarker stehen in vier verschiedenen Farben zur Verfügung und basieren auf dem Farbschema der Hinweise. Dies ermöglicht eine angepasste Darstellung abhängig vom verwendeten Stils, beispielsweise helle Farben in einem hellen Stil und umgekehrt abgedunkelte Farben bei der Verwendung eines dunklen Farbschemas. Textmarker werden semantisch über das HTML-Element <mark> abgebildet und verbessern damit sowohl die Barrierefreiheit als auch die Erkennung wichtiger Inhalte durch Suchmaschinen.
Das Verhalten der Eingabetaste ist vielerorts uneinheitlich: Manchmal erzeugt diese einen einfachen Zeilenumbruch und manchmal entsteht beim Tastendruck ein neuer Absatz. Bei der Verwendung des bisherigen Editors wird bei der Betätigung der Eingabetaste ein neuer Absatz erzeugt, dieser jedoch optisch als reiner Zeilenumbruch dargestellt. Diese Entscheidung ist zu Teilen auch aus technischen Beweggründen in Kombination mit dem alten Editor entstanden, sorgt aber für nachhaltig Probleme bei der Barrierefreiheit und der Interaktion mit anderen Seiten und Programmen beim Kopieren beziehungsweise Einfügen von Texten.
Mit dem Wechsel auf CKEditor 5 beenden wir diese Zweckentfremdung von Absätzen und verbessern die Semantik der erstellten Texte nachhaltig. Absätze werden zukünftig als tatsächliche Absätze dargestellt und verhalten sich so, wie Nutzer es beispielsweise von Textverarbeitungsprogrammen gewohnt sind. Über Shift + Eingabetaste lassen sich auch weiterhin explizite Zeilenumbrüche erzeugen, beispielsweise für die Darstellung von Anschriften. Die korrekte Verwendung von Absätzen verbessert die Interaktion mit anderen Websites und Programmen enorm, Texte werden beim Kopieren und Einfügen üblicherweise korrekt übernommen und erfordern keine Korrekturen der Zeilenumbrüche bzw. Absätze mehr.
Bestehende Texte werden dynamisch korrigiert, damit keine unerwarteten Leerräume zwischen Absätzen entstehen. Diese Kompatibilitätsschicht ermöglicht es, bestehende Texte und Programmlogiken unverändert anwenden zu können und dennoch ein korrektes Endergebnis zu produzieren.
Im Editor ist es teilweise möglich, die verwendete Schriftart von Texten anzupassen und auch Änderungen der Schriftfarbe oder Schriftgröße sind möglich. Der Nutzen dieser Funktionen ist auf einige wenige Randfälle beschränkt, bieten aber umgekehrt ein enormes Potential für einen ungewollten Fehlgebrauch. Das Spektrum der Fehlnutzungen ist sehr vielfältig und reicht von kaum wahrnehmbaren Abweichungen bis hin zu tatsächlichen Problemen beim Lesen von Texten, nicht zuletzt auch Probleme bei der Verarbeitung durch Suchmaschinen.
Mit WoltLab Suite 6.0 werden drei neue Optionen eingefügt, die Einfluss auf die Verwendung von Schriftart, -farbe und -größe nehmen. Mittels dieser Optionen kann selektiv die Verwendung dieser Textformatierungen bei der Erstellung von Texten verhindert werden. Zusätzlich werden diese Formatierungen bei der Darstellung der Texte entfernt, damit bereits bestehende Vorkommnisse keine Auswirkungen mehr haben.
Diese drei neuen Optionen führen zu keinen Veränderungen bestehender Texte, so werden beispielsweise unterdrückte Textformatierungen bei der Deaktivierung der jeweiligen Option direkt wieder sichtbar. Im Folgenden möchten wir auf die gravierenden Probleme dieser Art von Textformatierungen eingehen und es Betreibern ermöglichen, die Konsequenzen beim Nicht-Einsatz dieser Optionen nachzuvollziehen.
Eine typische Quelle für geänderte Schriftarten, -farben oder -größen ist das Einfügen von Texten aus anderen Quellen. Die Übernahme von Elementen wie beispielsweise Listen oder dem Fettdruck von Textteilen ist sehr vorteilhaft, aber nicht selten werden dabei auch unerwünschte Änderungen mit übernommen. Typisch ist hierbei beispielsweise eine schwarze Schriftfarbe (der Standardstil verwendet einen sehr dunklen Grauton) und eine ähnlich aussehende Schriftart, die dem Verfasser des Textes nicht einmal auffällt.
Ansprüche und Vorlieben für das Aussehen einer Website können sich über die Zeit ändern, beispielsweise die Verwendung einer anderen Schriftart oder die Anpassung der verwendeten Farbtöne. Die in Texten fest hinterlegte Schriftart und -farbe passt sich an diese Änderungen jedoch nicht an, mit dem Resultat das einige Text ganz oder teilweise aus dem einheitlichen Erscheinungsbild ausscheren.
Eine leicht andere Schriftart ist oftmals zwar unschön, aber nicht unbedingt problematisch. Viel gravierender sind feste Farbwerte, beispielsweise bei der Verwendung eines deutlich anderen Farbschemas, etwa einem dunklen Farbmodus statt einer bisherigen hellen Farbpalette. Texte werden in dieser Konstellation schlecht bis gar nicht mehr lesbar und im Falle von fast deckungsgleichen Schrift- und Hintergrundfarben kann dies sogar als Manipulationsversuch durch Suchmaschinen gewertet werden.
Auch ohne stark abweichende Farbschemas können individuell vergebene Schriftfarben ein Problem darstellen. Manche Nutzer nutzen sehr blasse Farbtöne dazu, Texte vorsätzlich nur sehr schwach darzustellen, verursachen dadurch aber so schwache Kontraste, dass Leser mit eingeschränktem Sehvermögen diese gar nicht mehr wahrnehmen können. Die Lesbarkeit eines Textes ergibt sich aber nicht nur durch ausreichend Kontrast sondern auch durch die Vermeidung von Farbkombinationen, die für einige Leser nicht unterscheidbar sind. Ein gerne bemühtes Beispiel ist die mangelnde Unterscheidbarkeit von roten und grünen Farbtönen bei einer Rot-Grün-Sehschwäche, die es in dieser Form auch für andere Farbkombinationen gibt.
Vielfach kaum bemerkt stellen geänderte Schriftgrößen in Texten ein mindestens genauso folgenschweres Problem dar, sind aber oftmals nur schwer als solche zu erkennen. Abseits der unabsichtlichen Nutzung anderer Schriftgrößen durch das Einfügen von Texten aus gibt es eine ganze Reihe an Beweggründen für die Nutzung abweichender Schriftgrößen.
Ein prominentes Beispiel ist das Verfassen von Texten in größerer Schrift auf Grund einer signifikanten eigenen Sehschwäche. Statt die bestehenden Möglichkeiten des Betriebssystems und Browsers zu Verbesserung der Lesbarkeit von Texten zu nutzen, werden die eigenen Texte abweichend von allen anderen in größerer Schrift verfasst. Für den Ersteller ist dies durchaus bequem, sorgt aber für eine uneinheitliche Größe von Texten und löst genauso wenig das Problem, dass die Texte anderer Teilnehmer für den Verfasser „zu klein“ sind.
Andere Verfasser verwenden höhere Schriftgrößen zur Auszeichnung von Überschriften, anstatt hierbei auf die bereits bestehenden Möglichkeiten zum Setzen von Überschriften zurückzugreifen. Auf den ersten Blick sind solche Abweichungen oftmals kaum zu erkennen, aber dies hat signifikante Folgen für die Struktur von Texten. Bei der Verwendung „echter“ Überschriften wird eine Struktur erzeugt, die sowohl von Suchmaschinen als auch einem „Screen-Reader“ verstanden und umgesetzt werden.
Kommentare 12