Bilder werden nicht angezeigt: HTML-Pfade richtig prüfen
Fehlende Bilder sind einer der häufigsten Gründe, warum ein Website-Entwurf unfertig wirkt.
Das Problem
Ein img-Tag verweist nur auf eine Datei. Wenn diese Datei nicht mitgeliefert wurde oder der Pfad nicht zur Ordnerstruktur passt, bleibt das Bild leer. Besonders häufig passieren Fehler bei verschachtelten Ordnern, Leerzeichen im Namen, Großschreibung und exportierten CMS- oder Build-Projekten.
Einfache Lösung
- Suchen Sie im HTML nach src="..." und prüfen Sie, ob die Datei im ZIP existiert.
- Lassen Sie Bilder im selben relativen Pfad wie im HTML verlinkt.
- Vermeiden Sie nachträgliches Umbenennen von Bilddateien.
- Prüfen Sie, ob Bilder aus externen Domains geladen werden und ob das gewollt ist.
- Nutzen Sie Alt-Texte, damit die Seite verständlich bleibt, auch wenn ein Bild nicht lädt.
Typische Fehler
- Bilderordner beim Versand vergessen.
- Datei heißt hero.JPG, HTML erwartet hero.jpg.
- Bilder aus einem lokalen Desktop-Ordner verlinken.
- Sehr große Bilder ungeprüft in Restaurant- oder Portfolioseiten einbauen.
Checkliste
- Alle img-src-Dateien vorhanden
- Groß-/Kleinschreibung stimmt
- Keine lokalen Rechnerpfade
- Alt-Texte vorhanden
- Bildgrößen für Mobilgeräte geprüft
- Externe Bildquellen bewusst entschieden
FAQ
Warum funktioniert das Bild auf meinem Rechner, aber nicht beim Kunden?
Dann zeigt der Pfad wahrscheinlich auf eine Datei, die nur auf Ihrem Rechner existiert.
Sind Leerzeichen in Bildnamen erlaubt?
Technisch ja, praktisch sind einfache Namen mit Bindestrichen robuster.
Sollte ich Bilder lokal speichern?
Für statische Übergaben ist das meistens am zuverlässigsten und transparenter für Datenschutzprüfungen.