Wenn die Seite gezeichnet wird und die Bilder kaputt sind, ist das HTML in Ordnung und etwas an den Bildanfragen nicht. Öffnen Sie den Netzwerk-Tab, laden Sie neu und lesen Sie die Statusspalte an den vier Ursachen unten entlang.

404 — der Pfad stimmt nicht

curl -sSI https://yourdomain.com/img/rack.webp | head -1
ls -la /var/www/site/public/img/rack.webp

Unter Linux unterscheidet der Dateiname Groß- und Kleinschreibung. Rack.webp und rack.webp sind verschiedene Dateien — deshalb verliert eine unter Windows oder macOS entwickelte Website ihre Bilder in dem Moment, in dem sie ausgerollt wird.

403 — sie existiert und ist nicht lesbar

sudo -u www-data test -r /var/www/site/public/img/rack.webp && echo readable || echo NOT readable
namei -l /var/www/site/public/img/rack.webp

namei geht jedes Verzeichnis des Pfades ab. Ein einziges übergeordnetes Verzeichnis ohne Ausführrecht blockiert alles darunter, während die Datei selbst tadellos aussieht.

Blockiert, oder gemischte Inhalte

Ein über http angefordertes Bild auf einer https-Seite wird vom Browser blockiert und in der Konsole als gemischter Inhalt gemeldet. Siehe Gemischte Inhalte nach der Umstellung auf HTTPS. Und ein Werbeblocker verwirft alles, dessen Pfad Wörter wie ads oder banner enthält.

200 und trotzdem nicht sichtbar

  • Die Datei hat nicht das Format, das ihr Name behauptet — etwa eine HTML-Fehlerseite, gespeichert als .jpg.
  • Ein CDN hat einen zwischengespeicherten Fehler geliefert. Leeren Sie diesen Pfad und fordern Sie ihn erneut an.
  • Das Bild ist da und hat null Höhe — das ist CSS, nicht die Datei.
file /var/www/site/public/img/rack.webp
curl -sS https://yourdomain.com/img/rack.webp | head -c 20 | xxd | head -2
Ist lokal alles in Ordnung und nur über einen Proxy kaputt, fragen Sie den Ursprung direkt mit --resolve ab und vergleichen Sie. Das halbiert das Problem mit einem einzigen Befehl.