Ajax -Einführung

Dieser Artikel soll eine Einführung in AJAX sein, erklären worum es sich dabei handelt und einige Links für weitere Informationen bieten. Für diejenigen die selbst was mit der AJAX Technologie programmieren wollen gibt es weiter unten ein paar Links.

(folgende Links sind Anker mit denen man durch den Artikel navigieren kann)

Ajax - was ist das
Die Technologie - wie funktioniert Ajax
Ajax in der Anwendung - was bringt es für meine Website
Ajax-Anwendungen selbst programmieren
Welche Browser unterstützen Ajax
Vorteile
Nachteile
Sinnvolle Einsatzbereiche
Nützliche Links
Ajax Beispielanwendungen
Zukunftsaussichten

Ajax - was ist das
Ajax steht für Asynchronous Javascript und XML. Wer PHP-Anwendungen kennt, weiß das Daten vom Browser zum Server geschickt und dort mit PHP verarbeitet werden. Jeder Klick auf einen Link führt dazu, das der Browser mit dem Server kommuniziert und das kostet natürlich Zeit und Ressourcen. Dabei ist das System in sich unlogisch, es müssen nicht immer alle Daten wieder übertragen werden, wie das Ajax Konzept beweist.

Kommt man auf eine Website die Ajax verwendet fällt einem oft zuerst die Dynamik auf, die durch Ajax erzeugt wird. Da nur bestimmte Daten neugeladen werden müssen, können viele Schritte ohne Zugriff auf den Server ausgeführt werden. Es gibt Anwendungen da kommt es mir so vor als würde ich auf meinem Desktop arbeiten, dort werden Aktionen auch ohne Zeitverzögerung ausgeführt.

zum anfang

Die Technologie - wie funktioniert Ajax
Folgende Webtechnologien werden unter dem Begriff Ajax zusammengefasst [quelle: wikipedia.org]:

HTML (oder XHTML) und CSS zur Formatierung einer Webseite.
DOM (Document Object Model) zur Repräsentation von Daten bzw. Inhalten.
JavaScript zur Manipulation des Document Object Models und zur dynamischen Darstellung der Inhalte.
XML als Datenaustauschformat.
XSLT zur Datentransformation.
Das XMLHttpRequest-Objekt, um Daten auf asynchroner Basis mit dem Webserver austauschen zu können.
Eine andere Transportmethode ist On-Demand JavaScript, bei der eine JavaScript-Datei per DOM-Manipulation angefordert wird.

zum anfang

Ajax in der Anwendung - was bringt es für meine Website
Um es hart zu sagen: Nichts! Zumindest für die meisten Websites ist es nur zusätzliche Mühe mit der Technik, die im Endeffekt keinen Vorteil bringt, der die Arbeit rechtfertigen würde. Zunächst sollte man sich fragen was einem an der Website stört und dann überlegen ob sich dieses Problem mit AJAX beheben läßt - natürlich kann man aus Lust und Laune Scripte basteln um AJAX zu lernen, aber für diejenigen die sich einen großen Vorteil davon erhoffen, rate ich die Finger davon zu lassen.

zum anfang

Ajax-Anwendungen selbst programmieren
Wer bisher noch völlig neu mit Ajax ist und dem es in den Finger juckt mal selbst was zu probieren, dem kann ich folgenden Artikel auf get-the-code.de empfehlen. Dort gibt es anfangs nochmal eine Einführung zu Ajax und dann gehts auch schon los. Unter den Schritten sind nochmal Anwendungsbeispiele zu finden, mit Code, sehr praktisch wenn man erstmal sehen will was man da programmiert.

Ein besseres Beispiel (wie ich finde) ist dieses Tutorial von devblog.de. Dort wird ein Chat programmiert, jeder Schritt ist detailiert beschrieben, auf Voraussetzungen wird hingewiesen (PHP und Mysql-Datenbank) und man ist schnell durch (erste Ergebnisse sind früh zu sehen). Ausserdem macht dieses Tutorial Lust auf mehr, man kann quasi direkt weitermachen.

zum anfang

Welche Browser unterstützen Ajax
Folgende Browser können mit der Ajax Technologie umgehen:

Microsoft Internet Explorer (und Browser die IE-basiert sind) 4.0 und höher
Mozilla Firefox, d. h. die Gecko-basierte Familie der Mozilla-Browser (Firefox 1.0 und Mozilla 1.4 oder höher)
Opera 7.6 und höher
Apple Safari 1.2 und höher
Netscape 7.1 und höher
Konqueror

[Quelle: wikipedia.org]

zum anfang

Vorteile

keine Ladezeiten - zumindest theoretisch, in der Praxis funktioniert das (noch) nicht aber da Daten nicht bei jeder Benutzeraktion neugeladen werden müssen, erzielt man ein Zeitersparnis
Ajax verwendet freie Webtechnologien und ist somit kostenlos
große Nutzergruppe - Ajax wird von vielen Menschen weiterentwickelt, dadurch wird der Einsatz komfortabler und umfangreicher
erhöhte Usability (bei korrektem Einsatz versteht sich)
die Serverlast wird gemindert - da seltener eine Verbindung zum Server hergestellt und Daten übertragen werden müssen, spart man Traffic
Gegenüber anderen Technologien wie Shockwave oder Flash bietet AJAX den Vorteil keine zusätzlichen Browser Plugins zu benötigen

zum anfang

Nachteile

der “Zurück”-Button des Browsers funktioniert nicht mehr effektiv, da die dynamischen Ajax-Schritte nicht in der Historie des Browsers gespeichert werden
Ajax basiert auf Javascript was in manchen Browsern ausgeschaltet ist - die Funktionen wären damit hinfällig
die Dynamik macht auch den Bookmarks zu schaffen - bestimmte Zustände können nicht als Bookmark abgespeichert werden
fehlender Feedback - man muss selbst in seine Anwendungen visuelle Feedbacks für Ladezeiten (z.b. in Form einer kleinen Sanduhr) integrieren, um die Usability zu erhöhen

zum anfang

Sinnvolle Einsatzbereiche
Brauchen wir Ajax überhaupt? Die Frage mag berechtigt sein, bisher sind die meisten Anwendungen mehr Spielerei und Code-aufblähende Konstrukte. Hinzu kommt das die meisten Internetnutzer die Features noch nicht kennen (zum Beispiel eine Fläche per “Drag and drop” auf der Website zu verschieben) und nutzen.

Bei sinnvollen Anwendungen fällt mir direkt immer Flickr ein, dort kann man Bilder hochladen, verwalten, editieren usw. Würde man ohne Ajax eine Bildbeschreibung speichern, müsste die gesamte Website neugeladen werden und dazu auch alle Bilder. Mit Ajax schafft man ein flüßig-arbeitendes Online-Bildverwaltungstool, daher auch die große Beliebtheit.

Wenn folgende drei Bedingungen im Webprojekt erfüllt sind, macht der Einsatz von Ajax Sinn:

geringe/seltene Datenverarbeitung
seltenes Nachladen einzelner Seitenelemente
neue Daten müssen nicht ständig nach- und hinzugeladen werden

bei all diesen Beispielen wird eine asynchrone Anfrage an den Server geschickt und das heißt Wartezeit, nur wenn diese 3 Bedingungen gering auftreten macht der Einsatz von Ajax Sinn, sonst würde der Geschwindigkeitsvorteil immer wieder durch obige Punkte zunichte gemacht werden.

zum anfang

Nützliche Links

Wer sich nun weiter mit dem Thema Ajax beschäftigen will, dem kann ich die Online Version des Buchs â€œAJAX - Frische Ansätze für das Webdesignâ€ empfehlen
Ajaxblog
Ajax Community - recht neu und wenig Beiträge, gute Aussichten auf Wachstum

zum anfang

Ajax Beispielanwendungen

Ajax Link Tracker - jeder Klick eines Users wird gespeichert. Drückt man Strg + X wird der prozenutale Anteil der Klicks für den jeweiligen Link angezeigt (englisch)
protopage.com - Online-Desktop
Google Suggest - Google errät was man eingeben will
Rico bietet einige Beispiele zu Ajax an - sehr zu empfehlen wenn man erstmal sehen will was AJAX kann und was möglich ist

zum anfang

Zukunftsaussichten
Ich warte schon auf die ersten ajax-basierten Werbeformen. Werbung kann sich ja nun dem Nutzerverhalten anpassen und dynamisch auf Verhaltensweisen reagieren. Es werden noch weitere Dienste im Web erscheinen - der Großteil von ihnen wird vermutlich aber wenig Resonanz finden, die anderen dafür umso mehr. Entscheidend wird wohl auch die Blogosphere von der Ajax Technologie profitieren und natürlich von den Plugins die die User erstellen. Der entscheidende Hemmfaktor wird aber die nötige Javascriptunterstützung bleiben, die AJAX voraussetzt.

zum anfang

Was denkt ihr, wohin wird sich AJAX entwickeln und was wird noch kommen?

Ajax

Verwandte Artikel

am Januar 12, 2006 um 16:52 Uhr | in Allgemein | 3 Kommentare