nicht angemeldet
Hallo werte Selfgemeinde!
Also ..., es ist tatsächlich volle Absicht von Apple, respektive Webkit, sog. DIPs (Device Independent Pixel) zu verwenden. Und nachdem man nun auch in Chrome die Unterstützung der Option 'target-densitydpi=device-dpi' im Meta-Tag gestrichen hat, führt das dazu, dass man als Autor nicht mehr in der Lage ist, eine Seite für ein mobiles Endgerät in der eigentlichen Auflösung des jeweiligen Geräts anzeigen zu lassen, sondern nur noch in der Größe, die der Hersteller oder der Browser "für passend" erachten.
Das wird natürlich nur dann "zum Problem", wenn das Gerät eine höhere Device Pixel Ratio als 1.0 hat, was aber inzwischen auf die allermeisten Smartphones zutrifft.
Was mich besonders daran stört ist, dass es keine Möglichkeit mehr gibt, diese "automatische" Vorgabe als Autor zu übersteuern. Denn sowohl der Mobile Safari (iOS), als auch Chrome (Android) sind "übers Ziel hinausgeschossen", da sie selbst mit Javascript als screen.height/width nur noch die "virtuelle" (oder besser "willkürliche) Vieportgröße ausspucken.
Müßig zu erwähnen, dass sich alle absoluten Größen in CSS natürlich auf diese "virtuelle" Viewportgröße beziehen.
Das halte ich insofern für äußerst problematisch, um nicht zu sagen für falsch, als dass sich bspw. Media Queries mit 'device-width|height' eben auch nicht mehr auf die Auflösung (screen size) des Geräts beziehen, sondern ebenfalls nur noch auf die virtuelle Größe.
Zu verdanken haben wir das Apple und ihrem Versuch, die diversen Geräte mit ihren unterschiedlichen Pixeldichten alle in eine überschaubare Menge mit möglichst wenigen und nach Möglichkeit ganzzahligen Faktoren für die Pixeldichte (Device Pixel Ratio) zu packen.
Allerdings bin ich der Meinung, dass solche "Bevormundungen/ Automatissmen" nur solange akzeptabel sind, wie es auch eine Möglichkeit gibt, diese zu übersteuern. Und genau das ist aktuell nicht mehr gegeben!
Damit wird der Entwurf der neuen at Regel 'viewport' auch von vornherein konterkariert, da sich eben device-width|height nicht auf die tatsächliche Auflösung des Geräts beziehen, sondern auf die "device independent" Viewportgröße!
Ebenfalls äußerst "lästig" ist das aktuell natürlich unterschiedliche Verhalten der diversen Browser. Hier mal eine kleine Auflistung der jeweils aktuellsten Versionen für Android auf einem Samsung Galaxy S (GT-I9000) mit einer Auflösung von 480 x 800:
Chrome:
document.documentElement.clientWidth x document.documentElement.clientHeight: 320 x 412
window.innerWidth x window.innerHeight: 320 x 412
window.outerWidth x window.outerHeight: 320 x 412
screen.width x screen.height: 320 x 486
window.devicePixelRatio: 1.5
Android (4.2.2):
document.documentElement.clientWidth x document.documentElement.clientHeight: 320 x 408
window.innerWidth x window.innerHeight: 320 x 408
window.outerWidth x window.outerHeight: 480 x 690
screen.width x screen.height: 480 x 800
window.devicePixelRatio: 1.5
Dolphin HD:
document.documentElement.clientWidth x document.documentElement.clientHeight: 320 x 240
window.innerWidth x window.innerHeight: 320 x 240
window.outerWidth x window.outerHeight: 320 x 240
screen.width x screen.height: 480 x 800
window.devicePixelRatio: 1.5
Firefox:
document.documentElement.clientWidth x document.documentElement.clientHeight: 320 x 412
window.innerWidth x window.innerHeight: 320 x 412
window.outerWidth x window.outerHeight: 480 x 618
screen.width x screen.height: 480 x 728
window.devicePixelRatio: 1
Opera Mobile:
document.documentElement.clientWidth x document.documentElement.clientHeight: 480 x 534
window.innerWidth x window.innerHeight: 480 x 534
window.outerWidth x window.outerHeight: 480 x 534
screen.width x screen.height: 480 x 690
window.devicePixelRatio: 1
Der native Android Browser und Dolphin basieren, genau wie Chrome, auf der Webkit Engine - unterstützen aktuell aber noch die propietäre Option 'target-densitydpi=device-dpi' im Meta-Tag.
Firefox macht es ohne JS total verkehrt, was bedeutet, dass man nur mit CSS alleine keine Chance hat, bspw. eine passende Grafik auszuliefern.
Ich finde, dass alleine schon der Begriff "device independent" aussagt, dass sich solche Größen mit CSS "schlecht vertragen".
Und wer braucht die eigentlich, diese "device independent" Größen? In meinen Augen sind die völlig überflüssig und vergrößern lediglich das bereits vorhandene "Chaos" im Bereich der Displays mit hoher Pixeldichte!
Gruß Gunther