Responsive Design, was könnt ihr empfehlen?

[BC]grmbl

Cadet 4th Year
Dabei seit
Mai 2006
Beiträge
111
Hallo,

ich habe Anfang des Jahres (m)eine neue Website an den Start gebracht und bisher noch keinen Gedanken an Mobilgeräte verschwendet. Das muss ich jetzt ändern...
Könnt ihr Tutorials zu Responsive Design empfehlen? Es gibt Websites, bei denen nur das Menü umgestaltet wird und schon ist die mobile Ansicht fertig. Was sollte alles angepasst werden, außer dem Menü?

Danke.
 

R4sh

Commander
Dabei seit
Okt. 2014
Beiträge
2.766
allgemein alles d.h. die navi, der content und der footer sollten angepasst werden. am besten schaust du mal bei selfhtml , da solltest du fündig werden. http://de.selfhtml.org/index.htm

MfG R4sh
 

CloakingDevice

Lieutenant
Dabei seit
Juli 2010
Beiträge
1.003
Das ist einfach. Alles sollte angepasst werden. Inklusive Schriftgröße. Denk auch an Checkboxen, Radiobuttons und derlei. Die sind mit dem Daumen nur schwer bedienbar. Ich finde es heute sogar sinnvoller die umgekehrte Route zu gehen. Fang mit der Mobilseite an und schau wie den zusätzlichen Platz auf größeren Geräten effektiv nutzen kannst. Das führt meiner Erfahrung nach zu besseren Resultaten.

Empfehlen würde ich dir ein gutes Framework. Du kannst auf den Klassiker Bootstrap setzen sofern du halbwegs mit deren Style zufrieden bist, ansonsten gibt es noch Foundation oder auch Semantic UI. Natürlich sind da noch weitere, hier nicht explizit aufgeführte.
 

Daaron

Fleet Admiral
Dabei seit
Dez. 2011
Beiträge
13.487
ich habe Anfang des Jahres (m)eine neue Website an den Start gebracht und bisher noch keinen Gedanken an Mobilgeräte verschwendet. Das muss ich jetzt ändern...
Im Zweifel ist es jetzt schon etwas spät dafür. Ein bestehendes Layout im Nachgang "responsive" zu machen ist im besten Fall nervig, im ungünstigsten Fall quasi unmöglich.
So etwas beachtet man schon in der allerersten Konzeption. Egal, was man designed, bei allem hat man im Hinterkopf "Wie sieht das auf nem schlanken Telefon aus, wie auf nem 4k-Monitor?"

Es gibt Websites, bei denen nur das Menü umgestaltet wird und schon ist die mobile Ansicht fertig. Was sollte alles angepasst werden, außer dem Menü?
Nur das Menü? Da kommen die aber nicht weit, weil ein Desktop eben breeeeeit ist. Für Desktops kachelt man Content nebeneinander. Nehmen wir z.B. so einen Forenpost hier: Weil wir den Platz haben, wird die User-Info links des Beitrags dargestellt. In ner Mobile-Ansicht wäre das nicht möglich.

Die einzig korrekte Antwort auf "Was muss angepasst werden?" lautet: Alles, was blöd aussieht, blöd lesbar ist oder sich blöd bedienen lässt. Außerdem natürlich alles, was übermäßig Bandbreite benötigt. Ein Hoch auf <picture> und dessen JS-Fallbacks.
 

T0a5tbr0t

Lieutenant
Dabei seit
Apr. 2012
Beiträge
581
Anpassen MUSS man erstmal gar nichts. Es hängt einfach vom Layout der Seite ab, ob der Content / die Funktionalität auf kleinen Bildschirmen (und mit anderem Input wie Touchscreens) noch gut nutzbar ist.

Ich würde empfehlen sich mal über "Viewports" in Browsern zu informieren. Was ist das und wieso verhalten sich Mobil-Browser da standardmäßig anders als Desktop Browser? Dann verstehen was media queries in CSS sind und wozu die gut sind (vor allem "width", den Rest braucht man selten).
Dann vielleicht auch noch was genau CSS Units wie px, em, % etc. eigentlich genau angeben. (CSS px haben z.B. nichts mit echten "physikalischen" Bildschirm-Pixeln zu tun)
Soweit der Technische Krams.
Alles andere sind dann einfach Designfragen.
 

John Reese

Lt. Commander
Dabei seit
März 2008
Beiträge
1.265
Unabhängig von dem Thema an sich, also Responsive Design, krieg ich nach dem erneuten Aufruf deiner Seite eine schöne Fehlermeldung:
http://puu.sh/gWGFN/449b415647.png
 
Top