weboffice.digital - Dokumentation
Branche Beauty Branche Gastro Branche Handel
PDF

Website-Vorschau im Editor

Website-Vorschau im Editor

Die Website-Vorschau zeigt dir, wie deine Website für Besucher aussehen wird, während du sie bearbeitest. Du siehst hier eine Live-Vorschau deiner Änderungen, ohne die eigentliche Website zu verlassen oder zu veröffentlichen. Diese Vorschau aktualisiert sich automatisch, wenn du Inhalte änderst oder das Design anpasst.

Voraussetzungen

  • Du befindest dich im Website-Editor
  • Du hast mindestens einen Inhaltsbaustein auf deiner Seite platziert
  • Deine Website ist für die Bearbeitung geöffnet

Aufbau der Vorschau

Die Vorschau zeigt dir verschiedene Ansichten deiner Website:

Vollbild-Vorschau

In der normalen Ansicht siehst du deine komplette Website, wie sie Besucher sehen würden. Hier werden alle Elemente in ihrer endgültigen Position und Größe angezeigt:

  • Kopfbereich: Dein Logo, Menü und andere Kopfelemente
  • Hauptinhalt: Alle Textblöcke, Bilder, Schaltflächen und anderen Inhalte
  • Fußbereich: Kontaktdaten, Links und weitere Fußzeilen-Inhalte
  • Design-Elemente: Farben, Schriftarten und Abstände wie im gewählten Design

Inline-Vorschau

Bei einzelnen Bausteinen siehst du eine kompakte Vorschau direkt im Editor. Diese zeigt dir:

  • Wie der Baustein auf der fertigen Website aussieht
  • Die richtige Formatierung und Farben
  • Bilder und andere Medien in der korrekten Größe

Ladeanzeige

Während die Vorschau geladen wird, siehst du den Hinweis "Laden...". Dies dauert normalerweise nur wenige Sekunden.

So arbeitest du mit der Vorschau

Änderungen verfolgen

  1. Bearbeite Inhalte in deinem Editor
  2. Die Vorschau aktualisiert sich automatisch
  3. Du siehst sofort, wie sich deine Änderungen auswirken
  4. Keine manuelle Aktualisierung nötig

Verschiedene Ansichten nutzen

  • Desktop-Ansicht: Standardansicht für Computer-Bildschirme
  • Mobile Ansicht: Wie deine Website auf Smartphones aussieht
  • Tablet-Ansicht: Darstellung auf Tablet-Geräten

Design-Änderungen prüfen

Wenn du das Design deiner Website änderst:

  1. Wähle ein neues Design oder ändere Farben
  2. Die Vorschau zeigt sofort das neue Aussehen
  3. Prüfe alle Bereiche deiner Website
  4. Stelle sicher, dass alles gut lesbar bleibt

Tipps und Hinweise

Echte Darstellung: Die Vorschau zeigt dir genau, wie deine Website später aussehen wird. Verlasse dich auf diese Ansicht für deine Entscheidungen.

Automatische Updates: Du musst die Vorschau nicht manuell aktualisieren. Alle Änderungen werden sofort sichtbar.

Performance-Hinweis: Bei sehr umfangreichen Seiten kann das Laden der Vorschau etwas länger dauern. Das ist normal und beeinflusst nicht die Geschwindigkeit deiner fertigen Website.

Responsive Design: Teste deine Website in verschiedenen Bildschirmgrößen, um sicherzustellen, dass sie auf allen Geräten gut aussieht.

Schriftarten und Farben: Alle Design-Elemente werden in der Vorschau korrekt dargestellt, einschließlich spezieller Schriftarten und Farbverläufe.

Verwandte Seiten