HTML5 wird bzw. ist bereits der neue Web-Standard sein.
Welche neuen Möglichkeiten ergeben sich dadurch?
Wie kann man ältere Browser HML5-tauglich machen?
Hier erhalten Sie die dazugehörigen Antworten auf diese Fragen.
In den vorherigen Blogbeträge habe ich mehr nebensächlich darauf hingewiesen, bei der Verwendung von localStorage auch auf die Datensicherheit zu achten. Diese Thematik möchte ich an dieser Stelle vertiefen.
Im Folgenden sind die wesentlichen Schritte anhand eines Formulars (Vorname / Nachname) aufgezeigt, um in den localStorage zu schreiben und um Daten wieder heraus zu lesen. Das komplette lauffähige localStorage-Beispiel ist natürlich auf dieser Website hinterlegt und kann getestet oder am Ende dieser Webseite heruntergeladen werden.
LocalStorage dient zur Offline-Speicherung von Daten im Browser und setzt einen modernen HTML5-fähigen Browser voraus. Der Vorteil von localStorage besteht u.a. darin, dass deutlich größere Datenmengen clientseitig gespeichert werden können, als z.B. mit Cookies. Die Datenmengen sind browserabhängig (z.B. bis 5MB im Firefox, 10MB im IE). Somit kann der Traffic zwischen Server und Client signifikant verringert werden. Dies ist besonders im Umfeld von mobilen Webapplikationen bzw. mobilen Apps interessant. Es ist sogar möglich, z.B. Spiele komplett offline laufen zu lassen.
YouTube empfiehlt seine Videos per iframe einzubinden. Dadurch wird sichergestellt, dass in den verschiedenen Browserfamilien (z.B. Mozilla, IE, Safari, mobile Browser) das Video jeweils korrekt dargestellt wird. Leider ist der Code für die Einbindung nicht w3c valide. Insbesondere die frameBorder-Property stellt eine gewisse Hürde dar.
Der Internet Explorer 11 unter Windows 8.1 bietet zwei Bedienoberflächen. Einmal die „herkömmliche“ Browseroberfläche und zusätzlich eine touchoptimierte Oberfläche. Wenn der Internet Explorer 11 mit der touchoptimierten Oberfläche aufgerufen wird, sucht der Browser automatisch nach der browserconfig.xml.
Hover-Effekte für Links oder Menüleisten mit CSS zu realisieren sind sicherlich nicht sonderlich kompliziert. Doch wenn es etwas mehr sein soll, z.B. ein hover-Effekt für den Hintergrund (background) einer Menüleiste und gleichzeitig für das Menü-Icon, ist es schon nicht mehr ganz so trivial. Nachfolgend möchte ich die notwendigen Schritte in einem kleinen Tutorial kurz erläutern.