Tritium-Design

Wenn es nach Jakob Nielsen geht, haben die guten alten Passwortfelder ausgedient.
In seinem Artikel vom 23. Juni 2009 beschreibt er die immer wiederkehrenden Probleme im Umgang mit maskierten Passwörtern: Die User erhalten kein visuelles Feedback, was sie da eigentlich gerade eintippen. “Habe ich mich jetzt vertippt, oder nicht?” Wer kennt das nicht?
Er rät daher dazu, Passwortfelder durch normale Textfelder zu ersetzen und eine Maskierung durch Klick auf eine Checkbox durchzuführen.

Die Jungs von decaf haben hingegen die Passwortmaskierung des IPhone aufgegriffen. Hierbei wird der letzte Buchstabe (und nur dieser) im Klartext dargestellt.

Obwohl ich diesen Ansatz gar nicht so schlecht finde, halte ich es für überflüssig, da der Benutzer ja eigentlich gerne das gesamte Passwort sehen würde um sicherzugehen, dass er sich nicht vertippt hat.

Daher habe ich mal ein kurzes Beispiel für eine Passwortmaskierung umgesetzt, die mehr in Richtung der Idee von Jakob Nielsen geht.
Hierbei wird das Passwort per default maskiert und bei Klick auf die Checkbox kann man es sich im Klartext betrachten.

Das Skript ist handliche 50 Zeilen lang (inklusive Kommentar) und lässt sich einfach für mehrere Checkboxen und Passwortfelder konfigurieren. Vorausgesetzt wird lediglich Prototype.
Wenn kein Javascript beim Client zur Verfügung steht, wird die Checkbox nicht angezeigt – die Passwortfelder verhalten sich also standardkonform.
Noch habe ich das Skript nicht in allen Browsern getestet, da es reines “vHiT” (vom Hirn ins Terminal) ist. Aber als Proof of Concept sollte es erstmal genügen und die Idee verdeutlichen.

        

Das Internet ist voller Inspirationen. Da suche ich vergangene Woche im Netz nach einem bestimmten WordPress-Plugin und stosse dabei auf die Seiten von Rogie King und Tim van Damme und plötzlich kam mir die Idee für eine eigene interaktive vCard.
Dabei war das Ziel diese so standardkonform und browserkompatibel wie nur möglich zu gestalten und – meiner Vorliebe für Javascript geschuldet – sie mit etwas Eyecandy zu schmücken. Als weiteren Ansporn nahm ich mir vor, dass es nicht mehr als ein Wochenende an Zeit verbrauchen solle.
Herausgekommen ist diese vCard.
Abgesehen vom verwendeten overflow-y ist sie valides CSS 2.1 (overflow-y ist erst ab CSS 3 Bestandteil), valides XHTML1.0 Strict und auf den gängigsten Browsern getestet und funktionsfähig. Ohne Javascript funktioniert zwar die Animation nicht, dafür habe ich aber die Struktur der Card so optimiert, dass sie auch in Lynx ein sinnvolles und navigierbares Erscheinungsbild hergibt.
Tim hat sich auch prompt bei mir gemeldet und sein Lob ausgesprochen und einen Platz in seiner Wall of Fame in Aussicht gestellt, was mich natürlich sehr freut.

        

Die Universität Bayreuth hat ein nettes Framework auf Javascript-Basis entwickelt (http://jsxgraph.uni-bayreuth.de/wp/). Es soll weitestgehend browserkompatibel sein (sofern diese Browser SVG unterstützen), ist nicht ganz so ästhetisch anspruchsvoll wie Timeline oder Timeplot des Massachusetts Institute of Technology (MIT), jedoch dafür in der Anwendung wesentlich flexibler.

        

Ich stand heute vor dem eher unbedeutenden Problem, dass Prototype-JS (aktuell Version 1.6.0) bei einer Serverantwort nur dann JSON selbständig interpretiert, wenn entweder im Header “X-JSON” oder als Content-Type “application/json” geliefert wird. Weder das Eine noch das Andere wären aus technischer Sicht problematisch gewesen umzusetzen, jedoch wollte ich einen Content-Type “text/x-json” senden, da dieses nach Ratschlag der RFC-1521 in diesem Fall passender wäre, da es sich bei JSON um ein menschenlesbares Textformat handelt – “application” hingegen sollte nur für Binärinformationen verwendet werden. Es sei nur nebenbei erwähnt, dass die genannte RFC aus dem Jahr 1993 stammt, als an JSON noch nicht zu denken war und somit nur eine Richtlinie darstellt.

Die entscheidende Stelle in Prototype war auch recht schnell gefunden. Es handelt sich dabei um die Klasse Ajax.Response und die Methode _getResponseJSON(), worin der Content-Type geprüft wird. Die Frage war nur: Wie passe ich die Abfrage an, ohne den Originalcode von PrototypeJS zu ändern und gleichzeitig zu gewährleisten, dass alle von Prototype durchgeführten Ajax-Requests trotzdem die erweiterte Überprüfung auf Content-Type “text/x-json” verwenden? Read the rest of this entry »

        

[Anmerkung: Ich beschreibe hier nur, wie man sich mit Hilfe von Javascript ein kleines Binär-Uhr-Widget erstellt. Meine Zugriffsstatistiken zeigen jedoch, dass es ein reges Interesse am Bau einer Hardware Uhr gibt. Hierfür kann ich folgende Seite mit Schaltplänen empfehlen: http://www.pitts-electronics-home.de/electron/schpluhr.htm]

ja, wahnsinn! Eine Uhr, die man selber konfigurieren und die dann keiner mehr lesen kann.
So in etwa? Hm…nicht ganz.

Die Idee dazu entstand, als eine Kollegin mir ihren tollen konsolenbasierten E-Mail-Client zeigte und diesen als “chic” bezeichnete. Ich dachte nur: “Ja, klar – super. Ich kann mir auch eine Binäruhr kaufen und die Zeit dann selber ausrechnen!” – Genau, warum eigentlich nicht?

Ihr kennt diese Uhren? Die Dinger, die so hübsch blinken und wo man die Lämpchen zeilen- oder spaltenweise nach ihrer Wertigkeit addieren oder multiplizieren muss? Read the rest of this entry »