Umfang des HTML

Was wir prüfen

Wir zählen alle HTML-Elemente der Startseite, von <html> bis zum letzten <span>.

• Mehr als 1500 Elemente: Hinweis.
• Mehr als 3000 Elemente: Warnung.

Erkennen wir einen Page-Builder, nennen wir ihn im Bericht als wahrscheinliche Ursache.

Warum das wichtig ist

Der Browser baut aus dem HTML einen Baum aller Elemente, das sogenannte DOM. Je grösser dieser Baum, desto mehr Arbeit:

• Beim Laden muss der Browser jedes Element verarbeiten, Stile berechnen und die Position bestimmen.
• Bei jeder Änderung, etwa beim Öffnen eines Menüs, beim Scrollen mit Animationen oder beim Nachladen von Inhalten, muss er Teile davon neu berechnen.
• Auf dem Smartphone fehlt die Rechenleistung eines Computers. Ältere oder günstige Geräte reagieren dann träge, Klicks kommen verzögert an.

Das wirkt sich direkt auf die Kennzahlen aus, die Google misst, vor allem auf die Reaktionszeit (INP).

Häufige Ursachen:

• Page-Builder verschachteln jedes Element in mehrere Container: Abschnitt › Spalte › Widget-Wrapper › Inhalt-Wrapper › Element.
• Mega-Menüs mit Hunderten Links, die auf jeder Seite vollständig im HTML stehen.
• Doppelte Inhalte für Desktop und Smartphone, von denen je eine Fassung versteckt ist.
• Lange Listen wie alle Produkte, alle Referenzen oder alle Bewertungen auf der Startseite.
• Icons als einzelne SVG-Elemente mit vielen Pfaden.

So behebst Du es

Page-Builder schlanker einstellen

• Elementor: Unter «Einstellungen › Funktionen» das «Optimierte DOM» bzw. die «Flexbox-Container» aktivieren. Die neuen Container erzeugen deutlich weniger Verschachtelung als die alten Abschnitte und Spalten.
• Divi und andere: Aktuelle Versionen erzeugen meist schlankeren Code. Halte den Builder aktuell.

Inhalte reduzieren

• Zeig auf der Startseite eine Auswahl, etwa drei Referenzen und drei Bewertungen, und verlinke auf eine Seite mit allen.
• Vermeide Elemente, die nur auf Desktop oder nur auf Smartphone erscheinen. Ein responsives Element, das sich anpasst, ist schlanker als zwei getrennte.
• Lass Mega-Menüs von der betreuenden Agentur prüfen: Brauchen Besucher wirklich jeden Link auf jeder Seite?

Verschachtelung prüfen

Ein Abschnitt mit einer Überschrift und einem Absatz braucht keine sechs Ebenen von Containern. Beim Neuaufbau einzelner Abschnitte lohnt es sich, auf schlanke Strukturen zu achten.

So prüfst Du es selbst

Öffne die Entwicklertools (F12), Reiter «Konsole», und gib document.querySelectorAll('*').length ein. Die Zahl ist die Anzahl der Elemente. PageSpeed Insights meldet zu grosse DOMs ebenfalls in der Diagnose.

Häufige Fragen

Wie viele Elemente sind normal?

Eine schlanke Startseite kommt mit 500 bis 1000 Elementen aus. Ab etwa 1500 wird es spürbar, besonders auf älteren Smartphones. Über 3000 ist fast immer ein Page-Builder oder ein überladenes Menü die Ursache.

Sieht man die Elemente auf der Seite?

Nur teilweise. Viele sind unsichtbare Container, die ein Page-Builder für das Layout verschachtelt, oder versteckte Inhalte wie Smartphone-Menüs, Pop-ups und Slider-Folien.