Ich benötige Ratschläge zur Positionierung wichtiger Elemente in einem Layout

Ich entwerfe eine Anzeigeseite für ein Videospiel. Die Seite hat viele Elemente und ich finde es wirklich schwierig, mich für ein logisch sinnvolles Layout zu entscheiden. Können Sie mir Ratschläge zu Layout und Artikelplatzierung geben? Was funktioniert? Empfohlene Vorgehensweise?

Ich suche nach einer Möglichkeit, die Elemente logisch zu trennen und einen gewissen Kontrast zu schaffen, während das Design attraktiv bleibt.

Geben Sie hier die Bildbeschreibung ein

Der Zweck der Website besteht darin, Videospiele online zu mieten. Der Zweck dieser speziellen Seite ist es, ein einzelnes Spiel anzuzeigen. Neben der primären Funktion der Seite besteht das gewünschte Ergebnis darin, dass sich der Benutzer für den Dienst anmeldet.

Wichtig:

  1. Boxshot, Titel, Aktionsmenü (Schaltflächen und möglicherweise ein Zusatz, um die Anmeldung zu fördern)
  2. Grundlegende Informationen (Plattform, Genre, Bewertung)

Ich bin mir nicht sicher, wie ich die folgenden Gegenstände einordnen soll, aber sie sind austauschbar:

Zusammenfassung, andere Details, Screenshots, Video, Rezensionen, Fragen und Antworten, ähnliche Spiele.

Mein erster Kommentar ist "keine Angst vor vertikalem Scrollen". Amazon hat es gut gemacht (auch wenn es nicht das schönste ist). Ich würde Screenshots und das Video größer machen und dann die Informationen in der rechten Spalte darunter ablegen.
Wie wäre es, wenn Sie die Spalte „Details“ unter „Add This“ (scheint ungefähr die gleiche Breite) verschieben, die Spalte „Q&A“ unter dem Boxshot (scheint wieder ungefähr die gleiche Breite) und die Screenshots und das Video ein wenig erweitern, um sie zu füllen? der mittlere Raum (unter der Inhaltsangabe)? (Vielleicht richten Sie die Elemente „Übersicht/Rezensionen/Antworten erhalten“ so aus, dass sie alle in die Spalte „Zusammenfassung/Screenshots/Video“ fallen.)

Antworten (1)

Versuchen Sie, die Breitenverhältnisse mit einem Raster zu straffen. 978 Grid System ist meine aktuelle Wahl als Leitfaden (ich verwende kein CSS, aber das Layoutmuster ist einen Blick wert).

Danach, denke ich, könnten Sie die "schwere" horizontale Trennung nach oben auf der Seite verschieben. Ich denke, es hält mehr Gewicht, als es wirklich braucht, und es würde den vertikalen Fluss der Seite unterstützen. Wie der Kommentar erwähnt ... vertikales Scrollen ... missbrauchen Sie es nicht - verwenden Sie es auf jeden Fall.

Erste Gedanken zum Layout:

Teilen Sie das vertikale Layout in 1/3 mal 2/3 Spalten oder vielleicht 1/5, 3/5, 1/5 (unter Verwendung des vertikalen Rasters für die Elementplatzierung).

Kopf: Horizontaler Balken (irgendwo außer Totpunkt)

oben: Detailspalte / Held und Details / diese Schaltflächen hinzufügen

Mitte: Details Forts. / Screenshots / Rezensionen und ähnliche Spielespalte (achte auf die Breite)

btm: ... / Fragen und Antworten / ...

Fußzeile: ...

Option 2: Die Breite Ihres Hero-Bereichs und der Screenshots/Videos ist sehr ähnlich ... machen Sie sie identisch und stapeln Sie sie. Schieben Sie dann den dünneren Inhalt an die Kante(n).

Wie auch immer, ich versuche nur, den Helden und die Hauptpunkte nicht nur aufeinander abzustimmen, sondern so auszusehen, als wären sie Teil desselben Spiels – nicht des nächsten Spiels im Queue.