Verständnisfrage Retina

[molily]

Hallo,

Vielen Dank für Deine Antwort, aber leider stehe ich immer noch auf dem Schlauch...

device pixel ≠ CSS pixel

Kannst Du das evtl. noch ausführen? Nach was richtet sich dann CSS?

CSS-Größenangaben richtet sich nach der virtuellen Pixelzahl, nicht der physikalischen des Bildschirms.

Beispiel: Das Retina-iPhone 4 hat eine Device-Breite von 640 Pixeln, aber wenn man eine Website so konfiguriert, dass der Viewport so breit ist wie die Device-Breite, so entspricht ein Pixel in CSS zwei Pixeln auf dem Display. Kurz gesagt:

640 Device-Pixel
320 CSS-Pixel
Verhältnis (Device-Pixel-Ratio): 2

Das kann bei anderen Geräten natürlich anders sein.

Wenn man also Bilder laden will, die auf Retina-Displays nicht hochskaliert werden, so muss man sie für solche Geräte sie in voller Auflösung laden, aber ihre Größe im CSS halbieren.

Mathias