---
title: "Academy Lesson"
canonical_url: "https://academy.laioutr.com/lektionen/ux-designer-seitentyp-rezepte"
locale: de
meta:
  "og:title": "Academy Lesson"
---

[Zur Startseite](https://academy.laioutr.com/)

- [Agentic UX Designer](https://academy.laioutr.com/lernpfade/lernpfad-ux-designer)

- [Seitentyp-Rezepte anwenden](https://academy.laioutr.com/lektionen/ux-designer-seitentyp-rezepte)

Seitentyp-Rezepte: Home, PDP, PLP, Content

# Seitentyp-Rezepte anwenden

12 Min.

Für Startseite, Produktliste, Produktdetail und Content-Seite gibt es bewährte Abfolgen von Sections. Diese Lektion zeigt die Rezepte, welche Sections jeweils Pflicht sind, welche optional, und wie sich ein Rezept an Marke und Sortiment anpassen lässt, ohne die Nutzerführung zu brechen.

## Das Wichtigste in Kürze

- Jeder Seitentyp hat ein Rezept mit festen und optionalen Sections.
- Produktlisten und Produktdetail leben von Daten aus dem Shop.
- Rezepte sind ein Startpunkt, kein starres Template.

## Weiterlesen

- [Seitentyp-Rezepte: Home, Produktliste, Produktdetail, Content](https://academy.laioutr.com/artikel/seitentyp-rezepte-home-produktliste-produktdetail-content)6 Min.

  Für die wichtigsten Seitentypen gibt es bewährte Rezepte: welcher Pfad gilt, welche Daten die Seite lädt und welche Sections sie typischerweise enthält. Die Übersicht hilft, eine Storefront vollständig und konsistent aufzubauen.
- [Produktdetailseite und Datenblatt gestalten](https://academy.laioutr.com/artikel/produktdetailseite-und-datenblatt-gestalten)7 Min.

  Die Produktdetailseite ist in Studio eine Vorlage für alle Produkte: links die Bildergalerie, rechts die Buy Box aus Blöcken wie Titel, Preis, Variantenauswahl und In den Warenkorb, darunter optional ein Datenblatt. Inhalte wie Bilder, Varianten, Preise und Spezifikationen liefert die Commerce-App über Orchestr.
- [Produktlisten mit Filter und Sortierung einrichten](https://academy.laioutr.com/artikel/produktlisten-mit-filter-und-sortierung-einrichten)6 Min.

  Eine Produktliste entsteht in Studio aus Product Listing Grid, Filter Bar und Sortierung; Produkte, Filter und Sortieroptionen liefert die angebundene Commerce-App über Orchestr. Welche Filter erscheinen, hängt davon ab, was das Backend bereitstellt.
- [Inhalts-Sections: Hero, Banner, Grids, Zitate, Logos und Promotion](https://academy.laioutr.com/artikel/inhalts-sections-hero-banner-grids-zitate-logos)8 Min.

  Laioutr UI bringt fertige Inhalts-Sections wie Hero Slider, CTA-Banner, Card Grids, Testimonials, USP Banner, Logo Slider, Galerie und Promotion Banner mit. Redaktionen platzieren sie in Studio, füllen sie mit eigenen Inhalten und passen Größe, Ausrichtung und Hintergrund an.

## Structured Data

```json
{
  "@context": "https://schema.org",
  "@graph": [
    {
      "@id": "https://academy.laioutr.com/#website",
      "@type": "WebSite",
      "inLanguage": "de",
      "name": "Default",
      "url": "https://academy.laioutr.com/",
      "workTranslation": {
        "@id": "https://academy.laioutr.com/#website"
      }
    },
    {
      "@id": "https://academy.laioutr.com/lektionen/ux-designer-seitentyp-rezepte#webpage",
      "@type": "WebPage",
      "name": "Academy Lesson",
      "url": "https://academy.laioutr.com/lektionen/ux-designer-seitentyp-rezepte",
      "breadcrumb": {
        "@id": "https://academy.laioutr.com/lektionen/ux-designer-seitentyp-rezepte#breadcrumb"
      },
      "isPartOf": {
        "@id": "https://academy.laioutr.com/#website"
      },
      "potentialAction": [
        {
          "@type": "ReadAction",
          "target": [
            "https://academy.laioutr.com/lektionen/ux-designer-seitentyp-rezepte"
          ]
        }
      ]
    },
    {
      "@id": "https://academy.laioutr.com/lektionen/ux-designer-seitentyp-rezepte#breadcrumb",
      "@type": "BreadcrumbList",
      "itemListElement": [
        {
          "@type": "ListItem",
          "name": "Home",
          "item": "https://academy.laioutr.com/",
          "position": 1
        },
        {
          "@type": "ListItem",
          "name": "Agentic UX Designer",
          "item": "https://academy.laioutr.com/lernpfade/lernpfad-ux-designer",
          "position": 2
        },
        {
          "@type": "ListItem",
          "name": "Seitentyp-Rezepte anwenden",
          "item": "https://academy.laioutr.com/lektionen/ux-designer-seitentyp-rezepte",
          "position": 3
        }
      ]
    }
  ]
}
```