Die nachfolgenden Bildschirmkopien zeigen ein Browserfenster in dem wiederum ein kleineres Fenster mit den Inhalten ist. Dieses kleinere Fenster simuliert die Ansicht der Seiten auf Geräten unterschiedlicher Auflösungen.

Layout auf einem Smartphone

Auf einem Smartphone ist das Layout einspaltig, das heißt alle Kategorien sind untereinander aufgelistet. So steht die volle Gerätebreite als Textbreite zur Verfügung und der Text ist gut lesbar.

Layout auf einem Tablet

Auf einem Tablet steht horizontal mehr Platz zur Verfügung. Daher wird je nach verfügbarer Breite ein Layout gewählt, das zwei, drei oder vier Spalten breit ist. Die einzelnen Inhaltselement sind wie Kacheln gegeneinander verschoben, so dass sie den vertikalen Raum gut ausnutzen ohne zu viel freie Flächen zu lassen. Die Seiten führen die Anpassung an die Breite des Geräts automatisch aus.

Layout auf großem Bildschirm oder Tablet

Sobald horizontal mehr Platz zur Verfügung steht, wird der Raum besser genutzt, das Prinzip beim Kacheln wird noch einmal deutlicher. Die Schriftgröße bleibt unverändert proportional.