Ich brauche jemanden, der mir hilft, mein Verständnis bezüglich der Pixelgröße auf neuen Telefonen mit hoher Bildschirmdichte zu klären. Seitdem wirft es einen Kurvenball in mein Webdesign.Webdesign für Smartphones - Pixelgröße
Mein erstes Verständnis über Smartphones war, dass die Pixelgröße etwa 480 x 320 war, was das Entwerfen einfach machte, da die Pixel immer noch die gleichen Pixel waren.
Allerdings sind einige Smartphones doppelt (oder mehr) als diese. Ich glaube, das iPhone bei 960 x 640. Mein Galaxy Nexus wirklich doppelt so hoch ist ist 1280 x 720.
Nun, dies funktioniert gut, wenn% mit 's. Es gibt jedoch viele Dinge, für die ich fixe Pixelwerte verwenden wollte. Zum Beispiel müssen viele Höhenwerte nicht in% s sein. Außerdem, wenn die Höhe festgelegt ist, einige Elemente, wie Logo, Symbole, einige Bilder, möchte ich nicht gestreckt werden, wenn die Breite erweitert ... so dass diese einen konsistenten Wert benötigen.
Wie gehe ich jedoch damit um, wenn ein Pixel nicht wirklich eine konsistente physikalische Messung ist?
Es ist einfacher, wenn ein Beispiel verwendet wird, so dass, wenn jemand es mir nehmen könnte erklären, sagen Symbole als Beispiel.
Als ich melden Sie sich auf Facebook auf meinem Handy, ich sehe diese drei Benachrichtigungssymbole in der Navigationsleiste (Freundschaftsanfragen, Nachrichten und etwas anderes). Diese sind behoben. Ob ich mein Telefon aufrecht oder auf der Seite habe, sie bleiben genau gleich groß. Das einzige, was sich mit der Breite ändert, ist der Abstand zwischen ... im Wesentlichen was ich arbeite.
Was wäre die Messung auf diesen Symbolen? Zum einen weiß ich, dass das Standardsymbol normalerweise 16x16 ist. Also, müssten sie 32x32 auf diesen High-Density-Smartphones sein? Allerdings scheinen sie auch nicht so groß zu sein wie meine 16x16 Icons, die ich auf meinem Desktop sehe. Sie sehen vielleicht 12x12 aus. Also, nicht sicher, aber ich würde denken, dass es eine andere "Standard" -Symbolgröße für Smartphones als für Desktops gibt (was wäre das?).
Wie auch immer, ich habe bereits CSS, dass ein Handy verwendet wird, um meine mobile Layout zu erreichen. Muss ich aber noch einen Schritt weiter gehen, um die Pixeldichte zu erkennen und dann meine festen Werte in diesem Fall zu verdoppeln? Oder gibt es einen anderen/besseren Weg?
Alle und alle Hilfe wird geschätzt. Ich bin ein bisschen ratlos und es gibt nicht wirklich viele Informationen darüber. Danke und Entschuldigung für den langen Post!
Klingt wie das Problem das Pixelverhältnis. Retina-Displays haben ein Pixelverhältnis von 2: 1 (ein Pixel auf der Netzhaut ist das gleiche wie 2 auf einem normalen Display). Dies würde dazu führen, dass die Auflösung doppelt so aussieht wie erwartet. Es gibt viele laufende Diskussionen zu diesem Thema, und ich bin sicher, dass Sie einige Artikel mit ein wenig Suche finden können. –
Hier ist ein Artikel, der Ihnen vielleicht weitere Informationen geben könnte (es gibt viele da draußen) http://menacingcloud.com/?c=highPixelDensityDisplays –