Ein Retina Display ist ein Bildschirm von Apple, dessen Pixel Density hoch genug ist, dass ein Betrachter aus dem üblichen Abstand keine einzelnen Bildpunkte mehr unterscheiden kann. Der Name stammt aus dem Marketing und bezeichnet keinen technischen Standard. Es gibt deshalb auch keinen festen ppi-Wert, ab dem ein Bildschirm dazugehört. Maßgeblich ist immer das Zusammenspiel aus Dichte und Betrachtungsabstand des jeweiligen Geräts.
- Retina Display
Apples Bezeichnung für Bildschirme, deren Bildpunkte aus dem üblichen Betrachtungsabstand nicht mehr einzeln erkennbar sind.
Beispiel: „Auf dem Retina Display des MacBook fällt jede unscharfe Grafik sofort auf.“Herkunft: Apple führte den Namen 2010 mit dem iPhone 4 ein, dessen Bildschirm 326 ppi erreichte. Später kamen Varianten wie Liquid Retina und Super Retina XDR dazu, die zusätzlich Panel-Technik und Helligkeit beschreiben.
Abgrenzung: Retina Display meint das Anzeigegerät. Retina-Assets meinen die Bilddateien in doppelter oder dreifacher Auflösung, die auf einem solchen Gerät scharf bleiben. Umgangssprachlich wird „Retina“ auch für hochauflösende Bildschirme anderer Hersteller benutzt, obwohl die Marke Apple gehört.
Was hinter dem Namen steckt
Apple hat den Begriff an eine Beobachtung geknüpft: Ab einer bestimmten Winkelauflösung kann das menschliche Auge zwei benachbarte Bildpunkte nicht mehr trennen. Wie hoch die nötige Dichte ausfällt, hängt davon ab, wie nah das Gerät am Auge ist. Ein Telefon braucht dafür mehr ppi als ein Notebook auf dem Schreibtisch, und ein Fernseher kommt mit deutlich weniger aus.
Damit gibt es keine Zahl, ab der ein Bildschirm ein Retina Display ist. Apple entscheidet das pro Produktlinie. Für deine Arbeit heißt das: Der Name beschreibt ein Ziel und liefert dir keinen Messwert, an dem du dich ausrichten könntest.
Warum der Browser den Begriff nicht kennt
In CSS und JavaScript taucht „Retina“ nirgends auf. Der Browser kennt die Device Pixel Ratio und das Media Feature resolution, beides neutrale technische Größen. Ein Retina Display meldet sich dort mit einer DPR von 2 oder 3, genau wie ein hochauflösendes Android-Gerät oder ein 4K-Monitor mit Skalierung.
Für die Entwicklung ist das eine gute Nachricht. Du musst weder Geräte erkennen noch Markennamen abfragen. Es genügt, Bilder in mehreren Auflösungen bereitzustellen und den Browser wählen zu lassen.
Was du daraus fürs Design mitnimmst
Auf einem Bildschirm dieser Klasse wird jede Schwäche im Bildmaterial sichtbar. Ausgefranste Logos und alte JPEGs aus einem früheren Relaunch fallen dort sofort auf, während sie auf einem einfachen Monitor durchgehen. Wir prüfen Layouts deshalb immer auf mindestens einem Gerät mit hoher Dichte, bevor sie live gehen.
Schrift und Flächen profitieren von der Dichte ganz von allein, weil der Browser sie bei jedem Faktor neu rastert. Die Arbeit steckt in den Pixelgrafiken. Wo es möglich ist, ersetzt du sie durch SVG, der Rest wird in mehreren Größen ausgeliefert.