HTML5 Mobile

Font Awesome: Skalierbare Vektor-Icons

Font Awesome ist kostenlose Bibliothek mit über 350 Icons, die sehr einfach eingebunden und verwendet werden kann.


Beispiel-Icons

weiterlesen →

Web-Formulare: Autokorrektur deaktivieren

Im folgenden Artikel wird kurz erklärt, wie die Autokorrektur bei Formularfeldern deaktiviert werden kann.

weiterlesen →

Viewport resizer: Responsive Webdesign testen


Bookmarklet

Viewport Resizer ist ein kleines Browser-Bookmarklet, das beim Testen und Betrachten von Websites mit Responsive Webdesign hilft.

weiterlesen →

Performance-Studie: Wie schnell sind Websites beim mobilen Zugriff wirklich?

Eine aktuelle Studie von strangeloop enthält interessante Anhaltspunkte über die Performance von mobilen Websites. Im Juli und September 2012 wurden mit aktuellen Geräten (iPhone 4 + 5, iPad 2, Samsung Galaxy S + S3 + Tablet) über 200 E-Commerce-Sites getestet. Die Fragestellung lautet dabei hauptsächlich, wie die Performance über eine Mobilfunkverbindungen ist.

Einige Erkenntnisse sind beispielsweise:

Darüber sind noch einige Statistiken enthalten, die über die reine Performance hinausgehen (z.B. wie viele Websites sind nicht mobile-optimiert? Wo werden Tablets hingeleitet? etc.).

weiterlesen →

Android: Remote Debugging mit Chrome

Nach dem Artikel über Remote Debugging in iOS6 folgt eine kurze Anleitung, wie man ein solches Remote Debugging auch auf einem Android-Gerät durchführen kann.

weiterlesen →

Neu in iOS6: Image-Sets

Ich hatte bereits erklärt, wie man Bilder für das Retina-Display optimiert. Neu in iOS6 ist eine vereinfachte Syntax, um die Bilder in unterschiedlichen Auflösungen anzugeben.

weiterlesen →

Adobe Edge Web Fonts: Über 500 kostenlose Schriften

Mit Adobe Edge Web Fonts startet Adobe einen neuen kostenloses Webfonts-Service.

Adobe Webfonts
Neues Mitglied in der Adobe-Familie: Der Webfont-Dienst Adobe Edge Web Fonts

weiterlesen →

iOS6: Remote Debugging

Mit dem kürzlich erschienen iOS6 wurde endlich eine vernünftige Remote-Debugging-Lösung geschaffen, um eine Website zur Laufzeit zu untersuchen (wie von Firebug oder Web-Inspector auf dem Desktop gewohnt).


Remote Debugging: Der Web Inspector auf dem Rechner zeigt die Inhalte von Mobile Safari

weiterlesen →

So geht’s: Neues Smart App Banner für iOS6 einbinden

Mit iOS6 führt Apple die Smart App Banner ein. Im Folgenden der notwendige Quellcode, wie man dieses App-Werbebanner in die eigene (mobile) Website einbindet.

weiterlesen →

Retina-Display: HTML-Canvas optimieren

Viele HTML-Elemente von mobilen Websites werden automatisch auf Geräten mit Retina-Display optimal dargestellt. Nicht jedoch das canvas-Element.

Das HTML-Element canvas (vom engl. Wort für Leinwand) ist eine Fläche, auf der mit JavaScript gezeichnet werden. So werden beispielweise Grafiken, Linien, Kreise, Bèzierkurven oder Farbverläufe unterstützt. Wie auch Website-Bilder (PNG, JPG) für das Retina-Display optimiert werden müssen, so ist dies auch für canvas-Elemente auf iOS-Geräten erforderlich.

Es folgt ein Überblick, wie man das Canvas-Element für iOS optimiert — und dabei auch bereits die neuen MacBooks mit Retina-Display berücksichtigt.

weiterlesen →