Website-Bilder prüfen: Gewicht, Format und Maße
Ihre Angaben
Ihr Ergebnis
Das Ergebnis erscheint hier, sobald Sie „Bilder prüfen“ wählen.
Erster Entwurf geschenkt, live ab 14,99 € netto/Monat im Jahresvertrag
Neue Website mit leichten Bildern – erst ansehen, dann entscheiden
Beschreiben Sie Ihr Unternehmen in wenigen Sätzen oder nennen Sie Ihre bisherige Website. Den ersten Entwurf Ihrer kompletten Website erstellen wir kostenlos, fertig in unter 24 Stunden. Die Bildoptimierung erledigt Cortexion danach jede Nacht automatisch.
- Erster Entwurf geschenkt
- In wenigen Minuten ausgefüllt
- Pflicht: Worum es geht, zwei, drei Sätze zu Ihrem Unternehmen, Name und E-Mail
- Ohne Anmeldung
Nach dem Absenden: Sie erhalten gleich eine E-Mail mit Bestätigungslink. Erst nach Ihrer Bestätigung legen wir los – wir lesen Ihre Angaben, die KI-Agentur baut Ihre Website, und Sie bekommen den Link zu Ihrem Entwurf per E-Mail, in unter 24 Stunden und ohne Anruf.
Jede spätere Änderung beauftragen Sie mit einem Satz. Gebucht wird erst zum Überarbeiten und Live-Stellen, ab 14,99 € netto im Monat im Jahresvertrag (Monatsvertrag 17,99 €) – alle Preise ansehen.
Angebot ausschließlich für Unternehmer (§ 14 BGB), juristische Personen des öffentlichen Rechts und öffentlich-rechtliche Sondervermögen. Alle Preise netto zzgl. gesetzlicher Umsatzsteuer.
Echte Websites aus dem Builder: cortexion.ai deutsche-tanktechnik.de lichtmast-mieten.de und diese Website selbst
Was der Test nicht sieht
Der Test liest das HTML der Startseite, wie unser Server es erhält, und führt keine Skripte aus. Diese Bilder bleiben ihm deshalb verborgen:
- CSS-Hintergrundbilder: Bilder, die ein Stylesheet als Hintergrund setzt, stehen nicht im HTML.
- Per JavaScript nachgeladene Bilder: Lädt erst ein Skript im Browser ein Bild, etwa beim Scrollen, sieht der Test es nicht. Solche Bilder tragen ihre Adresse oft in data-src statt in src.
- Eingebettete Bilder (data:): Sie stehen direkt im HTML und haben keine eigene Adresse; der Test ruft sie nicht ab.
- Unterseiten: Geprüft wird nur die Startseite.
- Varianten im srcset: Welche Variante ein Besucher erhält, hängt von seinem Bildschirm ab. Der Test ruft nur die Adresse in src ab.
So werden Bilder kleiner
Die meisten schweren Bilder lassen sich ohne sichtbaren Verlust deutlich verkleinern. Diese vier Schritte helfen am meisten:
- Auf Anzeigegröße verkleinern: Speichern Sie ein Bild nicht viel größer, als es auf der Seite erscheint. Ein Foto direkt aus der Kamera ist meist um ein Vielfaches zu groß.
- Als WebP oder AVIF speichern: Diese Formate sind bei gleicher Qualität in der Regel deutlich kleiner als JPEG und PNG. Für ältere Browser bleibt das bisherige Bild über picture und source als Ersatz stehen.
- Qualität senken: Beim Speichern lässt sich die Qualität einstellen. Ein kleiner Schritt nach unten ist meist nicht zu sehen und spart spürbar Gewicht.
- Bilder unterhalb des sichtbaren Bereichs verzögert laden: Mit loading="lazy" lädt der Browser sie erst, wenn Besucher in ihre Nähe scrollen. Das wichtigste Bild oben auf der Seite laden Sie dagegen nie verzögert.
Bilder sind nur eine Bremse von mehreren. Welche anderen es gibt, woran Sie sie erkennen und wann ein Neubau mehr bringt, steht in unserem Ratgeber.
Website langsam? Bremsen erkennen und wann ein Neubau mehr bringt
So prüfen wir
Das Werkzeug liest das HTML Ihrer Startseite so, wie unser Server es erhält, und ruft jedes Bild einmal ab. Gewicht, Format und Pixelmaß stammen aus diesem Abruf, Alt-Texte und Größenangaben aus dem HTML; an jedem Punkt steht, woher der Befund kommt.
Der Weg zum Ergebnis
- Aus Ihrer Eingabe wird der reine Domainname. Wir prüfen nur Websites, die öffentlich im Internet stehen.
- Unser Server ruft die Startseite auf und liest ihr HTML. Als Bilder zählen jedes img und das Open-Graph-Bild. Steht ein img in einem picture, zählt die erste source ohne media-Angabe, deren Format ein aktueller Browser kennt, sonst das img selbst.
- Wir zählen auf zwei Arten und schreiben jede Zahl mit ihrer Art: „Bilddateien“ zählen jede Adresse einmal, auch wenn die Seite sie mehrfach zeigt; nur sie rufen wir ab und wiegen sie. „Bilder im HTML (img)“ zählen jedes img-Element, auch eingebettete ohne eigene Datei. Darauf beziehen sich Alt-Texte, Breite und Höhe.
- Hat ein Bild ein srcset, rufen wir nur die Adresse in src ab. Beim srcset prüfen wir, ob es da ist und richtig geschrieben ist, nicht jede Variante. Relative Adressen und Adressen mit // am Anfang lösen wir gegen die Adresse der Seite auf.
- Wir prüfen höchstens 30 verschiedene Bilder, in der Reihenfolge im HTML. Von jedem Bild lesen wir nur die ersten 64 KB: Daraus kommen Format und Pixelmaß, die Größe der ganzen Datei kommt aus den HTTP-Headern. Fehlt eine Angabe, steht dort „nicht ermittelbar“; wir schätzen nicht.
- Bilder auf anderen Servern, etwa einem CDN, rufen wir ebenfalls ab; jede Adresse durchläuft vorher dieselbe Zielprüfung wie die Startseite. Je Abruf warten wir höchstens 4 Sekunden, auf alle Bilder zusammen höchstens 15 Sekunden. Je Prüfung rufen wir höchstens 40 Adressen ab, die Startseite eingerechnet. Was dabei offen bleibt, steht als „nicht geprüft“ mit dem Grund da.
- Gewicht je Bild: bis 250 KB in Ordnung, über 250 KB eine Warnung, über 1 MB ein Fehler (1 MB sind 1.024 KB). Das Ergebnis nennt die 5 schwersten Bilder mit Adresse, Größe, Format und Pixelmaß.
- Gesamtgewicht der Bilder der Seite: bis 1,5 MB in Ordnung, bis 4 MB eine Warnung, darüber ein Fehler. Das Open-Graph-Bild zählt hier nicht mit, denn Besucher laden es nicht.
- Format: JPEG- und PNG-Bilder über 100 KB ohne WebP- oder AVIF-Fassung in picture und source sind ein Hinweis.
- Größe passend zur Anzeige: Steht im width-Attribut eine Zahl und ist das Bild mehr als doppelt so breit und breiter als 800 Pixel, ist das eine Warnung. Ohne Zahl (etwa „100%“ oder „auto“) und bei Bildern mit srcset treffen wir keine Aussage. Ein fehlerhaft geschriebenes srcset ist ein Hinweis.
- Alt-Texte und Maße: Ein img ohne alt-Attribut ist eine Warnung; ein leeres alt="" ist für Schmuckbilder in Ordnung. Ein img ohne width und height ist ein Hinweis.
- Alle Schwellen sind Richtwerte. Wie schwer ein Bild sein darf, hängt vom Bild ab: Ein großes Foto oben auf der Seite darf mehr wiegen als ein kleines Symbol.
- Das Ergebnis einer Domain bewahren wir 10 Minuten auf. Wird sie in dieser Zeit noch einmal geprüft, zeigen wir es mit der Uhrzeit der ursprünglichen Prüfung.
Annahmen und Grenzen
- Wir fragen die Bilder an wie ein aktueller Browser, der WebP und AVIF kennt. Liefert ein Server je nach Gerät andere Dateien aus, erhalten Ihre Besucher womöglich andere.
- Die Größe ist die Größe der Datei, die der Server überträgt. Wann ein Bild im Browser erscheint und ob es erst beim Scrollen lädt, misst dieses Werkzeug nicht.
- Das Ergebnis speichern wir mit Domain und Prüfzeit 10 Minuten lang, ohne Bezug zu Ihnen. Zum Schutz vor Missbrauch sind je Besucher 20 Prüfungen in der Stunde möglich und je Domain 30 Prüfungen in der Stunde über alle Besucher; das gilt auch für die Domains, von denen die Bilder kommen.
Häufige Fragen
Fragen zu diesem Werkzeug
Etwas offen geblieben? Schreiben Sie uns per E-Mail an hello@cortexion.ai oder unter +49 221 67763990.
Eine feste Grenze gibt es nicht; es hängt vom Bild ab. Als Richtwerte nutzt dieses Werkzeug 250 KB für ein einzelnes Bild und 1,5 MB für alle Bilder einer Seite zusammen. Ein großes Foto oben auf der Seite darf mehr wiegen als ein kleines Symbol. Wichtiger als die Zahl ist, dass ein Bild nicht mehr Pixel hat, als es auf der Seite braucht, und in einem modernen Format vorliegt.
Für Fotos auf Websites in der Regel WebP oder AVIF: Beide Formate sind bei gleicher Qualität meist deutlich kleiner als JPEG, und aktuelle Browser zeigen sie an. AVIF ist oft noch etwas kleiner als WebP. JPEG bleibt als Ersatz für ältere Browser sinnvoll, eingebunden über picture und source. Für Logos und Grafiken mit klaren Flächen eignet sich oft SVG.
Der Alt-Text im alt-Attribut beschreibt in wenigen Worten, was ein Bild zeigt. Screenreader lesen ihn blinden und sehbehinderten Menschen vor, und er erscheint, wenn ein Bild nicht lädt. Auch Suchmaschinen verstehen Bilder über diesen Text. Reine Schmuckbilder erhalten ein leeres alt="", damit Screenreader sie überspringen.
Mit loading="lazy" lädt der Browser ein Bild erst, wenn Besucher in seine Nähe scrollen. Die Seite erscheint dadurch schneller, und wer nicht bis unten scrollt, lädt die Bilder dort gar nicht. Das gilt nur für Bilder unterhalb des sichtbaren Bereichs: Das wichtigste Bild oben laden Sie nie verzögert, sonst erscheint es später.
Meist, weil der Browser die Maße eines Bildes erst kennt, wenn es geladen ist. Bis dahin hält er keinen Platz frei, und sobald das Bild erscheint, rutscht der Text darunter nach unten. Das stört beim Lesen, führt zu Fehlklicks und fließt bei Google als „Layout Shift“ in die Bewertung der Ladeerfahrung ein. Abhilfe: Geben Sie bei jedem Bild width und height an.
Erstellt vom Cortexion-Team · Stand: