Einzelbild

Mit diesem Bereich fügst du ein einzelnes Bild zu deiner Seite hinzu. Du kannst die Größe des Bildes anpassen und entscheiden, ob es zentriert oder linksbündig angezeigt werden soll. Das ist ideal für Produktfotos, Illustrationen oder andere wichtige Bilder.

Voraussetzungen

• Ein Bild, das du auf deiner Seite anzeigen möchtest
• Eine Vorstellung davon, wie groß das Bild sein soll

Aufbau der Seite

Der Bereich besteht aus:

• Bildbereich: Das hochgeladene Bild in der gewählten Größe
• Größeneinstellung: Kontrolle über die Bildhöhe
• Ausrichtungsoptionen: Zentriert oder linksbündig

So arbeitest du mit dieser Seite

Bild hochladen

1. Klicke auf "Bild auswählen" oder "Bild hochladen"
2. Wähle ein Bild von deinem Computer aus
3. Das Bild wird automatisch hochgeladen und angezeigt
4. Unterstützte Formate: JPG, PNG, WebP, GIF

Bildgröße festlegen

1. Gib im Feld "Size" die gewünschte Höhe ein
   • Beispiel: "300px" für 300 Pixel Höhe
   • Beispiel: "50%" für halbe Bildschirmhöhe
   • Beispiel: "auto" für automatische Größe
2. Die Breite wird automatisch proportional angepasst
3. Das Bild behält immer sein ursprüngliches Seitenverhältnis

Ausrichtung wählen

1. Zentriert: Aktiviere das Kontrollkästchen "CenterImage"
   • Das Bild wird in der Mitte der Seite angezeigt
   • Ideal für Produktfotos oder wichtige Illustrationen
2. Linksbündig: Lasse das Kontrollkästchen deaktiviert
   • Das Bild wird am linken Rand ausgerichtet
   • Gut für Bilder in Fließtexten

Tipps und Hinweise

• Bildqualität: Verwende hochauflösende Bilder für die beste Darstellung
• Dateigröße: Achte darauf, dass die Bilder nicht zu groß sind (max. 2-3 MB)
• Seitenverhältnis: Das ursprüngliche Verhältnis wird immer beibehalten
• Responsive Design: Bilder passen sich automatisch an kleinere Bildschirme an
• Ladezeit: Große Bilder können die Seitenladezeit beeinträchtigen

Größenangaben verstehen

• Pixel (px): Feste Größe, z.B. "400px"
• Prozent (%): Relativ zur Seitengröße, z.B. "50%"
• Auto: Automatische Größe basierend auf dem Originalformat
• Viewport-Einheiten: "50vh" = 50% der Bildschirmhöhe

Verwendungsbeispiele

Produktfoto:

• Größe: "400px"
• Ausrichtung: Zentriert
• Verwendung: Einzelne Produktdarstellung

Illustration:

• Größe: "300px"
• Ausrichtung: Zentriert
• Verwendung: Erklärende Grafiken

Logo:

• Größe: "150px"
• Ausrichtung: Zentriert
• Verwendung: Firmenlogo oder Partnerlogos

Diagramm:

• Größe: "auto"
• Ausrichtung: Linksbündig
• Verwendung: Infografiken oder Statistiken

Häufige Probleme lösen

Bild zu groß:

• Reduziere die Größenangabe
• Verwende Prozentangaben für responsive Größen

Bild unscharf:

• Lade ein hochauflösenderes Bild hoch
• Vermeide zu starke Vergrößerungen

Bild lädt langsam:

• Komprimiere das Bild vor dem Hochladen
• Verwende moderne Formate wie WebP

Verwandte Seiten

• Bild mit Text - Für Bilder mit begleitendem Text
• Headerbild - Für große Kopfbilder
• Bildkarussell - Für mehrere wechselnde Bilder
• Logo-Leiste - Für mehrere Logos nebeneinander