Jquery, Ajax, Cufón & HTML5

Das Hauptmenü unserer Website, sowie alles was sich sonst auf dieser Seite und den Unterseiten bewegt, ist nichts als reines HTML, CSS und JavaSkript. Möglich durch Jquery, einer JavaSkript Objektbibliotek, die zahlreiche Methoden zur dynamischen Kontrolle von CSS, HTML und der API des Browsers bereitstellt. Da HTML/CSS Veränderungen stattfinden kann der Output in Jquerys direkt ohne Interface in die Templates eines CMS implementiert werden. Leider müssen sich JavaSkripte untereinander nicht unbedingt miteinander verstehen und je mehr Skripte man verwendet, desto eher treten Konflikte auf und machen den ein oder anderen Einbau trotz No-Konflikt Skript-Versionen durchaus mal zu einem Geduldsspiel. Der Funktionsumfang und die Dynamik reichen zwar nicht ganz an die von ActionScript Komponenten heran, dafür kommen sie aber mit einem Bruchteil der Datenmenge aus und funktionieren auch gut auf mobilen Endgeräten und bei niedriger Übertragungsgeschwindigkeit. Jquery Komponenten sind weniger Aufwand in der Programmierung als Flash, was sie zu dessen attraktiver Alternative für schmales Budget macht.

Neben ein paar verbessereungen zu HTML gibt es in HTML5 vorallem 2 Elemente, die für uns wichtig sind, Canvas, eine Javascriptbibliotek, die z.B. auch von Cufon verwendet wird und Pixelgesteuerte Grafik erlaubt, für Videospiele, Schriften oder dynamische erscheinungen wie Spiegelungen, Explosionen, Zerfallen oder Verdampfen, ein Bereich der bislang nur in Flash realisierbar war, und Dank Canvas gibt es jetzt ein Javaskript Framework dafür und zum 2. Das MediaItemObjekt, das geeignet ist für die Videoausgabe ebenfalls auf Flash zu verzichten und Internet Videos auch auf iPads oder iPhones spielbar zu machen.

Cufón

ist eine JQuery nahe Schriftrenderengine die es ermöglicht auch beliebige systemfremde Schriften ohne Bilder oder Flash aus der normalen Systemschrift zu generieren. Die Texte sind somit einfach im CMS einzupflegen und trotzdem muß auf eine grafisch perfekte Ausgabe nicht verzichtet werden. Benutzen sie die oben rechts angebotene Website Tour um Cufón in Action zu sehen. Ebenfalls Cufón gerendert, unser Hauptmenu.

AJAX(Asynchronous JavaScript and XML),

AJAX ist eigentlich ein Verfahrensbeschreibung, wie man Daten innerhalb einer Webapplikation bereitstellen kann, ohne das man die komplette Seite neu laden muß, sondern nur neu benötigten Daten nachgeladen werden können, wobei konkret die Art des Zusammenspiels zwischen schon lange im Web etablierten Technologien, von HTML bzw. XHTML, HTTP, Javascript, CSS, XML und JSON(Javascript Object Notation) beschrieben wird. Auch die viel zittierte Asynchronität, der Nachforderung von Daten, die dem Ausdruck zweifelsohne die Griffigkeit verleiht, ist eigentlich von Anfang an fester Bestandteil der einsetzbaren Techniken und zwar für alle HTML-Objekte die ein "src", also Quellen-Attribut haben, denn das Laden von einer "Source", war noch nie synchron. Seit Einführung des Bgriffs, etwa um 2005, wurden allerdings die Möglichkeiten vielfälltig und geziehlt erweitert und ergänzt. Seitdem, ist AJAX der Überbegriff, zur Beschreibung von Techniken, die sich dadurch auszeichnen, daß keine direkt an den Sever gerichtete Benutzeraktion, einen Datenversand des Servers auslöst, sondern eine eigentlich rein lokale Benutzeraktion, so implementiert wird, das sie zwangsläufig einen Abruf von notwendigen Daten nach sich ziehen muss. Da in diesem Fall der Server nicht direkt von der Aktion angesprochen wird, muss der Benutzer auch nicht warten, bis dieser geantwortet hat, um die Aktion abschliessen zu können, sondern die Daten müssen eben vom Server nachgereicht werden, sobald sie verfügbar sind, während der Benutzer mit der eigentlichen Aktion weitermachen kann, der Eindruck von Asynchronität des Datenversands, relativ zur Benutzeraktion, der hier entsteht, ist Namensgeber und verleiht einer solche Anwendung, eher das Handling einer lokalen Anwendung und weniger einer Webanwendung.

Es ist eventuel etwas schwierig das abstrakt zu erfassen, am besten lassen sich die Besonderheiten mit einem Beispiel veranschaulichen. Vorallem mit einem, das den Einsatz der AJAX Techniken direkt sicht- und spürbar macht, wie einem "Scroller" bei dem der Seiteninhalt nicht komplett vorgeladen wird, sondern erst beim "scrollen" der Seite vom Server nachgeladen wird, soweit er tatsächlich gebraucht wird. Die initialen Ladezeiten von Seiten mit langen Textfahnen und vielen Bildern lassen sich dadurch erheblich reduzieren.