Navigation und Service

Raster

Die Darstellung mobiler Webseiten wird durch zwei Faktoren bestimmt: erstens die physische Größe und zweitens die Auflösung. Die Auflösung beschreibt die Anzahl der dargestellten Pixel (Pixeldichte).

Für den Seitenaufbau wird ein 6-spaltiger Grundraster eingesetzt. Innerhalb dieses Rasters werden die Inhaltselemente ausgerichtet. Die Website wird mittig im Browserfenster angezeigt.

Version 1 (320 x 480 px)

Auflösung 320 x 480 px, Pixelverhältnis  1:1

Die Breite einer Spalte beträgt 40 px, der Abstand zwischen den Spalten 10 px. Die sechs Spalten verlaufen über eine Breite von 290 px.

Dieser Raster ist auf folgenden Geräten verwendbar:

  • Android 2.3, 4.0, 4.1

  • Android 4.2 mit Samsung Galaxy S2

  • Samsung Galaxy S3

  • Google Nexus 4

  • iOS 3 und iOS 4.2.1 mit iPhone 3G, 3GS

  • iOS 5 mit iPhone4/iPhone 4s

Alle Maßangaben in Pixel Alle Maßangaben in Pixel

Darstellung im Hoch- oder Querformat

Die Abbildung zeigt die Raster-Darstellung im Hoch- oder Querformat

In der hochformatigen Darstellung werden die Inhalte vertikal ausgerichtet. Die Mindestbreite beträgt im Hochformat 320 px.

In der querformatigen Darstellung werden die Inhalte horizontal ausgerichtet und in einer Mindestbreite von 480 px angezeigt. Im Querformat wird der 6-spaltige Grundraster proportional skaliert und die Spaltenbreite erhöht sich dementsprechend.

Version 2 (640 x 960 px)

Auflösung 640 x 960 px, Pixelverhältnis 1:2

Die Breite einer Spalte beträgt 80 px, der Abstand zwischen den Spalten 20 px. Die sechs Spalten verlaufen über eine Breite von 580 px.

Dieser Raster ist auf Geräten ab iOS6 mit iPhone 5 verwendbar.

Alle Maßangaben in Pixel Alle Maßangaben in Pixel

Darstellung im Hoch- oder Querformat

Die Abbildung zeigt die Raster-Darstellung im Hoch- oder Querformat

In der hochformatigen Darstellung werden die Inhalte vertikal ausgerichtet. Die Mindestbreite beträgt im Hochformat 640 px.

In der querformatigen Darstellung werden die Inhalte horizontal ausgerichtet und in einer Mindestbreite von 960 px angezeigt. Im Querformat wird der 6-spaltige Grundraster proportional skaliert und die Spaltenbreite erhöht sich dementsprechend.