nicht angemeldet
Responsive Design: Welche Auflösungen?
2 
Gunnar Bittersmann
0 0 Gunnar Bittersmann
0
Responsive Design: Welche Auflösungen?
Hallo,
ich arbeite gerade an einer Seite, die ich gerne mit Hilfe von media-Queries responsive machen möchte. Allerdings frage ich mich wie das genau gehen soll bei den Auflösungen heutiger Smartphones.
Ich meine das Galaxy Nexus und das Galaxy SIII haben ja Auflösungen von 1280x720px. Meint ihr ich sollte dann das als Obergrenze nehmen? Ich finde, dass bspw. das Galaxy Note auch die Tablet-Seite bekommen kann. Aber da ist direkt das nächste Problem. Das iPad(3.Gen) hat eine Auflösung von 2048x1536px das ist besser als manch ein Laptop oder normaler Bildschirm, trotzdem hätte ich auf dem iPad gerne eine simplere Seite als bspw. auf einem Laptop, allein wegen der physikalischen Dimension.
Wie setzt ihr sowas um?
Liebe Grüße,
Skraps
-
@@Skraps:
nuqneH
Aber da ist direkt das nächste Problem. Das iPad(3.Gen) hat eine Auflösung von 2048x1536px
Du musst zwischen Device-Pixeln und CSS-Pixeln unterscheiden. Für …-width-Media-Querys sind CSS-Pixel relevant.
Wie setzt ihr sowas um?
Sinnvoll ist es wohl, die Breakpoints nicht anhand von Geräten festzumachen, sondern anhand des Layouts. “[B]reakpoints should be defined by ‘when it looks appropriate’ rather than conforming to device dimensions, which date very, very quickly.” – E.J. Stocks (Quelle)
Qapla'
--
Wer möchte nicht lieber durch Glück dümmer als durch Schaden klüger werden? (Salvador Dalí)-
Hallo,
Sinnvoll ist es wohl, die Breakpoints nicht anhand von Geräten festzumachen, sondern anhand des Layouts. “[B]reakpoints should be defined by ‘when it looks appropriate’ rather than conforming to device dimensions, which date very, very quickly.” – E.J. Stocks (Quelle)
Aber dazu zieht man doch die Geräteauflösung heran, oder? Ich setze das Layout für bestimmte Auflösungsintervalle fest und das muss man bestimmen. Oder hab ich den Artikel falsch verstanden?
Grüße
Siri-
@@Siri:
nuqneH
Aber dazu zieht man doch die Geräteauflösung heran, oder?
Ja, klar.
Ich setze das Layout für bestimmte Auflösungsintervalle fest und das muss man bestimmen.
Aber eben unabhängig von Geräten. Also nicht Breakpoint bei x Pixeln setzen, weil Gerät Y einen x Pixel breiten Bildschirm hat.
Qapla'
--
Wer möchte nicht lieber durch Glück dümmer als durch Schaden klüger werden? (Salvador Dalí)-
Hallo,
Aber dazu zieht man doch die Geräteauflösung heran, oder?
Ja, klar.Ich setze das Layout für bestimmte Auflösungsintervalle fest und das muss man bestimmen.
Aber eben unabhängig von Geräten. Also nicht Breakpoint bei x Pixeln setzen, weil Gerät Y einen x Pixel breiten Bildschirm hat.Ich bin gerade etwas begriffsstutzig... Wonach entscheide ich dann bzw. wem oder was überlasse ich die Entscheidung? Die (Geräte-)Auflösung kommt doch vom Gerät XY?
Als Beispiel:
Bis 300px Breite: Intervall 1/Layout 1
301 - 600px Breite: Intervall 2/ Layout 2
über 600px Breite: intervall 3/Layout 3
So?Grüße
Siri-
@@Siri:
nuqneH
Ich bin gerade etwas begriffsstutzig...
Das lassen wir mal so stehen. ;-)
Wonach entscheide ich dann bzw. wem oder was überlasse ich die Entscheidung? Die (Geräte-)Auflösung kommt doch vom Gerät XY?
Ja, aber wo kommen in deinem Beispiel
Bis 300px Breite: Intervall 1/Layout 1
301 - 600px Breite: Intervall 2/ Layout 2
über 600px Breite: intervall 3/Layout 3die 300 und die 600 her?
Qapla'
--
Wer möchte nicht lieber durch Glück dümmer als durch Schaden klüger werden? (Salvador Dalí)-
Hallo,
Ja, aber wo kommen in deinem Beispiel
Bis 300px Breite: Intervall 1/Layout 1
301 - 600px Breite: Intervall 2/ Layout 2
über 600px Breite: intervall 3/Layout 3die 300 und die 600 her?
Das ist eine Frage der Aufgabe. Ich will z.B. was für Smartphones, Tablets und Bildschirm. Ich kann auch sagen nur Smartphone und Bildschirm, dann wärs wegen mir für bis zu 400px und ab 401px. Relevant sind die gängigen CSS-Auflösungen der Geräte.
Wenn's was sinnigeres gibt: Her mit der best-practice :)
Grüße
Siri-
@@Siri:
nuqneH
Relevant sind die gängigen CSS-Auflösungen der Geräte.
Was du „gängig“ nennst, nennt E.J. Stocks „sehr schnell veraltet“.
Wenn's was sinnigeres gibt: Her mit der best-practice :)
Gehe zurück in die Badstraße. Dort solltest du fündig werden.
Qapla'
--
Wer möchte nicht lieber durch Glück dümmer als durch Schaden klüger werden? (Salvador Dalí)-
Hallo,
Relevant sind die gängigen CSS-Auflösungen der Geräte.
Was du „gängig“ nennst, nennt E.J. Stocks „sehr schnell veraltet“.Wenn's was sinnigeres gibt: Her mit der best-practice :)
Gehe zurück in die Badstraße. Dort solltest du fündig werden.OK, generell sollte man mit einem anderen Denkansatz herangehen, den es zu verinnerlichen gilt. Aber schon auffällig, wie sie die Breakpoints in der Nähe der "gängigen" Gerätegrößen bewegen ;-) Und: sechs oder sieben Layouts ist ja auch eine Preisfrage... Das kann und mag sich nicht jeder leisten!
Trotzdem: interessant und berücksichtigenswert!
Grüße
Siri
-
-
-
-
-
-
-