iphone-ticker.de — Alles zum iPhone. Seit 2007. 18 981 Artikel
   

Offline, mit Icon und im Vollbild: Tipps für den Entwurf eigener Web-Applikationen

Artikel auf Google Plus teilen.
13 Kommentare 13

Zwar stehen interessierten Web-Entwickler bereits zahlreiche, komplett kostenlose Frameworks für die Programmierung eigener, iPhone-kompatibler Web-Applikationen zur Verfügung. Stellenweise bieten die Pakete (wie JQtouch oder Webapp-Net, um nur die beiden populärsten zu nennen) jedoch einen wesentlich größeren Funktionsumpfang, als vom Projekt benötigt. Hier helfen eine Hand voll Links und ein einfacher Texteditor. Denn: Gerade kleinere Web-Applikationen können problemlos auf die Integration eines umfangreichen Frameworks verzichten. Hier lassen sich Ladezeiten reduzieren – auf die Einarbeitung in fremden Code kann vollständig verzichtet werden.

Worauf wollen wir hinaus? Ein Beispiel:
Für den Einsatz unterwegs, haben wir eine iPhone-kompatible Version des MB-Spiels Wort-Tüftel gesucht. Aus zufällig gewürfelten Buchstaben, müssen hier mindestens vier Zeichen lange Wörter gebildet werden. Für jedes Wort gibt es einen Punkt. Doppelte Worte und Eigennamen zählen nicht. Nach der erfolglosen AppStore-Suche, bot sich der schnelle Entwurf einer Web-Applikation an. Und damit kommen wir zu den oben angekündigten Links.

wurfeln.jpg


Bildschirm-Ausrichtung, Zoom-Stufen und Co.: Hier von Apple beschrieben, erlaubt der HTML-Tag „Viewport“ das Setzen einer Hand voll Grundeinstellungen. Wie breit soll die Web-Applikation beim ersten Aufruf dargestellt werden? Darf der Besucher zoomen? Soll die Web-Applikation einen bestimmten Bereich bereits vergrößert darstellen? Der Support-Artikel „Configuring the Viewport“ klärt auf.

Unterstützung für den Vollbild-Modus: Ebenfalls von Apple definiert, lässt sich mit dem HTML-Tag „apple-mobile-web-app-capable“ festlegen, ob die Web-Anwendung auch im Vollbild, also ohne die MobileSafari-Adresszeile und ohne die sonst angezeigten Bedienelemete des Browsers, arbeiten können soll. Bradkellett erklärt den richtigen Einsatz des Tags in seinem Blog – Ajaxian die zusätzlich verfügbaren Optionen. Entscheidet man sich für den Vollbildmodus, muss die Applikation als Web-Clip auf dem Homescreen abgelegt werden um diesen auch zuzulassen.

Das richtige Icon: Soll die auf dem Homescreen abgelegte Web-Applikation mit einem eigenen Icon ausgestattet werden, hilft auch hier das passende HTML-Tag bzw. ein richtig benanntes Bild. Liegt eine „apple-touch-icon.png“-benannte Grafik-Datei im Root-Verzeichnis des Web-Servers greift das iPhone automatisch darauf zu und benutzt das Bild als Icon. Alternativ lässt sich das zu verwendende Icon im Quelltext der Web-Applikation definieren. allinthehead beschreibt beide Möglichkeiten.

OnTouch statt OnClick: Wer mit Javascript arbeitet – der intelligente Kern fast aller Web-Applikationen – sollte sich die auf cubiq.org abgelegten Ausführungen zum OnTouch-Event durchlesen. Das Javascript-Ereignis kann Verzögerungen bei der Interaktion mit der Web-Applikation ausmerzen und lässt sich relative einfach implementieren

Auch offline verfügbar: Bis zu 5MB an Daten lassen sich auf dem iPhone ablegen und ermöglichen euren Web-Applikationen, so auch im Flugmodus weiter zu arbeiten. Eine „Cache Manifest“ genannte Text-Datei definiert hier, welche Dateien auf dem iPhone gespeichert werden sollen und lässt sich sowohl dynamisch als auch von Hand erstellen. Richtig gute Anleitungen zum Thema gibt es bei thecssninja und auf kentbrewster.com.

Sicher. Unsere Tipps kratzen bislang nur an der Oberfläche und sind weit entfernt von Web-Applikationen wie Pie Guy– für die auch offline einsatzbereite Wort-Tüftel Applikation, hat es jedoch gereicht. Empfehlenswerte Links, sind in den Kommentaren gern gesehen.

Dienstag, 29. Dez 2009, 17:25 Uhr — Nicolas
13 Kommentare bisher. Dieser Unterhaltung fehlt Deine Stimme.
Rede mit!
  • Also für mich als „neuling“ klingt das ganze recht interessant.mal schaun was draus wird.lg

  • Vielen Dank für die Links ;)

    Ich habe leider festgestellt das sich ein Radiostream, den man aus einer fullscreen geöffneten Seite öffnet, nicht im Hintergrund ausführen lässt.

    Anders als es direkt aus dem Safari möglich ist.

    Somit war meine Webapp gestorben^^

    gruß

    • Expertenmeinung

      Wie wäre es mit http://iphonetuner.de/ ???

      Läuft übrigens in der Regel stabiler als die Apps der einzelnen Radiostationen!

      Radio läuft im Hintergrund, kannste andere Sachen gleichzeitig auf deinem iPhone erledigen!

      • Ja iphonetuner kenne ich auch^^

        nur wollte ich eine kleine webapp für ein bestimmtes Radio basteln;)

        und nicht so eine ganze Sammlung.

        Falls jemand zufällig weiß wie man soetwas löst, bitte hier antworten.

      • Expertenmeinung

        Schreib den Macher der App an, er wird deine Stream-Adresse gerne einpflegen. So würde ich das zumindest machen – geht wohl schneller… welchen Sender meinst du denn?

  • verstehe ich das richtig, damit kann man eigene Webapplikationen herstellen?

    Ich das schwer?

    • Expertenmeinung

      Ich relativ schwer :)

      Wer du damit bisher gar nichts am Hut hattest, solltest du dich erst gar nicht damit beschäftigen. So nebenbei in 5min kann man auch mit den angesprochenen Hilfen als Laie (dazu zähle ich mich auf diesem Gebiet natürlich trotz einiger Bemühungen auch) keine tollen Anwendungen zaubern, die zu ewigem Reichtum, Ruhm, Girls usw… führen wird.

      Mindestens in HTML-Programmierung solltest du den Durchblick haben!

      • HTML ist keine Programmiersprache!!!
        HTML ist eine Codiersprache. Javascript wäre die Programmiersprache.

      • Expertenmeinung

        Das ist sicherlich richtig – ich habe mich nur ungenau ausgedrückt und werde mich natürlich deswegen gleich selbst auspeitschen – nur, damit die Anwendung halbwegs nach was aussieht, sind wohl HTML-KENNTNISSE (besser so, Meister?) nicht verboten, oder? :)

      • Gibts sowas auch für mac?!

  • Hmm, die nötigen Kenntnisse habe ich. Nur was soll ich denn entwickeln? Ich wüsste nichts. Würde sowas aber gerne mal machen.

  • Redet mit. Seid nett zueinander!

    Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind markiert *

    ifun.de ist das dienstälteste europäische Onlineportal rund um Apples Lifestyle-Produkte.
    Wir informieren täglich über Aktuelles und Interessantes aus der Welt rund um iPad, iPod, Mac und sonstige Dinge, die uns gefallen.
    Insgesamt haben wir 18981 Artikel in den vergangenen 3315 Tagen veröffentlicht. Und es werden täglich mehr.
    ifun.de — Love it or leave it   ·   Copyright © 2016 aketo GmbH   ·   Impressum   ·   Datenschutz   ·   Auf dieser Seite werben aketo GmbH Powered by SysEleven