nicht angemeldet
Verständnisfrage Retina
MudGuard
Gunnar BittersmannHallo zusammen
Habe mich gerade mit responsive Design befasst und bin auf ein Problem gestossen...
Folgender Ausschnitt aus einem Artikel ist unklar...
"Damit die Pixelgrafiken nicht plötzlich alle zu klein dargestellt werden, rechnen die Geräte >die Grafiken selbstständig um. Dadurch geht allerdings Qualität verloren. Pixelgrafiken sehen >auf dem Retina-Display daher unscharf aus."
Quelle: http://blog.kulturbanause.de/2012/04/websites-und-bilder-fur-high-resolution-displays-retina-optimieren/
Heisst das jetzt, dass ein 40px mal 40px (1cm x 1cm bei normaler ppi) Bild auf einem Retina-Display nicht 40px mal 40px (0.5cm x 0.5cm bei doppelter ppi) dargestellt wird, sondern auf 80px mal 80px hochgerechnet wird und somit 80px mal 80px (1cm x 1cm bei doppelter ppi) dargestellt wird?
Wie kann dann ein Layout dargestellt werden, das für Retina-Displays optimiert ist, wenn ein Pixel nicht immer als ein Pixel dargestellt wird auf dem Display?
Und welche Geräte rechnen das hoch und welche nicht bzw. unter welchen Umständen?
Liebe Grüsse
-
Also so wie ich das verstehe hängt das von der Einbindung des Image ab. Bei Reponsivem Design arbeitet man mit relativen breiten z.B. Prozentangaben. Das würde auch bei Bildern so gemacht werden. Ergo wird ein Bild so eingebunden: <img src='' style='width: 100%;' />. Wird der Platz für das Bild kleiner, würde es vom Browser skaliert werden. Dass kann aber in allen Ausgabemedien zu Verzerrungen führen.
Gruß
T-Rex der Weihnachtself-
Hi,
T-Rex der Weihnachtself
Ich überbiete!
MudGuard, der Weihnachtszwölf!cu,
Andreas--
Warum nennt sich Andreas hier MudGuard?
O o ostern ...
Fachfragen per Mail sind frech, werden ignoriert. Das Forum existiert.
-
-
@@Someone:
nuqneH
Heisst das jetzt, dass ein 40px mal 40px (1cm x 1cm bei normaler ppi) Bild auf einem Retina-Display nicht 40px mal 40px (0.5cm x 0.5cm bei doppelter ppi) dargestellt wird, sondern auf 80px mal 80px hochgerechnet wird und somit 80px mal 80px (1cm x 1cm bei doppelter ppi) dargestellt wird?
Ja, genau das.
Wie kann dann ein Layout dargestellt werden, das für Retina-Displays optimiert ist, wenn ein Pixel nicht immer als ein Pixel dargestellt wird auf dem Display?
device pixel ≠ CSS pixel
Qapla'
--
„Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)-
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?
Freundliche Grüsse
-
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): 2Das 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
-
-