Canvas (auf deutsch: "Leinwand") ist ein HTML-Element, auf dem per JavaScript-Programmierung gesteuerte Zeichenoperationen möglich sind.
Die Zeichenfläche kann neben einfachen Grafik-Elementen auch Bitmap-Elemente darstellen, beispielsweise Ausschnitte aus
größeren Panorama-Bildern.
Canvas-Implementierungen bieten derzeit 2 grundverschiedene sog. Kontexte an:
2D: |
Unterstützt einfache 2-dimensionale Grafikausgaben und Transformationen.
Wird von allen HTML5-Browsern implementiert. |
WebGL: |
Unterstützt 3-dimensionale Grafikausgaben. Verwendet Hardware-Grafik nach dem von der Khronos Group
definierten WebGL-Standard und kann dadurch besonders schnell sein. Wird derzeit von den meisten HTML-Browsern in brauchbarer
Qualität implementiert. |
Touchscreen-Eingaben
Dies ist ein aktuelles Thema für Tablet-Computer, mobile Tablets und Smartphones.
Verglichen mit Maus-Eingaben traditioneller Computer sind Touch-Eingaben stark interpretationsbedürftig:
Sie können sich auf ein bestimmtes auf dem Bildschirm sichtbares Element beziehen,
aber auch als Gesten beispielsweise zum Blättern, Scrollen oder Zoomen der Seite gemeint sein.
Praktisch alle Browser für Mobilgeräte erkennen Touch-Eingaben.
Weniger praktisch ist, dass einige Browser proprietäre Schnittstellen implementiert haben, die von den Empfehlungen des W3C
deutlich abweichen. Zudem scheint die parallele Verarbeitung von Eingaben und rechenintensiven Ausgaben für einige Browser
auf leistungsschwächeren Mobilgeräten noch schwierig zu sein.
Bewegungen
Die meisten aktuellen Mobilgeräte verfügen über Beschleunigungssensoren und Gyroskop/Magnetometer.
Die daraus gewonnenen Daten könnten theoretisch zur Steuerung von räumlich orientierten Website-Inhalten herangezogen werden.
Praktisch zeigten unsere Android-Tests, dass das deviceOrietation-API zusammen mit dem Fensterausrichtungs-API
mehr oder weniger brauchbar sind, das deviceMotion-API dagegen weniger.
Hier hat es seit den Zeiten früherer Android-Versionen Verbesserungen bei der Hard- und Software gegeben.
Noch nicht zufriedenstellend ist aus unserer Sicht manchmal die Qualität der Magnetometer-Daten (Kompass)
und der Versuche, Sensor-Fehler per Software zu kompensieren.
Immerhin verwenden die getesteten Browser einheitliche W3C-Schnittstellendefinitionen.
Für einen subjektiv realistischen Eindruck etwa per VR-Brille reichen die im Browser verfügbaren Bewegungsdaten inzwischen -
schauen Sie sich die Bilder aus der Panorama-Galerie mal mit einer Smartphone/VR-Brillen-Kombination an!
Mobilgeräte
Aktuell ist eine deutliche Verschiebung der Benutzergewohnheiten im Gange: Weg von traditionellen Computern (Desktop, Notebook),
hin zu kleineren Mobilgeräten (Smartphone, Tablet). Darauf müssen sich auch Web-Anbieter einrichten.
Aus Entwicklersicht gibt es ein paar signifikante Unterschiede:
Traditionelle PCs: |
Abgesehen von älteren Netbooks, verfügen diese über leistungsstarke Prozessoren und zusätzlich
schnelle Grafik-Hardware. In der Regel werden sie per Tastatur, Maus oder Touchpad (als Maus-Ersatz) gesteuert, nicht per Touchscreen-Eingabe.
Die Performance und Stabilität der verfügbaren Browser sind recht gut. |
Mobilgeräte: |
Diese werden durchweg per Touchscreen gesteuert.
Die Qualität und Performance neuerer Geräte ist durchaus mit Desktop-PCs vergleichbar.
Ältere Geräte sind gelegentlich noch mit langsameren Prozessoren ausgestattet,
und bei einigen Browsern sind WebGL- und Touch-Unterstützung noch nicht ausgereift. |
Was bringt die Zukunft?
Wir erwarten weitere Fortschritte bei der Qualität, Stabilität und Performance von Mobil-Browsern in naher Zukunft,
wie auch bei der Hardware-Performance von neueren Mobilgeräten.
Da die Entwicklung von Betriebssystem-spezifischen Apps aufwändig ist und das WWW ohnehin die gemeinsame Plattform
für fast alle Anwender ist, ist es nur folgerichtig, für grafisch orientierte, interaktive Anwendungen
wie Panorado JS die neuen Möglichkeiten von HTML5 zu nutzen.
| |