Mobile Website schnell erstellt [Praxisbeispiel]

Joel Sutherland von New Media Campaigns zeigt, wie man eine mobile Website als Frontend für einen Webservice programmieren kann, ohne sich dabei an ausgewachsenen Frameworks die Flügel zu brechen. Für die populäre Hacker News Website erstellte Sutherland eine kleine Web App und verwendete dabei vergleichsweise einfache Techniken und Werkzeuge.

Mobile Website zeigt Hacker News auch auf dem Smartphone

Hacker News ist eine Quelle interessanter Informationen rund um die nerdigen Webthemen. Betrieben wird der Service von Risikokapitalgeber YCombinator. Auf den ersten Blick scheint der News Aggregator nahezu perfekt für mobile Geräte geeignet zu sein. Immerhin handelt es sich eh nur um eine tabellarische, minimalistische Auflistung von Nachrichten.

Ruft man Hacker News allerdings mittels eines Smartphones auf, so zeigt sich das folgende eher weniger nutzerfreundliche Bild:

mobile website ycombinator
Mobile Website: Hacker News in der Originalversion, nicht komfortabel nutzbar

Die unbefriedigende Darstellung der Hacker News auf dem Smartphone liegt an der Verwendung von tabellenbasiertem Layout. Die Verfügbarkeit einer API gab den letzten Anstoß zur Umsetzung. Gründe genug für Sutherland, eine dedizierte Mobil App als Frontend zu bauen. Diese stellt sich weit augenfreundlicher dar:

mobile website jquery
Wirklich mobile Website: Hacker News in Sutherlands mobiler Version

Die gesamte Funktionalität der Mobil App beruht auf client-seitiger Verarbeitung. Javascript ist entsprechend das Herz der Anwendung. Nun hätte sich Sutherland für oder ein anderes ausgewachsenes Framework für Smartphones entscheiden können. Er tat es nicht.

Stattdessen entschied er sich für die Entwicklung auf der Basis von HTML/CSS/jQuery, gerade so als wollte er eine Desktopanwendung entwickeln. Nach seiner Auffassung entsprach es eher seiner Vorstellung von Produktivität als sich mit der speziellen Syntax spezieller herumschlagen zu müssen.

In seinem recht ausführlichen Beitrag zum Thema beschreibt er exakt seine Vorgehensweise. Ich denke, das Ergebnis spricht für sich. Entwickler, die vor der Entscheidung stehen, auf welcher Basis sie das nächste Web App Projekt angehen wollen, sollten auf jeden Fall mal bei Sutherland vorbeischauen.

Weitere Artikel zu Mobile Website und Frameworks

Das interessiert dich bestimmt auch

5 Answers

  1. von greenbanana 21.09.2011 (19:13Uhr) 1.

    Ist jQuery kein ausgewachsenes Framework? Und wenn jQuery schon eingesetzt wird, dann wäre der Schritt zu jQuery-Mobile also nicht weiter gross... Oder?

  2. von dpetereit 21.09.2011 (19:56Uhr) 2.

    Nach Auffassung Sutherlands schon. Was dann nachvollziehbar ist, wenn er ohnehin jQuery verwendet für die Desktopentwicklung. Im Beitrag erläutert er, was ihn abhielt, jQuery Mobile zu verwenden.

  3. von Mobile Website schnell erstellt [Praxisb… 21.09.2011 (20:56Uhr) 3.

    [...] Weiterlesen bei t3n >> [...]

  4. von manuw 22.09.2011 (13:23Uhr) 4.

    Wäre schön wenn t3n auch eine Seite optimiert für Smartphones hätte :(

  5. von Google GoMo – Analyse mobiler Websites… 02.11.2011 (18:44Uhr) 5.

    [...] Mobile Website schnell erstellt [Praxisbeispiel] - t3n News [...]

Deine Meinung


(wird nicht veröffentlicht)