Mein Blog-Design und Sehbehinderte

Zwei Zuschriften.

Leider habe ich ad hoc keine so besonders guten Beschreibungen gefunden, wie man Webseiten „barrierefrei“ und behindertenfreundlich macht. Trotzdem habe ich mir Mühe gegeben. Einmal, indem ich ein möglichst einfaches, logisches Design gewählt und (im Gegensatz zum alten Design) nun völlig auf solche Bastellösungen wie absolut oder vom Textfluss losgelöst platzierte Boxen verzichtet habe, sondern alles ausschließlich über das Grid-Design gesteuert habe, das eine sehr einfache, logische, sauber Platzierung ermöglicht und vor allem die Kontrolle dabei beim Browser lässt. Und eben nicht im Sinne von „Die Box muss oben links bei 35 Pixel von oben und 50 Pixel von links platziert werden“. Eigentlich sollte das Design sehr viel robuster und klarer, eindeutiger sein, auch wenn man den Unterschied beim Ansehen nicht so sieht, aber der HTML-Code ist gegenüber dem alten Design sehr viel einfacher geworden. Vor allem habe ich fast gar keine Zahlenangaben mehr zu den Positionen drin (außer Margin und Gap). Ich habe im Grid die Breite der drei bzw. einen Spalte beschrieben. Fertig. Das war’s. Viel einfacher als vorher. Eigentlich eine schöne Sache.

Und ich habe mir natürlich auch Mühe gegeben, nicht einfach nur die früher üblichen div-Container zu verwenden, sondern die semantisch richtigen. Header, Footer, Main, Article, und natürlich die ganzen Rand-Informationen in aside zu packen, und auch (da muss ich allerdings noch nacharbeiten, sobald ich ordentlich Doku dazu gefunden habe) role-Angaben zu machen. Wozu das alles? Weil die Lesegeräte für Blinde damit herausfinden, welche Informationen wichtig sind und zum eigentlichen Inhalt gehören, und welche nur Beiwerk sind, das man beim Vorlesen weglassen kann. Darauf habe ich geachtet, auch wenn ich keine sehr guten Informationen dazu gefunden habe.

Natürlich (*LED-Heiligenschein einschalt*) aus Rücksichtnahme auf Sehbehinderte Leser, aber auch aus Eigennutz. Verbessert nämlich das Google-Ranking.

Erste Zuschrift

Da ist einer sauer.

Sehr geehrter Herr Danisch !

Viele Menschen, besonders Behinderte, surfen mit der Fernbedienung über den Browser auf den neuen FERNSEHERN.

Um das aus dem Bett oder Rollstuhl ordentlich anzuzeigen, geht man auf die Vergrößerung von 300 %.

Für diese Menschen ist Ihr neues Layout ein Albtraum.

Bis zu 2 Drittel der Seite ist mit Werbung verdeckt, sodass man den Text gar nicht gleich findet, bzw. man ist GEZWUNGEN die seitenbreite Werbung am unteren Bildrand, die 1 Drittel der Website einnimmt, wegzuklicken.

Das Surf-Vergnügen liegt bei Ihrer neuen Seite bei UNTER NULL.

Außerdem pickt der einzelne BLOG-Artikel, wenn der Computerr-Browser etwas schmäler eingestellt ist, (sodass die linke Spalte verschwidet), direkt an der linken Browser-Seite, ohne jeglichen Abstand, gräßlich-häßlich.

Wenn Sie es nicht glauben, schicke ich Ihnen gerne alle Screenshots oder TV-Fotos.

Ich benutze dabei nur die neuesten Geräte, nicht etwa altmodisches Zeugs.

Mir ist schon klar, dass Sie die Handy-Surfer im Auge haben, und nicht alles bedenken können, aber so, wie es jetzt funktioniert, ist es für mich zum vergessen, bzw. mit Ärger bei jedem neuen Seiten-Aufruf verbunden.

Und dann noch die Cookies. Alles nur mehr grausam.

Herr Danisch, die vorherige Werbe-Funktion, wo nach ein paar Blog-Artikel-Überschriften, dann ein breiter Banner zu sehen war, das war okay, – jetzt ist das Ganze von einer derart penetranten AUFDRINGLICHKEIT, dass einem jegliche Surf-Laune vergeht, besonders, wenn man keine Mouse hat, sondern das alles mit der TV-Fernbedienung zu organisieren gezwungen ist.

Natürlich ist es enorm wichtig, dass Sie zu Ihrem Geld kommen, logo, aber es gibt eine Grenze des Erträglichen, und diese ist bei TV-WEB deutlich überschritten.

Probieren Sie es doch einfach selbst aus, App „Internet-Browser“ auf Ihrem Fernseher aufrufen, auf 300 % vergrößern und mal für 30 min Ihre Website besuchen, – und ich schwör Ihnen : Sie schmeißen die Fernbedienung an die Wand ! Und dabei sind Sie nicht mal behindert, – (Gott sei Dank) !

Alles Liebe aus Österreich, Ihr Fan – […]

Ich habe ihn schon gebeten, mir mal ein Bild zu schicken. Denn viel mehr, als dass er sauer und empört ist, kann ich dem nicht entnehmen.

Ich muss jetzt allerdings auch sagen, dass die Browser in den Fernsehern in der Regel Schrott sind. Die haben weder genug Speicher noch Rechenleistung, um da einen richtigen vollständigen Browser laufen zu lassen. Ehrlich gesagt, käme ich auch nicht auf die Idee, mit den Popelbrowsern im Fernseher im Internet zu surfen und mit einer Fernsehfernbedienung rumzumachen. Ich würde die nur für irgendwelche Status-Webseiten (Nagios, Börsenkurse usw.) verwenden. Für normale Webseiten würde ich da immer per HDMI einen Notebook, MiniPC oder einen Raspberry Pi anschließen und eine kleine Funktastatur verwenden. Denn das Prinzip, zur Anzeige einen großen Fernseher zu verwenden, ist schon plausibel. Aber ich käme nicht auf die Idee, mich da mit der TV-Fernbedienung durch das Internet zu quälen.

Deshalb habe ich das auch nicht gestest. Weder bin ich auf die Idee gekommen, dass jemand meine Webseiten mit einem Fernseher-Browser liest, noch wüsste ich, wie ich das testen könnte, denn es gibt ja unzählige Fernseher und Version mit unterschiedlichen Softwareversionen auf dem Markt, die alle nur irgendwas implementieren, nur Grundfunktionen. Wie soll ich das testen? Firefox und Chromium haben im Developer-Mode die Möglichkeit, Mobilfunkgeräte und Tablets zu emulieren, aber keine Fernseher. Wie soll ich das testen?

Außerdem: Ich habe das nach dieser Mail auf meinem Fernseher mal getestet. Ich habe hier in meinem Arbeitszimmer einen Samsung SmartTV, schon einige Jahr alt, Software lausig instabil. Verwende ich gelegentlich, um beispielsweise Konferenzen usw. über Online-Streaming zu schauen. Auf dem habe ich das eben gestest, und: Sieht einwandfrei aus, auch bei 300%. Der Fernseher stellt die Webseite problemlos dar, und wählt (responsive) das für Handys vorgesehene einspaltige Layout.

Sorry, aber funktioniert hier bei mir einwandfrei. Nein, ich schmeiße die Fernbedienung nicht an die Wand.

Ich kann das so überhaupt nicht nachvollziehen. Und ganz ehrlich: Ich kann auch nicht auf jeden Rudimentär-Browser Rücksicht nehmen. Woher soll ich wissen, was auf welchem Fernseher läuft? Es hört sich an, als ob der Browser noch kein Grid-Layout kann. Ich kann aber doch nicht ewig am HTML-Standard von vor 10 Jahren hängen bleiben.

Ich kann da nur empfehlen, diese Not-Browser in den Fernsehern nicht zu benutzen. Ein kleiner PC oder ein (gerade wegen Pandemie schwer zu bekommender) Raspberry am HDMI-Eingang und eine kleine Funktastatur liefern da weitaus bessere Ergebnisse. (Man kann an manche SmartTVs auch Funktastaturen anschließen.)

Zweite Zuschrift.

Hallo Hadmut,

ohne lange Vorrede ein/e Vorschlag/Bitte zum Layout:

Ich habe richtig schlechte Augen unter anderem eine ziemlich ausgeprägte Kontrastschwäche. Natürlich ist dunkelgraue Schrift auf weißem Grund sehr kontrastreich. Aber für mich trotzdem anstrengend, weil das Weiß den Text überstrahlt. Der Text wirkt dann sehr “dünn” (schwer zu beschreiben). Daher weiche ich oft auf den Reader-Modus in dunkel aus.
Daran kann jetzt aber Dir nicht gelegen sein, weil der ja keine Werbung anzeigt … –> Mein Vorschlag wäre ein Dark/Night-Mode mit dunklem Hintergrund und heller Schrift. Das kommt auch allen entgegen, die Dark-Mode aus anderen Gründen bevorzugen. CSS kann die entsprechende Präferenz des Clients auswerten und dem folgend das Layout umschalten.

Siehe hier:
https://stackoverflow.com/questions/50840168/how-to-detect-if-the-os-is-in-dark-mode-in-browsers

Auf der Seite der Tagesschau kann man sich das schön ansehen. Auch dass Dark-Mode nicht unbedingt ein schwarzer Hintergrund sein muss.

Ich habe die Farben eigentlich ganz bewusst so gewählt, aus Rücksicht auf Leute wie mich. Wenn man als Informatiker den ganzen Tag am Bildschirm arbeitet und dann auch abends und am Wochenende noch weiter, geht schwarze Schrift auf hellweißem Grund gewaltig auf die Augen und ermüdet.

Und helle Schrift auf dunklem Grund kann ich persönlich gar nicht ausstehen, auch wenn ich Leute kenne, die das mögen, und ich früher an den alten monochromen Bildschirmen mit grüner, gelber oder weißer Schrift saß. Ich empfinde das als überaus anstrengend für die Augen. Deshalb habe ich das nicht vorgesehen.

Ich wusste aber auch nicht, dass das inzwischen in den Media-Anweisungen der Stylesheets möglich ist. Danke für den Hinweis. Ich kann’s ja mal testweise einbauen.

Und dann noch zwei (kleinere) Verbesserungsvorschläge:

1) Ich steige meist per Twitter vom Handy aus in Deine Artikel ein. Da ist der “Content above the fold” jetzt quasi null. Sehr große Überschrift und Werbeblock und erst nach dem ersten Scrollen kommt der Artikel. Gönn Dir doch oben einen Kontrastreichen Balken oben mit dem Blognamen und pack als Logo Dein Favicon/Twitterprofilbild dazu. Das
erhöht die Wiedererennung und braucht deutlich weniger Platz als die aktuelle Lösung mit der sehr großen Schrift.

2) Gerade hab ich mir das Ganze dann auch mal an meinen großen Bildschirm angeguckt: Da fällt Dein Inhalt durch seine dezenten Farben brutal gegen die Werbung ab. Zumal der Block oben und rechts mit dem sticky Block unten zusammen fast den kompletten Inhalt ausmachen. Ich sehe 1,5 Artikel-Teaser, die zudem untergehen: In meinem Fall in einen
bunten/roten Rahmen von “Otto”-Werbung. –> Blogübeschrift farblich kräftiger dafür kleiner (s.o.), den oberen Werbeblock vllt nicht ganz so hoch und die Sache sieht bestimmt viel besser aus.

Zu 1: Das kann ich wohl machen. Eigentlich hatte ich ja Graphiken auf Mobilgeräten eher vermieden, damit es flott geht. Aber ich denke, da kann ich was machen. Ich müsste mir nur erst einmal überlegen, was. Da bräuchte ich erst einmal ein Logo. Bei einem Kunst-Krüppel wie mir dauert sowas.

Zu 2: Eigentlich wollte ich das nicht so knallbunt und kontrastig haben. Aus besagten Gründen. Ich finde es zu anstrengend, aufdringlich und hebe mir volles weiß und schwarz lieber für da auf, wo ich es brauche. Etwa für eine erläuternde Graphik. Ich bevorzuge tatsächlich Grautöne und Farbtöne mit reduzierter Sättigung. Ich finde das immer so schrecklich, wenn die Leute alle Farben und Schriftarten reinballern, die sie finden können. Ist natürlich blöd, wenn man gegen Graphiken konkurrieren muss.

Da muss ich aber erst einmal drüber nachdenken. Gibt ja auch Leute die sagen, das Logo müsse immer oben und sticky sein, damit man es immer sieht. Da muss ich mir erst mal wieder eine neue Meinung darüber bilden.