Grafiken für Handyauflösungen pixelgenau oder vom Verhältnis?

[Crast]

Landscape vom Handy ist übrigens kein Problem, weil das bei mir keinen Sinn macht

Das ist deine Meinung. Doch eventuell nicht die des Nutzers. Waere die Webseite responsive, koenntest du sagen, dass es dir egal ist, weil du nur auf die Breite reagierst.

Wie würdest du es responsive machen? Also dass sich das Hintergrundbild dem jeweiligen Handy anpasst und auch die Platzierung vom Menü-Button und dem Topic-Text (Neues, Biografie, Downloads usw.) gleich bleibt?

Zuerst wuerde ich mir ueberlegen, ob ich fuer Desktop und Mobile unterschiedliche Seiten ausliefern moechte (Beide Projekte sind responsive).
Vorteile ein Projekt:
- Ein Projekt statt zwei das gewartet werden muss
- Man hat Serverseitig keine komischen Regelungen wann was ausgliefert werden soll
- Auch Desktop-Nutzer mit einem kleinen Screen koennen es gut nutzen
- Weniger Probleme mit den Unterschiedlichen Endgeraeten (betrifft nur die Aufloesung)
Vorteile zwei Projekte:
- Grundlegend unterschiedliche Technologien koennen verwendet werden.
- Man kann sich auf eine Sache fokusieren
- Besser Optimierbar
- Weniger ungenutzer Code der ausgeliefert wird

Ich wuerde mich fuer ein Projekt entscheiden.
Im Anschluss wuerde ich mir Gedanken machen ob Mobile-First oder Desktop-First. Auch wenn ich den Desktop dem Mobilen Endgeraet vorziehe, muss ich dennoch schauen, was fuer meine Zielgruppe wichtiger ist. Ausgehend davon das ich moeglichst viele Leute ansprechen moechte, muss ich fuer Mobile-First entscheiden, da eine Seite die fuer das Handy optimiert ist auch gut auf dem Desktop Laeuft. Andersherum ist das nicht der Fall. ueber 50% der Webseitenaufrufe werden mittlerweile ueber Mobile-Endgeraete getaetigt.

Bis zum Coding fehlen noch 2 Schritte fuer mich. Im Anschluss werden 3 Layouts als Wireframe entwickelt. Da ich mich fuer Mobile-First entschieden habe, fange ich mit einem fuer sehr kleine Handys an (320px Breite). Danach eins Tablets, grosse Handys und kleine Desktops (irgendwo 700px und 1200px Breite). Als letztes fuer Desktops (1920px und breiter). Ist das Getan mach eich mir noch Gedanken ueber je ein Layout das ziwschen klein und mittel und mittel und gross ist. Wenn das geschehen ist suche ich Farben, Bilder, Schriften etc. und mache aus dem Layout ein Entwurf.

Und erst wenn ich damit zufrieden bin gehe ich an das Coding.


Wenn ich ohne Planung an ein Projekt gehe, arbeite ich einzelne Funktionen ab, dann wird die Seite aber auch kein "Kunstwerk" sondern der Fokus liegt rein auf der Funktionalitaet.
In den meisten Faellen orientiere ich mich dann an einem bestehenden Designkonzept, z. B. Material Design, und fange mit der Navigation an. Danach der Footer und dann mache ich die einzelnen Content-Seiten.
Eigenes CSS schreibe ich bei der ganzen Sache sehr wenig.

Aber wie soll Responsive Design bei mir funktionieren?

Du solltest dafuer dein HTML und CSS dafuer Grundlegend ueberarbeiten.
Du musst die Verwendung von position: absolute; vermeiden. Ein groesseren Fokus auf relative Einheiten (%, em, rem, ...). Mit Media Queries arbeiten. Und dir uberlegen wie du den Inhalt in den Vordergrund bringst, dabei helfen Konzepte wie Mobile-First.

(Sorry fuer meine etwas spaetere antwort. War im Urlaub.)

 

[LeanderAT]

Danke für deine Antwort! Werd mal schauen.

Hoffe, du hattest einen schönen Urlaub!