Mobile-Tutorials - nun auch vom Smartphone aus optimiert erreichbar

Dank der strikten Trennung von Design und Inhalt mittels der Auslagerung aller Designelemente in die CSS-Dateien war Mobile-Tutorials bereits von Anfang an gut für den Besuch von mobilen Geräten aus geeignet. Dies allerdings nur, wenn der Handheld die CSS-Dateien ignorierte, was bei den meisten Browsern geschieht, indem man die Darstellung an das Display optimieren lässt.

Versuchte der mobile Browser aber, das Design so wie ein Desktop-Computer darzustellen, war die Wahrscheinlichkeit groß, dass er das Layout komplett zerstört.

Seit gestern erhalten Webbrowser auf Handys oder Smartphones nun ein eigenes Stylesheet. Es deaktiviert einige Objekte, wie beispielsweise die seitliche Leiste mit den Recommended Links und stellt dafür einige sinnvolle Elemente dar, die dem Desktop-Besucher verborgen bleiben. Beispiel dafür ist ein Link, der die Navigation überspringt und direkt auf den Hauptinhalt verweist.

Optisch verändert das Stylesheet nur einige Farben und Schriftarten, sodass es für den Browser kein Problem darstellt, das Design an die Größe des Displays anzupassen. Wird keine Seite mit größeren Grafiken aufgerufen, entfallen auch horizontale Scrollbalken.

Dank der geringen Größe des Stylesheets (kleiner als 1 KB) verbraucht der Besuch auf dieser Seite erfreulich wenig Transfervolumen - die HTML-Datei selbst ist meistens nur um die 8 KB groß.

Abschließend noch ein Screenshot der News-Seite auf meinem Nokia 6680 mit dem Standardbrowser: