Benutzererfahrung (UE) verbessern
Bisher konzentrierte sich dieser Artikel ausschließlich auf die Vorteile der Verwendung von JavaScript-Frameworks und darauf, wie es die Erstellung interaktiver Anwendungen erleichtert. Andererseits hat jedoch jedes Framework seine eigenen attraktiven Perspektiven, einschließlich Benutzeroberflächenkomponenten (UI) und Verbesserungen der Benutzererfahrung (UE), die viel Aufwand erfordern.
In diesem Kapitel wird die Benutzererfahrung der folgenden Frameworks untersucht: Prototype, jQuery, YUI, ExtJS und MooTools.
Prototyp
Prototype ist einer der wenigen, der keine vorgefertigten UI-Komponenten oder Verbesserungen der Benutzererfahrung enthält. Stattdessen wird auf alle Schwesterbibliotheken von script.aculo.us verwiesen (Scripty2, die neueste bekannte Version). script.aculo.us bietet umfassende Unterstützung für Prototypeffekte und -verhalten. Zu diesen Effekten gehören: Hervorheben, Verformen, Reduzieren, Zittern, Verschieben und Erweitern. script.aculo.us unterstützt außerdem Drag & Drop, Sliding, Ajax-Echtzeitbearbeitung und automatische Eingabeaufforderungen. Script.aculo.us überlässt das Design von Steuerelementen (wie Schieberegler und Autovervollständigung) den Entwicklern und stellt keine Standard-Skins bereit.
jQuery
Im Gegensatz zur Prototype-Bibliothek umfasst jQuery im Kern einige grundlegende Benutzererfahrungen. Dies ähnelt einigen einfachen Effekten von Script.aculo.us, wie z. B. Schieben und Ausblenden. Für erweiterte Benutzererfahrungsfunktionen müssen Sie jedoch die jQuery-UI-Bibliothek herunterladen, die weitere Effekte wie Ziehen, Zoomen und Sortieren enthält. Im Gegensatz zu Script.aculo.us enthält die jQuery-Benutzeroberfläche auch einige kleine Widgets oder Komponenten und bietet Entwicklern eine attraktivere Ausrede, die die Entwicklung erleichtert. Derzeit umfassen diese Komponenten: Akkordeon, Datumsauswahl, Dialog, Fortschrittsbalken, Schieberegler und Tabs. Die Widgets sind vollständig thematisch anpassbar und die jQuery-Benutzeroberfläche verfügt über eine große Auswahl an Themen, die Sie verwenden können, um den Anforderungen Ihrer eigenen Website oder Webanwendung gerecht zu werden. Abbildung 1 zeigt das Datepicker-Widget und das Apple-Design der jQuery-Benutzeroberfläche.
Abbildung 1: Datepicker-Widget der jQuery-Benutzeroberfläche
.jpg)