HTML5 – Offline Applikationen

Oliver Lorenz — Tue, 14 Jun 2011 21:37:21 +0000

HTML5 bringt den Entwicklern eine ganze Menge neue Möglichkeiten. Eine der interessantesten Spezifikationen ist die “Offline Web Applications API” die den Entwicklern die Möglichkeit gibt Applikationen zu erstellen die vollständig oder teilweise offline genutzt werden können.

Komponenten

Voraussetzungen in der HTML-Datei

Die Offline Web Applications API wird mit dem HTML5-Standards implementiert, ist also nur in modernen Browsern verfügbar, die HTML5 bereits unterstützen. Dazu ist es notwendig, dass dem Browser über den Doctype zu verstehen gegeben wird, dass es sich um eine HTML5 Webseite handelt. Dazu muss der Doctype folgendermaßen aussehen:

Ist diese Voraussetzung gegeben, muss dem Browser mitgeteilt werden, dass diese Webseite zu cachende Elemente enthält. Dazu wurde im Zuge von HTML5, das Element mit dem Attribut “manifest” erweitert. Das Attribut enthält als Wert einen frei definierten Dateinamen oder Pfad zu einer Datei, die Informationen zum Cache enthält – Die so genannte manifest-Datei.

Eine vollständig vorbereitete HTML-Seite könnte folgendermaßen aussehen:

<html manifest="offline.manifest"> <head> <title>Offline-Page</title> </head> <body> <h1>Headline</h1> <img src="image.png" /> <p>Lorem ipsum dolor sit amet ...</p> </body> </html>

Die Manifest-Datei

Die Wikipedia definiert ein Manifest folgendermaßen:

Manifest, eine öffentliche Erklärung von Zielen und Absichten, oftmals politischer Natur

Die Manifest-Datei beschreibt in unserem Falle genau, welche Dateien im Cache gespeichert werden sollen, und welche nicht. Dabei ist die Datei nach einem bestimmten Schema aufgebaut, und in verschiedene Sektionen unterteilt.

Eingeleitet wird die Datei mit der Zeile:

CACHE MANIFEST

Darunter werden die verschiedenen Sektionen definiert. Jede Sektion hat dabei ihre eigene Augabe. Der NETWORK-Bereich definiert die Dateien, die nicht im Cache gespeichert werden sollen. Im Gegensatz dazu definiert der CACHE-Bereich, die Dateien, die im Cache gehalten werden sollen. Die definierten Dateien können dabei absolute Pfade und URLs beinhalten. Ein Beispiel:

CACHE MANIFEST NETWORK: login.php CACHE: image.png

Zu beachten ist weiterhin, dass die Manifest-Datei mit dem Content-Type “text/cache-manifest” ausgeliefert werden muss. Das kann entweder im Webserver anhand des Dateityps, oder im Skript selbst definiert werden.

Ergebnis

Ruft man die HTML-Seite nun ein mal auf, wird diese lokal im Brower abgelegt. Geht man nun offline und ruft die gleiche URL noch einmal auf, wird die Seite wie gewohnt angezeigt, da die Daten aus dem Cache genutzt werden. Damit ist es möglich, Applikationen zu entwickeln, die JavaScript-gestützt vollständig offline funktionieren.

Weiterführende Links:

http://dev.w3.org/html5/spec/Overview.html#offline

Relaunch oliverlorenz.com

Oliver Lorenz — Sat, 11 Jun 2011 16:07:52 +0000

Heutzutage ist es wichtiger als jemals zuvor, sich optimal im Web zu präsentieren. Besonders für Personen die sich beruflich in der IT- oder Web-Branche bewegen, wird es zunehmend .

Aus diesem Grund habe ich mich entschlossen diese Webseite neu aufzuarbeiten. Die Domain besitze ich schon eine ganze Weile. Diese wurde bisher aber nur im verborgenen zu eigenen Zwecken genutzt. Zum ersten möchte ich diese Seite nutzen um Menschen die Möglichkeit zu geben etwas über mich zu erfahren. Klar gibt es viele Social-Networks wie Xing oder Facebook um mit mir in Kontakt zu treten, mit einer professionellen Webseite kann man sich aber auch heute noch von der grauen Masse abheben. Dazu habe ich einen eigenen Bereich angelegt der sich mit meiner Person beschäftigt.

Profilbereich

Ich empfehle das Profil in zwei Bereiche einzuteilen. Einen öffentlich zugänglichen und Passwortgeschützten Bereich für detailiertere Informationen.

In meinem Fall beherbert der öffentliche Bereich ein aktuelles Bild, eine Beschreibung meiner Person und zu meinen Interessen. Damit gebe ich den Leuten einen groben Überblick zu meiner Person. Für die meisten Fälle ist das vollkommen ausreichend.

Der geschützte Bereich beinhaltet detailiertere und persönliche Informationen und ist mit einem Passwort geschützt. Damit kann ich verhindern, dass Informationen in die falschen Hände geraten. Trotzdem kann ich vereinzelten Personen die Möglichkeit geben, mehr über mich zu erfahren.

Blogbereich

Der Blogbereich ist öffentlich zugänglich. Hier möchte ich den Leuten einen Einblick in die Themen geben, mit denen ich mich beschäftige und mein erworbenes Wissen teilen.

Zusammenfassend möchte ich sagen, dass die Webseite ein Bild von mir skizzieren soll. Optisch und Inhaltlich wird sie sich sicherlich noch weiterentwickeln