Warum die Tabs in Firefox 4 nach oben wandern

Einer der augenfälligsten Unterschiede zwischen Mozilla Firefox und Google Chrome ist die Positionierung der Tabs: Bei Firefox stehen sie zwischen dem Tab-Fenster und der Adresszeile, während sie bei Chrome ganz oben angeordnet sind.

Position der Tabs bei Google Chrome

Mit dem nächsten grossen Update 4.0 will das Firefox User Experience Team nun auch bei Firefox die Tabs nach oben verschieben. Das obige Video zeigt im Detail, dass dies nicht bloss eine gestalterische Laune ist, sondern eine bessere Usability bewirkt. Wer unbedingt will, kann die Tabs aber weiterhin am alten Ort belassen, denn es gibt eine entsprechende Option in den Voreinstellungen.

Zudem werden in diesem Video die neuen App Tabs (auch Persistent Tabs genannt) gezeigt. Dabei handelt es sich um spezielle Tabs, welche häufig benutzte Web-Applikationen (z.B. G-Mail) permanent zur Verfügung stellen. Diese Tabs brauchen wenig Platz und können nicht versehentlich geschlossen werden. Ein ausgesprochen nützliches Detail, das umso wichtiger wird, je stärker der Trend zum “Computing in the Cloud” wird. Wer will, kann App Tabs übrigens bereits heute in Form der gleichnamigen Extension ausprobieren.

Firefox mit Extension "App Tabs"

Die reiche Ernte der TYPO3 User Experience Week 2009 (T3UXW09)

Podcast der TYPO3 User Experience Week 2009

Im November letzten Jahres haben sich 30 Designer und Projektleiter aus der Community im deutschen Behringen eine Woche lang mit der Usability von TYPO3 beschäftigt. Dieses Treffen war ausgesprochen fruchtbar, wie man der kürzlich veröffentlichten Podcast-Serie entnehmen kann. Nachfolgend eine knappe Zusammenfassung der wichtigsten Verbesserungen, die sich voraussichtlich in der Version 4.4 von TYPO3 wiederfinden werden. Wer sich für die Details des zukünftigen Backends interessiert sollte sich die fünf Podcast-Episoden, welche zusammen rund eine Stunde dauern, auf jeden Fall anschauen.

Die Eingabemasken im Page-Modul wurden generell aufgeräumt und gewisse Parameter umbenannt. Die Masken wirken nun wesentlich ruhiger, weil die zahlreichen Buttons pro Content-Element erst beim Mouseover sichtbar werden. Zudem gibt es nun (auch ohne Extensions wie gb_bedraganddrop) Drag & Drop für Content-Elemente, auch über Spalten hinweg.

TYPO3: Drag & Drop von Content-Elementen im Backend

Die Content-Elemente können nicht nur in den bekannten Spalten angezeigt werden (Columns View), sondern neu auch im sogenannten Grid (Layout View), welcher die Raumaufteilung des Frontends nachempfindet. Ich vermute einmal, dass hier Extensions wie me_pagelayout oder be_layout Pate gestanden haben.

TYPO3: Neue Backend-Suche mit Autocomplete

Die Suche im Backend wurde in verschiedenen Punkten verbessert. Zunächst ist das Suchfeld nun immer sichtbar, muss also nicht mehr ausgeklappt werden. Dann kann man durch das Voranstellen des #-Zeichens gezielt nach bestimmten Datentypen suchen (z.B. #user:martin). Es gibt ferner eine Autocomplete-Funktion, welche laufend Treffer – sortiert nach Datentyp – ausweist. Auch die Filterfunktion für den Seitenbaum wurde optimiert.

TYPO3: Das Introduction Package, die neue Demo-Website

Für mich die vielleicht wichtigste Verbesserung ist das Introduction Package. Dabei handelt es sich um eine visuell ansprechende und im Sinne einer Best Practice aufgebaute Demo-Website, die man am Ende des Installationsprozesses mitinstallieren kann. Das schafft nicht nur die unsägliche Demo-Websites des FC Bigfeet aus der Welt, sondern verhindert auch, dass TYPO3-Neulinge an ihrer frischen TYPO3-Installation verzweifeln, weil man ohne die richtigen Konfigurationseinstellungen keinen vernünftigen Output im Frontend erhält. Das war längst fällig, und es scheint richtig gut gemacht zu sein.

TYPO3: Der neue Backend-Skin und der überarbeitete Seitenbaum

Der Standard-Backend-Skin, der in der Vergangenheit mehrfach leicht angepasst worden war, wurde weitere optimiert. Dies betrifft einerseits den technischen Aufbau (Handling von Icons und CSS, Nutzung von ExtJS, Verzicht auf Frames), andererseits aber auch das Design, das seine Herkunft zwar nicht verleugnet, aber doch deutlich edler und kontrastreicher daherkommt. Ausserdem wurden an vielen Stellen Korrekturen vorgenommen, um insgesamt ein konsistenteres und standardkonformeres Backend zu erhalten.

Viele Detailverbesserungen hat auch der Seitenbaum – der nun ebenfalls komplett auf ExtJS basiert – erlebt. Man kann ihn wegklappen, wenn er Platz benötigt wird, er bietet ein sehr schönes Drag & Drop (auch beim Einfügen von neuen Objekten), und er erlaubt das In-Place Editing von Seitentiteln.

GIMP: Mehr Übersicht dank Single Window Mode

image

An GIMP, dem wohl leistungsfähigsten Bitmap-Grafikprogramm aus der Open-Source-Welt, scheiden sich die Geister: Die einen sehen es als ernsthafte Photoshop-Alternative, die anderen verzweifeln an der Benutzeroberfläche, welche aus einer Flut von einzelnen Fenstern und Paletten besteht. Für letztere gibt es möglicherweise gute Nachrichten: GIMP-Entwickler Martin Nordholts berichtet über ein Projekt, das GIMP in der Version 2.8 einen sogenannten Single Window Mode bringen soll. Ein vielversprechender Ansatz.

Soft-Redesign bei Wikipedia

image

Auch bei der Wikipedia macht man sich Gedanken darüber, wie man die Benutzeroberfläche verbessern könnte. Seit kurzem kann man die zukünftige Wikipedia im Beta-Test erleben, wenn man ganz oben an der Seite auf den Link “Beta ausprobieren” klickt. Die wichtigsten Verbesserung:

  • Das Suchfeld für die Volltextsuche ist jetzt dort, wo es auch bei den meisten anderen Websites ist: rechts oben.
  • Der Editor bietet nun einen erweiterten Toolbar, der zusätzliche Formatierungsoptionen auf Knopfdruck bereitstellt. Zu viel sollte man sich davon allerdings nicht versprechen: Der Editor ist nach wie vor kein WYSIWYG-Editor, und auch ein vernünftiger Tabelleneditor fehlt weiterhin. Hübsch ist die Sonderzeichentabelle und die integrierte Wiki-Syntax-Hilfe.
  • Das Design wurde ganz sanft modernisiert.

Insgesamt ist die neue Oberfläche keine Revolution, sondern ein verhältnismässig kleiner Schritt in die richtige Richtung. Wer die alte Wikipedia ins Herz geschlossen hat, muss sich also keine Sorgen machen.

OpenOffice.org: Bald auch mit Ribbon?

image

Das Project Renaissance, das OpenOffice.org zu einer besseren Benutzeroberfläche verhelfen soll, hat einen ersten Prototypen hervorgebracht. Auffällig sind insbesondere die grossen Buttons, die in mehreren Registern (Tabs) am oberen Fensterrand platziert sind. Es ist nur allzu offensichtlich, dass dieses Bedienungskonzept von der Multifunktionsleiste inspiriert ist, welche Microsoft mit Office 2007 eingeführt hat. Die weiterhin sehr enge Anlehnung an das Vorbild Microsoft Office wird unterschiedlich beurteilt: Während die einen den geringe Lernaufwand für Umsteiger hervorstreichen, bedauern die anderen, dass OpenOffice.org nur eine Kopie und keine echte Alternative zum Office-Paket aus Redmond darstellt. Mehr zum neuen Interface in der Renaissance Status Presentation for July.

Project Renaissance: Ein besseres User Interface für OpenOffice.org

image

Bezüglich der Funktionalität hat es OpenOffice.org inzwischen geschafft, sich als valable Alternative zu Microsoft Office zu positionieren. Kritiker werfen dem Open-Source-Projekt allerdings vor, lediglich den kommerziellen Konkurrenten kopiert und dabei echte Innovationen verpasst zu haben. Dies fällt umso mehr auf, als Microsoft inzwischen mit Office 2007 eine neue Benutzeroberfläche eingeführt hat, welche zwar gewöhnungsbedürftig ist, aber inzwischen doch wesentlich moderner wirkt.

Mit dem Projekt Renaissance will OpenOffice.org hier Boden gut machen. Die freie Office Suite soll ein optimales User Interface erhalten. Konkrete Design-Entwürfe gibt es zwar noch keine, gemäss dem monatlichen Status-Update ist man aber in der Analysephase schon weit fortgeschritten.

list_adv: Endlich vernünftig blättern im TYPO3-List-Modul

image

TYPO3 ist einerseits die eierlegende Wollmilchsau unter den Content Management Systemen – andererseits wird es für seine Usability nie einen Preis gewinnen. Gewisse Details nerven sogar ernsthaft in der täglichen Arbeit, beispielsweise das rudimentäre Paging, mit dem man im List-Modul durch die Datensätze blättern muss (vgl. Screenshot oben).

Die Extension list_adv bringt hier eine wesentliche Verbesserung (vgl. Screenshot unten): Man kann bequem vor und zurück blättern und auch direkt auf bestimmte Seiten springen. Die Extension ist im Handumdrehen installiert und erfordert keinerlei Konfiguration.

image

WordPress 2.7: Neuerungen im Backend

Das nächste WordPress-Release 2.7 steht unmittelbar bevor. Wie obiges Video zeigt, wurde insbesondere das Backend der Blog-Software stark überarbeitet. Es ist dadurch wesentlich übersichtlicher, flexibler und attraktiver geworden. Ich arbeite nun seit genau 4 Jahren mit WordPress, und jedes neue Release hat meinen Eindruck bestätigt, dass diese Software sehr stetig und mit einem guten Blick für das Wesentliche weiterentwickelt wird. Die Ästhetik des Backends und die Übersichtlichkeit der Dokumentation auf www.wordpress.org sind weitere Gründe, weshalb ich meine Wahl nie bereut habe. Das Update 2.7 verspricht hier ein weiterer positiver Schritt zu werden.

TYPO3 Praxis: Drag & Drop im Backend

image

Lange war Drag & Drop eine Bedienungstechnik, welche Desktop-Programmen vorbehalten war. Dank AJAX kann man heute aber auch auf Webseiten Elemente durch blosses Verschieben mit der Maus umgruppieren. Im Backend von TYPO3 lassen sich auf diese Weise im Seitenbaum einzelne Seiten bequem verschieben oder auch kopieren: An der Zielposition erscheint das oben gezeigte Popup, über das man die auszuführende Aktion auswählt.

Ähnliches geht auch mit Inhaltselementen auf einer einzelnen Seite – allerdings ist in diesem Fall die Installation der Extension gb_bedraganddrop erforderlich.

Firefox-Menüs aufräumen mit Menu Editor

200711232042

Spätestens wenn man einige Extensions installiert hat, sind die Menüs von Firefox nicht mehr wirklich übersichtlich: Zu viele Einträge, die zudem oft unlogisch sortiert und gruppiert sind, erschweren die Bedienung. Abhilfe schafft die Extension Menu Editor, mit der man alle Menüs (inklusive das Kontextmenü, exklusive allfällige Spezialmenüs von Extensions) nach Belieben gestalten kann. Wer übrigens in der Hitze des Gefechts zu weit gegangen ist, kann über den Button „Zurücksetzen“ jederzeit die Standardkonfiguration wiederherstellen. Unverzichtbar für Usability-Anhänger und Customizing-Fetischisten!

css.php