Das Zusammenspiel von Hardware und Content

Kaum hatte sich die Euphorie um das iPhone 5 ein wenig gelegt, setzte Apple mit der Vorstellung des iPad mini nach. Wie wir alle wissen, ist das neue iPhone schneller, leichter und das Design wurde überarbeitet. Die größte Änderung, im wahrsten Sinne des Wortes, dürfte hingegen das Display darstellen. Mit den Worten „Das größte was dem iPhone passieren konnte“ kündigt Apple an, dass die Displaygröße des neuen Smartphones von 3.5 auf 4 Zoll im Vergleich zum Vorgänger gewachsen ist.

Wenige Wochen später wurde mit dem iPad mini ein weiteres Endgerät vorgestellt, das im Vergleich zu bisherigen Produkten des Hauses eine geänderte Displaygröße aufweist. Das Display des iPad mini ist, im Vergleich zum iPad, von 9.7 auf 7,9 Zoll geschrumpft. Doch was bedeuten die unterschiedlichen Auflösungen in Hinblick auf die Gestaltung von Websites, Apps und anderen digitalen Inhalten?

Zunächst muss man sagen, dass Apple die Änderungen an den Displaygrößen mit sehr viel Feingefühl vorgenommen hat. So wurde beim iPhone 5 lediglich die Höhe des Displays von 960 auf 1136 Pixel erweitert, die Breite blieb hingegen unverändert. Auch beim iPad mini wurde zwar eine neue Displaygröße, jedoch keine neuen Auflösungen generiert. Stattdessen wird die Auflösung von 1280 x 768 Pixel gesetzt, die bereits bei den iPads der 1. und 2. Generation zum Einsatz kam. Sieht also auf den ersten Blick danach aus, als hätte sich nicht viel verändert. Bei einer genaueren Betrachtung fällt jedoch auf, dass die geänderten Proportionen des iPhone 5 sowie die geringere Displaygröße sehr wohl Veränderungen mit sich bringen.

iPhone (alt): 320 x 480 px, 163 ppi
iPhone (Retina): 640 x 960 px, 326 ppi
iPhone 5: 640 x 1.136 px, 326 ppi
iPad (alt &mini):1.024 x 768 px, 132 ppi / 163 ppi
iPad (Retina): 2.048 x 1.536 px, 264 ppi

Im Falle des iPad mini muss berücksichtigt werden, dass es zwar die selbe Anzahl an Pixeln aufweist wie beispielsweise das iPad 2, diese jedoch auf einer kleineren Fläche dargestellt werden. Das bedeutet einerseits, dass die Auflösung im Vergleich zum iPad 2 von 132ppi auf 163ppi gestiegen ist, andererseits aber auch, dass die Inhalte auf dem iPad mini kleiner dargestellt werden als auf einem iPad der ersten und zweiten Generation. Doch um wie viel kleiner?

Hier ein kurzes Rechenbeispiel:
Apple empfiehlt in den iPhone Human Interface Guidelines, dass die Mindestgröße einer Schaltfläche für Touchscreens 44 x 44 Pixel groß sein sollte. Im Falle des iPad mini bedeutet das, dass die Diagonale der tatsächlich dargestellten Fläche ca. 10mm beträgt. Auf einem iPad 2 hingegen beträgt die Diagonale dieser Schaltfläche 12mm. Unterm Strich bedeutet es also, dass Inhalte auf dem iPad mini ca. 20% kleiner dargestellt werden als auf den großen iPads.

Bei der dritten Auflösung, also bei iPads mit Retina-Displays, ändert sich die Größe der dargestellten Fläche nicht im Vergleich zu iPads gleicher Größe ohne Retina-Display. Im Beispiel mit der 44 x 44 Pixel Schaltfläche wird die Diagonale von 12mm tatsächlich gleich gross angezeigt, allerdings nicht mit der vollen Auflösung. Um die volle Auflösung des Retina-Displays auszuschöpfen, muss die Grafik in der doppelten Größe zur Verfügung gestellt werden.

Wenn wir Inhalte für das iPhone gestalten, mussten wir bisher ebenfalls Grafiken in unterschiedlichen Größen erstellen, um die Möglichkeiten der Retina-Displays voll auszuschöpfen. Mit dem iPhone 5 kommt noch eine weitere Komponente hinzu: Das Display bietet vertikal mehr Platz. Doch wie gehen wir mit dem veränderten Seitenverhältnis um?

Wir denken, die Frage muss individuell beantwortet werden. Auf der einen Seite kann es bei Apps wie Kalender, Kontakte, Facebook, Safari etc. durchaus Sinn machen, mehr Inhalt darzustellen. Im Kalender bedeutet das beispielsweise, dass statt zwei nun vier Events dargestellt werden können. Wie sich in der Praxis zeigt, macht ein 176 Pixel höheres Display einen deutlichen Unterschied. Am auffälligsten, dürfte der Zuwachs auf dem Home Screen sichtbar sein. Hier werden nun, abgesehen vom Dock, 5 statt 4 Zeilen Apps dargestellt. Auf eine Seite passen jetzt also 20 statt 16 Apps. Was wiederum bedeutet, das 80 Apps nicht mehr 5 Seiten, sondern nur noch 4 Seiten in Anspruch nehmen. Kurz um: Je mehr Content, desto größer die Auswirkung.

Daneben gibt es hingegen Anwendungen, bei denen der Auflösungszuwachs nicht mit zusätzlichem Inhalt gefüllt werden kann, wie es Beispielsweise bei der Kamera oder dem Rechner der Fall ist. Beim Kamera App wäre es zwar theoretisch möglich, den zusätzlichen Platz mit dem Kamerabild aufzufüllen. Da sich das Seitenverhältnis der Bilder jedoch im Vergleich zum Vorgänger-iPhone nicht geändert hat, würde das allerdings den gezeigten Bildausschnitt verfälschen. Aus diesem Grund haben sich die Apple Designer dazu entschieden, den Auslöser größer zu gestalten. Auch beim Rechner wurde lediglich die Fläche der einzelnen Tasten vergrößert, jedoch keine zusätzlichen Funktionen abgebildet.

Etwas anders verhält es sich im Landscape-Modus. Da das Seitenverhältins des iPhone 5 Displays nun bis auf geringste Abweichungen dem gängigen Videoformat 16:9 entspricht, können Videos nun ohne Letterboxing (also ohne schwarzen Balken) dargestellt werden. Anders sieht es jedoch bei vielen anderen Apps aus. So wurde beispielsweise der Support für den Landscape-Mode bei einem der letzen Updates der Facebook-App eingestellt.

Auch wenn die Änderungen der Apple-Hardware marginal erscheinen, können sie im Gebrauch einen deutlichen Unterschied offenbaren. Wenige Pixel können ausschlaggebend dafür sein, ob wir Texte lieber im Querformat schreiben oder das iPhone beim Surfen im Hochformat halten. Auf jeden Fall müssen die geänderten Parameter in der Gestaltung der Inhalte berücksichtigt werden. Wir machen das.