iOS: Links zu nativen Apps aus dem Browser heraus

In mobilen Websites oder Web-Apps kann es vorkommen, dass man gerne auf native Apps verlinken möchte. Ob Telefonnummer wählen, SMS schicken oder Facebook-App öffnen: Dies alles funktioniert üblicherweise über spezielle URLs, bei denen das http durch ein anderes Kürzel ersetzt wird (sogenannte URL-Schemes).

Hier einige Aktionen, die man per Link aus dem mobilen Safari-Browser (iPhone und iPad) auslösen kann:

  • Email: Der Email-Client auf dem iPhone öffnet sich und man kann eine Email schreiben.
  • Telefon: Wählen einer Telefonnummer.
  • SMS: Senden einer SMS an eine Telefonnummer
  • Maps: Aufrufen der nativen Karten-App (Google Maps)
  • YouTube: Öffnen eines YouTube-Videos in der nativen YouTube-App.
  • Facebook: Öffnen der App und Anzeigen von bestimmten Inhalten

Der folgende Artikel zeigt, wie dies auf Apples iOS-Betriebssystem funktioniert. Auf einem iOS-Gerät kann man dies auch direkt an diesem Beispiel ausprobieren, das ich zu Demozwecken erstellt habe: Demo mit iOS-URL-Schemes.

iOS: Links zu nativen Apps aus dem Browser heraus weiterlesen

Swiffy: Flashanimation zu HTML5 konvertieren

Google hat ein webbasiertes Tool mit Namen Swiffy veröffentlicht, das Flashinhalte in HTML5 konvertiert. So kann man diese Inhalte auch ohne Flash anschauen, z.B. auf dem iPhone oder iPad.

Wie auch Adobes Tool Wallaby kann man hier keine komplexen Flashanwendungen konvertieren, sondern hauptsächlich einfachere Animationen (z.B. Banner). Im Gegensatz zu Adobe wird jedoch nicht die Quelldatei (.fla) konvertiert, sondern das fertige SWF.

Swiffy: Flashanimation zu HTML5 konvertieren weiterlesen

Safari 5: JavaScript-Debugging mit dem Web Inspector

Mit dem Erscheinen von Safari 5 ist selbstverständlich auch eine neue Version des Web Inspector enthalten. Er dient zum Analysieren und Debuggen von Webseiten (ähnlich dem Firebug-Plugin für Firefox).

The Web Inspector gives you quick and easy access to the richest set of development tools ever included in a browser. From viewing the structure of a page to debugging JavaScript to optimizing performance, the Web Inspector presents its tools in a clean window designed to make developing web applications more efficient.

Als Flashentwickler ist man es gewohnt, einen Debugger zu haben. Das entsprechende JavaScript-Pendant findet man in Safaris „Web Inspector” – und dieser wurde weiter verbessert in Safari 5. Hier eine kurze Anleitung, wie man mit dem neuen Web Inspector Breakpoints setzen kann und Variablenwerte direkt aus dem Code ausliest.

Safari 5: JavaScript-Debugging mit dem Web Inspector weiterlesen

Einführung: Videos einbinden mit HTML 5

HTML 5: Video Tag Beispiele

Der video-Tag ist eine Neuerung von HTML 5 und dient dazu, Filme und Videos abzuspielen. Videos können – wie Bilder mit dem img-Tag – direkt in eine HTML-Seite eingebettet werden. Selbstverständlich können die Videos deshalb auch mit CSS und JavaScript kombiniert werden.

Nach den ersten Video-Tag Demos mit HTML 5 wird in diesem Artikel gezeigt, wie man Videos selbst einbaut und den video-Tag aus HTML 5 mit aktuellen Browsern bereits einsetzen kann.

Einführung: Videos einbinden mit HTML 5 weiterlesen

HTML 5: Video-Tag Demos von YouTube und Daily Motion

Die kommende HTML-Version 5 enthält einen <video>-Tag. Dieser erlaubt es, ein Video auf die gleiche Art und Weise einzubinden, wie dies auch mit Bildern in HTML geschieht.

Zum Abspielen sind dann keine Browser-Plugin wie z.B. Silverlight oder Flash Player nötig. Welche Codecs abgespielt werden, hängt vom Browser bzw. vom System ab.

HTML 5: Video-Tag Demos von YouTube und Daily Motion weiterlesen

„XML View Plugin” für Safari

„XML View Plugin” ist ein nützliches Plugin für Safari. Es vereinfacht die Betrachtung von XML-Dateien in Safari, denn wer kennt dieses Problem nicht: Man öffnet eine XML-Datei in Safari und sieht im Browserfenster lediglich die Textinhalte der Elemente. Von einer 100-zeiligen XML-Datei bleibt so z.B. nur dieser Einzeiler übrig:

Safari XML ohne Plugin

Um die kompletten Rohdaten des XML-Files zu sehen, muss man mit „View > View Source” ein neues Fenster öffnen. Unnötig und umständlich. Bei anderen Browsern wie Firefox ist dieser Schritt auch nicht erforderlich.

„XML View Plugin” für Safari weiterlesen