Soweit ich weiß, sind Retina-Displays einfach ein Bildschirm mit einem hohen PPI (höher als der Ihres Auges bei "optimaler Betrachtungsentfernung"). Warum müssen Anwendungen dann ihre Schnittstelle anpassen, um Retina-Displays speziell zu unterstützen? Wie unterscheidet sich das von normalen Displays mit einem hohen PPI? Bildschirmauflösung ist Bildschirmauflösung, warum sollte es also bei Retina-Displays anders sein?
Ich denke, Sie beziehen sich auf die Pixeldichte und nicht auf die Auflösung (obwohl sie verwandt sind). Die Pixeldichte kann gemessen werden, indem die Anzahl der Pixel in einem Zoll gezählt wird. Während eine Bildschirmauflösung die Anzahl der Pixel ist, die ein Bildschirm in jede Dimension (horizontal und vertikal) passen kann.
Auf Geräten mit hoher Pixeldichte skaliert der Browser die Pixelabmessungen der Elemente so, dass sie wie auf einem Bildschirm mit einer typischen Pixeldichte von 96 ppi gerendert werden. Das Ergebnis ist, dass die Abmessungen auf Ihrem Hi-ppi-Gerät denen auf Ihrem normalen Bildschirm sehr ähnlich sehen. Das ist zum größten Teil eine gute Sache.
Das einzige, was darunter leidet, sind Rasterbilder wie JPEGs und PNGs, die aus einer begrenzten Anzahl von Pixeln bestehen. Das Ergebnis der oben erwähnten Pixelskalierung ist, dass Rasterbilder verschwommen aussehen, als wären sie hochskaliert.
Eine Möglichkeit, dies zu umgehen, besteht darin, Bilder zu verwenden, die doppelt so groß sind, und sie dann in CSS auf die Hälfte zu skalieren. Eine andere Möglichkeit besteht darin, Vektorbilder zu verwenden, die ohne Qualitätsverlust vergrößert und verkleinert werden können.
Vitaly Mijiritsky