ux·zentrisch diskutierte vor einiger Zeit:

Mittwoch, 27. Januar 2010 von Marian Steinbach

Performance Testing mit Webpagetest.org

Wer unseren letzten Beitrag über Website Performance gelesen hat, hat schon mitbekommen, dass das Thema in diesem Jahr an Bedeutung gewinnen dürfte. Denn die Spekulationen, dass Google die Ladezeit einer Website in die Liste der Ranking-Kriterien aufnimmt, gewinnen an Substanz.

Matt Cutts, bekannt aus den Google Webmaster Central Videos, hat in seinem kürzlich veröffentlichten Wrap-Up eines Konferenzbeitrags neben dem ebenfalls oben schon gezeigten Google Page Speed ein weiteres nützliches Werkzeug vorgestellt, ausnahmsweise mal nicht aus dem Hause Google:

Der Dienst Webpagetest.org erlaubt die detaillierte Auswertung der Ladezeiten einer Webseite, ähnlich wie es Google Page Speed und Yahoo! YSlow machen. Allerdings sind die Optimierungs-Tipps, die Webpagetest.org liefert, nicht mit diesen Tools deckungsgleich, sondern ergänzen diese sehr gut. Man muss dafür auch keinen bestimmten Browser mit diversen Add-Ons installieren, sondern geht einfach auf die Website und gibt seine eigene URL ein. Dann wählt man auf Wunsch noch den Standort des Test-Clients (für Europäer ist momentan ein Standort in Großbritannien sinnvoll) und wartet etwa eine Minute auf das Ergebnis.

Der Report ist öffentlich unter einer URL abrufbar und kann somit problemlos an Dritte weitergegeben werden. Wer will, kann sich als Beispiel den Report für uxzentrisch.de ansehen.

Der obige Screenshot (Klick zum Vergrößern) zeigt einen Ausschnit aus dem »Waterfall« Diagramm. Dieses stellt dar, wann der Browser welche Ressourcen vom Server geladen hat und wie lange er dafür gebraucht hat.

An dieser Darstellung kann man beispielsweise sehen, dass zwei eingebundene Bilder in Artikeln, ein Gravatar-Bild (daher kommen unsere Autoren-Bildchen) und ein Video von Screenr recht lange brauchen, bis sie geladen werden (Zeile 5 bis 8). Weil der Browser (im Test ein IE7) maximal 4 parallele Downloads durchführt, vergeht sehr viel Zeit, bis der nächste Download (Zeile 9) starten kann. Grund genug, sich die betreffenden Ressourcen mal genauer anzusehen.

Montag, 25. Januar 2010 von Tobias Jordans

Dropdown mit LivePreview


(vergrößern)

Kürzlich habe ich mit The Unarchiver ein Archiv entpackt. Offensichtlich gab es dabei ein Problem bei der Interpretation von Sonderzeichen wie dem Ö. Wie geht The Unarchiver damit um? Anstatt mir eine technisch-abstrakte Auswahl von Zeichensätzen anzubieten, zeigt er hübsch eingerückt daneben direkt eine Vorschau des problematischen Namens. Hervorragend!

Besonders überrascht von diesem Verhalten war ich, weil The Unarchiver eigentlich eine kleine, kostenlose Software ist, die kaum GUI verwendet sondern einfach ohne Dialog bei Klick ein Archiv entpackt.

Montag, 25. Januar 2010 von Lutz Schmitt

Neue Informationen für Buspendler in Köln

Heute morgen bei der Fahrt ins Büro habe ich wieder einmal über die immer umfassenderen Möglichkeiten der Informationsvisualisierung im öffentlichen Raum staunen dürfen. Die Kölner Verkehrsbetriebe haben seit neuestem auch an vielen Bushaltestellen aktuelle Fahrtenanzeigen und gleichzeitig das neue Feature, dass ein Bus als im Stau stehend abgebildet werden kann. Die Technologien werden immer besser, der Fortschritt ist nicht aufzuhalten!

Aber was nützt mir das Wissen das ein ein Bus im Stau steht? Soll ich mich nach Alternativen umschauen? Aber woran mache ich das fest? Bedeutet Stau, dass der Bus viel später kommt? Ist es so schlimm, dass die KVB nicht wagt zu vermuten, wann er endlich eintrifft? Man kann es schlecht einschätzen, die Information »Stau« ist reichlich nutzlos.

Dann doch lieber wieder die alte Angabe der erwarteten Ankunftszeit und einfach ein paar Minuten draufschlagen. Damit kann ich was anfangen.

Mittwoch, 20. Januar 2010 von Tobias Jordans

Einer dieser wunderbaren Dialoge, mit denen Microsoft immer wieder daran erinnert, dass sie lieber die Symptome als deren Ursachen bekämpfen. Aber vielleicht ändert sich ja auch das mit der Zeit.

Montag, 18. Januar 2010 Ein Feature von Marian Steinbach

Über Umwege zu schnellen Websites

Autor

Im Dezember haben verschiedene Meldungen nahegelegt (z.B. im webworker blog), dass im Jahr 2010 das Thema Ladezeiten von Webseiten eine ganz neue Bedeutung bekommen wird. Diesmal getrieben von Google.

Anlass war unter anderem eine Erweiterung der Google Webmaster Tools. Dort bekommen Site-Betreiber nun auch Aufschluss über die Ladezeiten auf Ihrer Website. Diese Daten erhebt Google über den Google Toolbar. Neben der Statistik erhält der Site-Betreiber konkrete Empfehlungen, wie er die Performance seiner Site verbessern kann.

Mittwoch, 6. Januar 2010 von Tobias Jordans

»We estimate that the extra requirement of serving this both into desktop browsers and mobile browsers only adds about 5 % extra engineering effort–which I find remarkable.«

Lars Rasmussen bezifferte während seiner Google Wave-Vorstellung auf der Google IO im Mai 2009 den Aufwand, mobile Applikationen mit dem Google Web Toolkit zu erstellen. Hier ist die genaue Stelle im Video. Und wer dann nocheinmal sehen möchte, wie Wave sich am Handy anfühlt, der muss zu Minute 25 zurückspulen.

Zuvor erklärt er noch etwas ausführlicher:

And by the way, this is both if you are on the desktop or if you are on a mobile device. When I showed you, when you are on the Android and on the iPhone here, Wave was running in the browser on both of those phones. GWT makes that fairly easy to do. It’s acutally the same code that runs in those mobile devices. Its just a different layout.

Montag, 4. Januar 2010 von Tobias Jordans

Dieter Rams über die wichtigen unspektakulären Dinge und den gelben Druckknopf

Zur Zeit (und noch bis 9.3.2010) gibt es in London eine Ausstellung von Dieter Rams, die sehr vielversprechend aussieht und in derem Fahrwasser einige tolle Fotos und Videos zu Rams veröffentlicht werden.

So zum Beispiel das folgende Videointerview. Darin beschreibt Rams seine Passion für Produkte, deren Design der Funktionalität des Produkts folgt; dass seine Aufgabe damals war, den Produktentwicklungsprozess zu begleiten und zu managen, nicht nur geniale Designs zu entwerfen; dass sein Ziel sei, besseres Design zu schaffen, nicht herausragendes Design und das Design, Dinge und darüber Menschen nicht dominieren soll, sondern ihnen helfen, Dinge zu benutzen. Zum Beispiel durch die richtige Farbwahl.

Freitag, 18. Dezember 2009 von Tobias Jordans

Einblicke in die iterative Konzeption+Entwicklung von Trendly.com

Das richtige mentale Grundmodel zu finden, auf dem man seine Webapplikation aufbaut, ist eine der schwierigsten Aufgaben bei der Produktentwicklung. Avi Bryant, einer der CEO der Web-Datenbank DabbleDB, führt uns in seinem Vortrag auf der FutureRuby-Konferenz durch diesen Prozess am Beispiel seines Produkts Trendly.

Trendly nutzt die Roh-Daten von Google Analytics und visualisiert sie zusammen mit Ereignissen wie Blogposts, Links aus anderen Blogs, Vorträgen, die man gehalten hat… – Auf diese Weise versucht Avi Bryant, die Zugriffe auf seine Website besser zu verstehen.

In seinem Vortrag beschreibt er, wie sie zu Beginn in vielen Iterationen, viele Ideen ausprobiert haben. Ziel sei es, möglichst viel auszubrobieren um es dann verwerfen zu können. »Fail early, fail often.«

Zum Vortrag mit Folien.


Quelle

Mittwoch, 16. Dezember 2009 von Tobias Jordans

Eyetracking-Ergebnisse werden besonders durch die Fragestellung beeinflusst

Susan Weinschenk, die Autorin von »Neuro Web Design«, fasst in ihrem Blog eine alte aber interessante Studie über Eyetracking zusammen: What People Look At On a Picture Or Screen Depends On What You Say To Them

Eye tracking is a technology that allows you to see and record what a person is looking at, and for how long. (…)
It’s a pretty interesting technology, one of the benefits being that you don’t have to rely on what people SAY they are looking at, but can collect the data directly. (…)
We underestimate the effect our instructions have on where someone looks. (…)
In research by Yarbus, people were shown this picture, and then given different instructions of what to think about while looking at the picture. Below are the eye gaze patterns matched with the instructions that people were given.

EyeTracking Drei Beispielfotos aus Susans Blog

Weitere Beispiele findet ihr in Susans Blogpost.

Susans Fazit aus dieser Studie:

  • Auch wenn Eyetracking objektiver ist als andere Methoden, hängt das Untersuchungsergebnis entscheident von den Fragestellungen ab.
  • Die Fragen für eine Eyetracking Studie sind besonders wichtig und alle Probanden müssen exakt die gleiche Frage gestellt bekommen.
  • Da Nutzer nie mit den gleichen Zielen zweimal auf eine Website kommen, wird sich auch ihre Blickführung immer unterscheiden.

Übrigens: Beim UX Book Club im Januar in Köln werden wir Susan Weinschenk Buch besprechen. Kommt gerne vorbei!

Montag, 14. Dezember 2009 von Marian Steinbach

Nach einfach kommt unverständlich: Facebooks neue Privacy-Einstellungen

Facebook begrüßt seine Nutzer aktuell mit einer Meldung, dass die Einstellungen für die Privatsphäre vereinfacht worden seien. Nutzer sollen Ihre Einstellungen nun der neuen Systematik anpassen.

Nachdem ich dem Aufruf gefolgt bin, meine Einstellungen anzupassen, erhalte ich diese Seite:

Facebook Privacy-Einstellungen

Was will uns Facebook damit sagen? Fehlt hier nicht ein einleitender Satz wie »Lege fest, welche Nutzer welche Deiner Daten einsehen können.«?

Offenbar kann ich in jeder Zeile die »Alte Einstellung« beibehalten (rechter Radio-Button) oder auf genau eine neue Einstellung umstellen. Diese neue Einstellung bedeutet offenbar für einige meiner Daten, dass »Alle« sie sehen können. Für andere Daten bedeutet dies »für Freunde« oder »für Freunde von Freunden«.

Zwei Dinge erfahre ich auf dieser Seite offensichtlich nicht:

  • Was bedeutet »Alle«? Sind alle Facebook-Nutzer oder alle Internet-Nutzer gemeint?
  • Wie sind meine bisherigen Einstellungen?

Leider ist es mir ohne diese Informationen nicht möglich, auf dieser Seite meine alten Einstellungen mit den neuen zu vergleichen. Der Verdacht, dass meine alten Einstellungen detaillierter und restriktiver sind, als der neue Vorschlag von Facebook, wird auf einer Infoseite leider nicht entkräftet. Die Konsequenz für mich: Die alten Einstellungen beibehalten.

Fast hätte der Artikel an dieser Stelle geendet, mit der Bemerkung, dass es so nicht geht und gute User Experience etwas anderes ist. Aber dann gucke ich mir die oben gezeigten Seite doch noch mal, klicke ein bisschen herum und bemerke, dass beide oben bemängelten Informationen tatsächlich doch gegeben werden.

Die Erklärung, was »Alle« bedeutet, finde ich unten auf der Seite innerhalb des Textes, in dem ich Bereits den Link zur Info-Seite angklickt habe.

facebook-new-privacy-settings-text

Und die Beschreibung, wie meine bisherigen Einstellungen aussehen, finde ich durch Zufall auch. In dem Moment, wo ich einen der Radio-Buttons anklicken möchte, erscheint dieser Tooltip:

facebook-new-privacy-settings-tooltip

Handwerker sagen: Nach fest kommt ab.