Sprung zum Inhalt

Webdesign nach Maß von webdesign weisshart

Mein Blog

RSS Feed AbonnementRSS 2.0 Feed

zum Archiv und den Kategorien

Wave, das Werkzeug zum Testen auf Barrierefreiheit

Montag, 31. März 2008

Automatische Tools zum Test auf Barrierefreiheit haben alle ihre - bekannten - Grenzen. Die meisten Tools weisen auch deutlich darauf hin. Manche zeigen auch detailliert auf, wo die Notwendigkeit einer zusätzlichen manuellen Überprüfung durch einen Experten besteht.
Alle mir bekannten Tools können aber eins nicht: Seiten "live" testen, also nach einem Neuaufbau der Seite, z. B. nach der Auswahl einer Option, die geänderte Seite erneut beurteilen.
Die neue Wave 4.0 Beta kann auch das. Und ist damit das erste Werkzeug, mit dem ich meinen Chat automatisiert testen kann.
Hier das Ergebnis.
Möglicherweise landest du mit obigem Link auf der Login-Seite. Aber, da die Seite ja bedienbar bleibt, einfach einloggen, und Wave testet auch den Chat selbst.


Die endgültige Wahrheit über den Google Pagerank

Samstag, 29. März 2008

Des weiteren gibts einen interessanten Tag, der den Pagerank festlegt:

<meta name="pagerank" content="1-10">

Der Wert für die pagerank bewegt sich zwischen 1 - 10.

Man kann mit diesem tag natürlich auch viel versauen. Er ist nur bei wichtigen Seiten zu benutzen. Natürlich findet jeder author seine Seite wichtig. Aber es gibt objektiv gesehen immer wichtigere Sites. Um den pagerank einzusetzen, würde ich wie folgt vorgehen, und NICHT gleich von Anfang an einfach zehn einsetzen!

Quelle: Dreamworker Adobe usergroup


Sommerzeit - Uhr vor oder zurück?

Freitag, 28. März 2008

Am Wochenende ist es wieder so weit: Sommerzeit - alle Uhren eine Stunde … ja, was jetzt? vor oder zurück?

Ganz einfach:
Wenn der Sommer kommt, dann werden in den Straßencafes Stühle und Tische vor das Haus gestellt.
Und im Herbst kommen sie wieder zurück in den Keller.
Capito?


Farbkontrast und Helligkeitsdifferenz nach W3C

Mittwoch, 26. März 2008

Die Verordnung zur Schaffung barrierefreier Informationstechnik nach dem Behindertengleichstellungsgesetz (BITV) schreibt vor:

Texte sind so zu gestalten, dass die Kombinationen aus Vordergrund und Hintergrundfarbe auf einem Schwarz-Weiß-Bildschirm und bei der Betrachtung durch Menschen mit Farbfehlsichtigkeiten ausreichend kontrastieren.

Was "ausreichend" ist, definiert W3C in Form von 2 Algorithmen.

Diese Forderung zu erfüllen, bereitet häufig Schwierigkeiten. Manchmal scheint es, als ob zu einer gegebenen Hintergrundfarbe oder Schriftfarbe überhaupt keine Schriftfarbe bzw. Hintergrundfarbe existiert, die die strengen Forderungen des W3C nach ausreichender Helligkeitsdifferenz und gleichzeitig ausreichendem Farbkontrast erfüllt.

Und dies ist tatsächlich bei sehr vielen Farben der Fall.

Ich habe die Algorithmen des W3C mal in eine anschauliche Form übertragen. Dort kann man eigene Farben vorgeben, oder einfach zufällige Farben durch Neuladen der Seite erzeugen lassen. Das Script generiert daraus automatisch

  1. die Farbe mit der bestmöglichen Helligkeitsdifferenz (also entweder Weiß oder Schwarz), und
  2. die Farbe mit dem bestmöglichen Farbkontrast,

und stellt die Ergebnisse jeweils als Schriftfarbe zur gewählten Hintergrundfarbe und als Hintergrundfarbe zur gewählten Schriftfarbe dar.
Die Zahlenwerte für Helligkeitsdifferenz und Farbkontrast nach W3C werden ausgegeben, und anhand der Minimalforderung bewertet.

Ein wenig Spielen mit zufälligen Farben liefert hin und wieder überraschende Ergebnisse. Manche zulässige Farbkombinationen kann ich kaum lesen.


Negerboxkampf im Tunnel - oder: weißer Adler auf weißem Grund

Montag, 24. März 2008

Beim Erstellen von Anwendungen steht man hin und wieder vor dem Problem, die Lesbarkeit von Schrift zu gewährleisten, wenn der User Schrift- oder Hintergrundfarben frei wählen kann.

Ein Beispiel ist der Credit-Link in meinem Suchscript. Der Webmaster will das Script an die Farben seines Seitendesigns anpassen. Wenn ich ihm aber die freie Wahl bei der farblichen Gestaltung auch des Credit-Links gebe, dann gibt es halt immer wieder pfiffige Zeitgenossen, die genau für diesen Zweck schwarze Schrift auf ihrem schwarzen Seitenhintergrund schön finden.

Das wiederum passt mir nicht.

Ich sorge also mit ein wenig PHP dafür, dass zur Anpassung an die Zielseite beliebige Hintergrundfarbe gewählt werden können, und dennoch mein Link optimal lesbar bleibt.

Der PHP Code dazu ist gar nicht so schwer zu verstehen:
if (preg_match('/^#[0-9A-F]{1,6}$/i', $bg) && strlen($bg) == 7) {
$redH = base_convert(substr($bg, 1, 2), 16, 10);
$greenH = base_convert(substr($bg, 3, 2), 16, 10);
$blueH = base_convert(substr($bg, 5, 2), 16, 10);
$sum = $redH*299 + $greenH*587 + $blueH*114;
if ($sum < 127000 ) {
$comp = "#FFFFFF";
} else {
$comp ="#000000";
}
} else {
$fehler = 1;
$bg = "#FFFFFF";
$comp = "#000000";
}

Je nach gewählter Hintergrundfarbe ($bg in der search_config.php einzustellen) wird als Schriftfarbe $comp weiß #FFFFFF oder schwarz #000000 eingestellt.
Welche Farbwerte aus 16 Millionen möglichen aber führen zu optimaler Lesbarkeit mit schwarzer, welche Farben mit weißer Schrift?

Das W3C weiß die Antwort.

In der Zeile
$sum = $redH*299 + $greenH*587 + $blueH*114;
ist dieses Wissen im Code umgesetzt.

Hier kann man das Ergebnis selbst testen und ein wenig herumspielen.
Und hier habe ich die Technik noch etwas erweitert, und ein kleines Tool erstellt, um auch Farbkontraste zu prüfen.


Teletext auf dem PC

Donnerstag, 20. März 2008

Teletext - das sind die Informationsseiten, die praktisch jeder TV Sender anbietet, und die unendlich langsam zu navigieren sind. Ich fühle mich dabei in die Zeit der 56 kbit Modems zurückversetzt, und nutze deshalb Teletext so gut wie nie.
Aber manchmal reizt es schon, kurz nachzuschauen, wenn in einer Fernsehsendung auf ein Teletext-Angebot verwiesen wird.
In meinem Wohnzimmer läuft, neben dem Fernseher, immer ein Laptop. Und damit geht Teletext viel besser!
Ein paar Adressen:

Viele weitere Teletext-Angebote findet man ganz einfach bei Google mit dem Suchbegriff "Teletext Senderkürzel"

Anzumerken noch: Jeder Sender setzt bei seinem Angebot auf eine andere Technik:
ARD und ORF setzen auf HTML, ZDF auf Flash, RTL und n-tv auf Java. Dass mir beim Schreiben dieses Artikels auf der Seite von n-tv mein Firefox abgestürzt ist, hat ganz bestimmt nichts mit meiner persönlichen Abneigung gegen Java zu tun.
Interessant: Beim ORF habe ich sogar eine text-only Version gefunden, die optimal mit Screen Readern zu bedienen ist:
ORF text-only


HotKeys selbst erstellen

Mittwoch, 19. März 2008

Ich war schon drauf und dran, eine eigene Extension für den Firefox zu schreiben, um ständig benötigte Folgen von Tastatureingaben beim web working zu automatisieren. Aber warum das Rad neu ER-finden, es genügt, es zu finden.

AutoHotkey ist ein freies Open-Source-Utility für Windows. Sie können damit:

  • fast alles mit Hilfe von (automatisch gesendeten) Tastendrücken und Mausklicks automatisieren. Sie können ein Maus- oder Tastaturmakro entweder selbst schreiben oder dafür den Makrorecorder benutzen.
  • Hotkeys für Tastatur, Joystick und Maus erstellen. Aus praktisch jeder Taste oder Maustaste oder einer Kombination aus beiden kann ein Hotkey werden.
  • während des Eintippens Abkürzungen erweitern; z. B. kann das Eintippen von "sgh" automatisch den Text "Sehr geehrter Herr" erzeugen.

… und noch viel mehr. Ich kann mir noch gar nicht vorstellen, was ich mit diesem Tool noch alles anstellen werde. Die ersten Tastaturmakros waren jedenfalls nach wenigen Minuten fertig.


Captchas sind ein Irrweg

Sonntag, 16. März 2008

Sie schließen Menschen von der Benutzung der dahinter liegenden Dienste aus.
Wie oft schon habe ich - obwohl mit keiner nennenswerten Sehschwäche geschlagen - beim dritten oder vierten erfolglosen Versuch, so ein Captcha zu entziffern, entnervt aufgegeben.

Aber sie hindern "böse" Bots nicht daran, solcherart vermeintlich geschützte Dienste für ihre Zwecke zu missbrauchen:

… Nach Angaben des Maildienstleisters MessageLabs liegt die Erkennungsrate der Captchas (Completely Automated Public Turing Test to Tell Computers and Humans Apart) durch die Spammer-Tools zwischen 20 und 30 Prozent…

Quelle: Heise Security

Eine Trefferquote von "nur" 20 Prozent ist für einen Spambot - anders als für mich - kein Grund, von seinem Treiben Abstand zu nehmen. Bots werden also von Captchas nicht wirkungsvoll ausgesperrt, wohl aber Menschen! Was für eine Perversion.


Ein barrierefreier? Online Video Player

Mittwoch, 12. März 2008

Wie zugänglich sind Online Flash Player für behinderte Surfer, die auf Hilfsmittel zum Betrachten von Webseiten angewiesen sind?
Ich hab' mich mit dieser Frage recht intensiv beschäftigt, und eine pragmatische Lösung erarbeitet.
Artikel lesen

Daß meine Lösung funktioniert, daran habe ich wenig Zweifel.
Erhebliche Zweifel habe ich aber, ob mein Artikel, und insbesondere der Versuch einer Anleitung zum Nachbau richtig und verständlich sind. Ich würde mich daher mehr als sonst über entsprechendes feedback freuen.


Firefox und der Zurück-Button

Donnerstag, 6. März 2008

Eine Detail, das mich schon lange gestört hat, ohne dass ich mir dessen eigentlich richtig bewusst war:
Wenn ich einem Link auf einer Seite folge, und dann mit dem Zurück-Button oder der Zurück-Taste zur aufrufenden Seite zurückkehre, dann erwarte ich eigentlich, dass ich mich an der gleichen Stelle, an der gleichen Scroll-Position wiederfinde.

Der IE macht das auch erwartungsgemäß. Der Firefox nicht. Und das ist irritierend.

Dabei handelt es sich um einen bekannten Bug im Firefox: http://kb.mozillazine.org/Scroll_position_on_web_pages_not_remembered
Und auf dieser Seite fand ich auch gleich noch einen Workaround: Eine Extension für den Fuchs: http://www.gozer.org/mozilla/extensions/
dort "Restore Scroll Position v0.5.9.10"


Fade in - Fade out per Javascript

Dienstag, 4. März 2008

Sanftes Ein- und Ausblenden von Grafiken - und anderen Inhalten. Von Flash Animationen wohl bekannt, oder auch mit Hilfe von Java Applets.

Wer auf beide Techniken verzichten will, und im Netz nach alternativen Möglichkeiten sucht, stößt ganz schnell auf eine Javascript Technik namens nereidFade. Und als nächstes auf den Hinweis: "Grundsätzlich ist dieser Effekt nur mit dem Internet Explorer möglich."

Ich hab' mir das Script mal vorgeknöpft, und für alle modernen Browser umgeschrieben. Und gleich noch mit einem horizontalen Autoscroll verbunden.
Zu sehen auf meiner aktuellen Spielwiese.

Achtung! DSL sollte schon sein. Die Seite ist wegen der eingebundenen Bilder 350 kB schwer.
Ladeanzeige Animation Für die Nutzer langsamerer Internetanbindungen gibt es als Entschädigung ein kleines gimmick: Eine flash-like Ladeanzeige.

Wer sich für die Technik interessiert:
Das Ganze spielt sich in einem iframe ab: http://www.the-magics.de/fade_scroll.html. Der Quellcode ist ausreichend dokumentiert.

Geeignet ist diese Technik zur Präsentation einiger weniger Bilder, aber ganz bestimmt nicht als Fotoalbum.


Hören statt Sehen

Montag, 3. März 2008

Eine akustische Seite. So überschreibt der blinde Webmaster Robert Gemeinhardt seine Homepage. Robert verwendet die fast vergessene Aufnahmetechnik Kunstkopfstereophonie, um möglichst realistische räumliche Tondokumente aus dem Alltag zu erstellen. Ob sich dem sehenden Hörer die alle Feinheiten dieser Aufnahmen ebenso erschließen, wie Robert das in seinen Anmerkungen beschreibt?
Um ein komfortables Stöbern durch die zahlreichen Tonbeispiele zu ermöglichen, setzt Robert meinen mp3-Player ein.


Das 1 & 1 des Web Design

Samstag, 1. März 2008

Aus einer Seite des bekannten Webhosters 1 & 1:

Wichtiger Hinweis:
Bitte navigieren Sie innerhalb dieser Anwendung nicht mit den Browserschaltern 'vor' und 'zurück'. Dies kann zu Fehlermeldungen führen.

Und warum schafft 1 & 1 es nicht, eine Webseite zu bauen, die wenigstens den schlimmsten aller Fehler vermeidet?
Warum muß das zweithäufigste Kommando des durchschnittlichen Seitenbesuchers zu Fehlermeldungen führen?
Zum Nachlesen: Jacob Nielsen - die 10 schlimmsten Fehler des Web Designs


Archiv:

Kategorien:

Creative Commons Lizenzvertrag
Alle Texte (nicht Bilder!) Creative Commons CC BY-NC-SA 3.0 DE