Zum Inhalt springen

Layout

Im Layout-Tab bestimmst du, wie dein Portfolio strukturiert ist - vom Layout-Typ über Spaltenanzahl bis zu Abständen und Vorlagen.

Wähle zwischen drei verschiedenen Layout-Typen:

Was es macht: Zeigt Projekte in einem gleichmäßigen Raster mit fester Größe.

So findest du es: Layout > Layout-Typ > Grid

Eigenschaften:

  • Alle Projektkarten haben die gleiche Größe
  • Bilder werden auf das gewählte Seitenverhältnis zugeschnitten
  • Klassisches, aufgeräumtes Erscheinungsbild

Ideal für:

  • Einheitliche Projektdarstellung
  • Professionelle Portfolios
  • Firmen-Referenzen

Was es macht: Pinterest-ähnliches Layout mit variablen Kartenhöhen.

So findest du es: Layout > Layout-Typ > Masonry

Eigenschaften:

  • Karten behalten ihre natürlichen Proportionen
  • Lücken werden automatisch gefüllt
  • Dynamisches, interessantes Erscheinungsbild

Ideal für:

  • Kreative Portfolios
  • Gemischte Projektformate
  • Design- und Kunstportfolios

Was es macht: Horizontaler Slider mit automatischem Projektwechsel.

So findest du es: Layout > Layout-Typ > Carousel

Eigenschaften:

  • Ein Projekt im Fokus
  • Automatischer Bildwechsel (optional)
  • Seitenindikator-Punkte (optional)

Ideal für:

  • Featured-Projekte
  • Hero-Bereiche
  • Präsentationen

Diese Einstellungen erscheinen bei Grid oder Masonry Layout.

Was es macht: Anzahl der Spalten im Hochformat (Portrait-Modus).

So findest du es: Layout > Grid-Einstellungen > Spalten (Hochformat)

Wertebereich: 1 bis 4

WertWirkung
1Ein Projekt pro Zeile, große Karten
2Zwei Spalten, ausgewogene Größe
3Drei Spalten, kompakte Darstellung
4Vier Spalten, Thumbnail-Ansicht

Standard: 1


Was es macht: Anzahl der Spalten im Querformat (Landscape-Modus).

So findest du es: Layout > Grid-Einstellungen > Spalten (Querformat)

Wertebereich: 2 bis 6

WertWirkung
2Große Karten auch im Querformat
3Ausgewogener Standard
4Mehr Projekte sichtbar
5-6Kompaktes Raster

Standard: 2


Was es macht: Der Abstand zwischen den einzelnen Projektkarten in Pixeln.

So findest du es: Layout > Grid-Einstellungen > Abstand

Wertebereich: 0px bis 24px

WertWirkung
0-4pxNahtloses Raster
8-12pxLeichter Abstand, gut erkennbar
16-20pxDeutliche Trennung
24pxGroßzügiger Abstand

Standard: 16px


Was es macht: Rundet die Ecken der Projektkarten ab.

So findest du es: Layout > Grid-Einstellungen > Eckenradius

Wertebereich: 0px bis 32px

WertWirkung
0pxEckige Karten (klassisch)
8pxLeicht gerundet
12pxModern gerundet
16-24pxDeutlich gerundet
32pxStark gerundet

Standard: 12px


Was es macht: Das Verhältnis von Breite zu Höhe bei Grid-Karten.

So findest du es: Layout > Grid-Einstellungen > Seitenverhältnis

Wertebereich: 0.5 bis 2.0

WertVerhältnisBeschreibung
0.672:3Hochformat
1.01:1Quadrat
1.334:3Leichtes Querformat
1.53:2Querformat
1.7816:9Breitbild

Standard: 1.5 (Querformat)


Diese Einstellungen erscheinen nur bei Carousel Layout.

Was es macht: Die Höhe des Carousels in Pixeln.

So findest du es: Layout > Carousel-Einstellungen > Höhe

Wertebereich: 200px bis 500px

WertWirkung
200-250pxKompakter Slider
300-350pxMittlere Größe
400-450pxProminente Darstellung
500pxGroßer Hero-Slider

Standard: 300px


Was es macht: Wechselt automatisch zum nächsten Projekt.

So findest du es: Layout > Carousel-Einstellungen > Autoplay

Optionen: Aktiviert / Deaktiviert

Standard: Deaktiviert


Was es macht: Zeit zwischen automatischem Projektwechsel.

So findest du es: Layout > Carousel-Einstellungen > Intervall

Wertebereich: 1 bis 10 Sekunden

WertWirkung
1-2sSchneller Wechsel
3-4sModerate Geschwindigkeit
5-7sGemütliches Tempo
8-10sLangsamer Wechsel

Standard: 3 Sekunden


Was es macht: Zeigt Punkte zur Anzeige der aktuellen Position.

So findest du es: Layout > Carousel-Einstellungen > Indikatoren

Optionen: Aktiviert / Deaktiviert

Standard: Aktiviert


Wähle eine vorgefertigte Vorlage als Ausgangspunkt.

VorlageLayoutSpaltenAbstandEckenradiusHintergrund
MinimalGrid24px0pxWeiß
PinterestMasonry212px16pxHellgrau
ProfessionellGrid216px8pxHellgrau
DunkelMasonry28px12pxDunkelgrau
  1. Scrolle im Layout-Tab nach unten zu Vorlagen
  2. Tippe auf die gewünschte Vorlage
  3. Die Einstellungen werden übernommen
  4. Passe sie nach Bedarf weiter an

Hier siehst du alle Layout-Einstellungen auf einen Blick:

EinstellungBereichStandardMinimumMaximum
Layout-TypLayout-TypGrid--
Spalten (Hochformat)Grid114
Spalten (Querformat)Grid226
AbstandGrid16px0px24px
EckenradiusGrid12px0px32px
SeitenverhältnisGrid1.50.52.0
Carousel-HöheCarousel300px200px500px
AutoplayCarouselAus--
IntervallCarousel3s1s10s
IndikatorenCarouselAn--


Das hängt von deinen Inhalten ab:

  • Einheitliche Projekte - Grid
  • Verschiedene Formate - Masonry
  • Wenige Highlights - Carousel

Im Grid-Layout werden alle Karten auf das gewählte Seitenverhältnis zugeschnitten. Nutze Masonry, wenn du die originalen Proportionen behalten möchtest.

Für Smartphones ist 1 Spalte im Portrait ideal für detaillierte Projektkarten. 2 Spalten zeigen mehr Projekte, aber kleinere Karten.

Ja, du kannst das Layout jederzeit wechseln. Deine Projekte bleiben erhalten.