Bilder fürs Web optimieren: Formate, responsive Größen und Ladeprioritäten
Eine kleinere Datei hilft, wenn der Browser das passende Bild zum richtigen Zeitpunkt erhält.
Tools
Arbeiten Sie mit nachvollziehbaren Prüfungen und speichern Sie den Fortschritt in diesem Browser.
Lokal in Ihrem Browser gespeichert. Es wird nichts an einen Server gesendet.
Der Fortschritt liegt im lokalen Browserspeicher. Es gibt kein Projektkonto und keine Synchronisierung zwischen Geräten oder Browsern. Gelöschte Websitedaten können auch den Fortschritt entfernen.
Die erledigte Anzahl beschreibt den Zustand der Liste, keine Performance-Note, Barrierefreiheitszertifizierung oder bestandene Core Web Vitals. Gleiche Vorlagen können durch Inhalt, Medien und Integrationen unterschiedliche Probleme zeigen.
Nutzen Sie die Punkte als Untersuchungsfragen. Ein LCP-Bild sollte nicht durch Lazy Loading verzögert werden; dennoch muss nicht jedes Bild sofort laden. Lange Cachelaufzeiten passen zu versionierten statischen Assets, private Seiten brauchen andere Regeln. Wenden Sie jede Prüfung im richtigen Kontext an.
Dokumentieren Sie URL, Gerät, Cachezustand, Komponente und Vorher-nachher-Aufzeichnungen in Ihren Projektaufgaben. Die Liste zeigt den Prozess, diese Belege zeigen das tatsächlich Geprüfte.
Mit dem gemessenen Engpass. Ein später erster Byteempfang weist zu Server und Cache, eine späte Bildanfrage zur Ressourcenentdeckung, eine langsame Interaktion zu Hauptthread und Rendering. Unerwartete Bewegung deutet auf fehlenden Platz hin.
Ist die Ursache unbekannt, wählen Sie mit der Core-Web-Vitals-Einführung einen Bericht und anschließend die Metrikanleitung. Einfache Kästchen zuerst abzuhaken kann produktiv wirken, ohne das Hauptproblem zu lösen.
Nein. Statische Publikation und personalisierte Handelsanwendung haben andere Grenzen. Manche Punkte erfordern Entscheidungen über Relevanz, Plattformkontrolle und Zielkonflikte. Notieren Sie nicht zutreffende Punkte extern; behaupten Sie keine Umsetzung allein für einen vollständigen Zähler.
Vermeiden Sie pauschale Zahlenregeln bei seitenabhängigen Kosten. DOM-Komplexität, Bildgrößen und Skriptaktivität brauchen repräsentative Messungen. Die JavaScript-Anleitung und die Anleitung zur Serverantwortzeit erklären diese Abhängigkeiten.
Nicht automatisch. Lokaler Speicher gehört zu diesem Browser und dieser Website. Andere Geräte, private Sitzungen oder gelöschte Profile können ihn nicht enthalten. Kopieren Sie die Zusammenfassung für dauerhafte Projektunterlagen. Teilen Sie dabei keine Zugangsdaten oder sensiblen Betriebsinformationen.
Prüfen Sie die Liste nach größeren Änderungen an Vorlagen, Plugins oder Integrationen erneut. Konkrete Verifikationsschritte pro Änderung sind langfristig hilfreicher als ein alter Erledigt-Zähler.
Eine kleinere Datei hilft, wenn der Browser das passende Bild zum richtigen Zeitpunkt erhält.
Eine Leistungsaufzeichnung zeigt, welchen Code Sie entfernen, verschieben, aufteilen oder in einen Worker auslagern sollten.
Steuern Sie Textsichtbarkeit, benötigte Schriftdateien und die Änderungen beim Eintreffen der endgültigen Schrift.