Webseiten erstellen mit jQuery Mobile

CIDEC on iPhone

Jetzt soll man also Mobil-Webseiten für jeden Smart-Phone-Typ einzeln programmieren? Es locken Apple mit iOs, Google mit Android, Microsoft mit Windows Phone 7 und HP mit WebOs. Wäre es nicht wirtschaftlicher, weniger Programme zu schreiben um mehr zu erreichen, stabil, flexibel und für alle wichtigen mobilen Betriebssysteme?

Zeit für Web-App Entwicklung

Mit Web-App-Entwicklungsplattformen geht das. Die Idee, Programme ausserhalb der jeweiligen Geräteumgebung zu erstellen ist nicht neu - Sprout Core z.B. gibt es schon länger und selbst Apple nutze es. Jetzt ist das Thema wieder aktuell. Mit Werkzeugen, die wir bereits von herkömmlichen Webseiten kennen: HTML5, CSS3 und Javascript können dem Programmierer die Möglichkeit geben, viele Funktionen für Mobiles zu nutzen (leider nicht alle), ohne sich den Herstellern direkt zu verpflichten und dennoch ansehnliche Resultate zu erzielen.

Web-App Frameworks gibt es mittlerweile einige.

• das beliebte und kompakte iWebKit
• das mehr Javascript-lastige jQTouch
• das mächtige, aber etwas 'überengineerte' sencha Touch
• das bekannte jQuery, ergänzt zu jQuery Mobile

jQuery Mobile ist fähig, eine Webseite auf Smart Phones (iPhone, Android...) 'iPhone-like' für die Finger-Bedienung darzustellen. Umfangreiche API's und Komponenten können dem Programmierer die Möglichkeit bieten, beispielsweise

• optimierte Layouts und Vorlagen (Listen, Buttons...) zu nutzen
• AJAX-gestützte Seiten oder Applikationen zu erstellen
• eine einzige Seite zu verwenden oder auf einzelne Seiten zu verweisen
• jedes gültige HTML-Tag einzugeben (z.B. Charset 'UTF-8' für Umlaute)
• Daten-Rollen einzugeben ('page', 'header', 'content', 'footer'...)

Doch das ist noch nicht alles. Mobjectify kann dem Programmierer die Möglichkeit bieten, JQuery Mobile - Mockups zu erstellen.

Bekanntlich betreibt CIDEC einen Blog (Blogger) und eine einfache Webseite bei Google Apps Site. Während sich Blogger bereits seit längerem auch mobil ansehnlich präsentiert, ist nun auch das mobile Layout für Google Sites ähnlich gestaltet. Deshalb ist sie nicht mehr mit jQuery Mobile erstellt. [Nachtrag vom 25. Okt. 2011]

Ein Web-Konto speichert beispielsweise die Seite (Cloud Computing). Bei Aufruf ist ein User Agent fähig, den aufrufenden Browser zu bestimmen und eine entsprechende Version darzustellen (Mobile oder Desktop).

Falls man im Blog CIDEC oben in der Menuleiste auf 'www.cidec.ch' klickt, wird die Seite entsprechend dem verwendeten Gerät dargestellt (Smart-Phone oder Desktop).