In der digitalen Welt von heute ist Online-Werbung ein wichtiger Bestandteil des kostenlosen Webs, das wir alle gerne nutzen. Schlecht implementierte Anzeigen können jedoch das Surfen verlangsamen, die Nutzer frustrieren und die Interaktion abnehmen. Hier erfahren Sie, wie Sie Anzeigen effektiv laden, ohne die Seitengeschwindigkeit zu beeinträchtigen, und wie Sie für eine nahtlose Nutzererfahrung sorgen und die Umsatzmöglichkeiten für Websiteinhaber maximieren.
Online-Werbung ist die Haupteinnahmequelle für Websites. Das Vorhandensein von Anzeigen auf Websites kann jedoch die Nutzererfahrung und die Gesamtleistung der Seite beeinträchtigen. Daher ist es von entscheidender Bedeutung, ein Gleichgewicht zwischen Monetarisierung und Leistung für Websiteinhaber und Werbetreibende und die Nutzererfahrung zu finden.
Nehmen wir als Beispiel eine Website, auf der Anzeigen umfassend im Content platziert werden und die darauf abzielen, hohe Einnahmen zu generieren. Die große Anzahl an Anzeigen frustriert die Nutzer jedoch, was zu einer schlechten Nutzererfahrung und hohen Absprungraten führt. Trotz des Potenzials für beträchtliche Einnahmen aus Anzeigen beeinträchtigt der Abbruch der Website den Erfolg der Website erheblich.
Eine Website ohne Anzeigen Diese werbefreie Umgebung zieht aufgrund der kurzen Ladezeiten und des nahtlosen Surfens viele Nutzer an. Ohne eine Monetarisierungsstrategie hat die Website jedoch Schwierigkeiten, Umsatz zu generieren, was ihre langfristige Nachhaltigkeit und ihr Wachstum beeinträchtigen kann.
Beide Szenarien veranschaulichen, wie wichtig es ist, eine gute Balance zwischen Monetarisierung, Nutzern und Leistung zu schaffen.
Core Web Vitals nutzen
Es ist unerlässlich, die Core Web Vitals zu bestehen, wenn Anzeigen geladen werden sollen, ohne die Seitengeschwindigkeit zu beeinträchtigen. Core Web Vitals, bestehend aus Messwerten wie Largest Contentful Paint (LCP), Cumulative Layout Shift (CLS) und Interaction to Next Paint (INP), sind Messwerte zur Nutzererfahrung, die die Qualität der Nutzererfahrung auf Ihrer Website messen.
Largest Contentful Paint (LCP)
Sie sollten sich auf die Optimierung des LCP konzentrieren, da dieser Messwert die Zeit misst, die benötigt wird, bis das größte inhaltsbezogene Element im Darstellungsbereich sichtbar ist. Indem sie die Ladezeit von Anzeigeninhalten minimieren und asynchrone Ladeverfahren priorisieren, können Websiteinhaber den LCP-Wert reduzieren und die Renderingzeit der auffälligsten inhaltsreichen Elemente auf einer Seite verkürzen.
Interaction to Next Paint (INP)
Zweitens ist eine Verbesserung des INP entscheidend für eine reaktionsschnelle Nutzererfahrung. INP misst die Latenz für jeden einzelnen Klick, jedes Tippen und jede Tastaturinteraktion während der Lebensdauer einer Seite. Der sich daraus ergebende Wert ist meist die Interaktion, die am längsten gedauert hat. Dieser Wert ist repräsentativ für die allgemeine Fähigkeit einer Seite, schnell auf Nutzerinteraktionen zu reagieren.
Anzeigen, die Interaktionen von Nutzern verzögern, wirken sich negativ auf INP aus. Dies kann Nutzende frustrieren, da User Experiences geschaffen werden, die sich träge oder in extremen Fällen sogar ganz kaputt anfühlen. Wenn Sie Lazy Loading für Anzeigen implementieren und die nicht kritische JavaScript-Ausführung aufschieben, kann die INP-Rate einer Seite reduziert und damit die Reaktionszeit insgesamt verbessert werden.
Cumulative Layout Shift (CLS)
Schließlich misst CLS die visuelle Stabilität einer Seite, indem gemessen wird, wie viele unerwartete Layoutverschiebungen beim Seitenaufbau auftreten. Anzeigen, deren Größe dynamisch geladen oder geändert wird, können zu Layout-Instabilität führen. Dies kann die Nutzererfahrung beeinträchtigen und dazu führen, dass Nutzer entweder den Überblick verlieren, wo sie sich auf einer Seite befinden, oder aufgrund unerwarteter Layoutverschiebungen unbeabsichtigt auf die falschen Elemente tippen. Um dies zu vermeiden, sollten Websiteinhaber die CLS optimieren, um sicherzustellen, dass Anzeigen über reservierten Platz verfügen, um Layoutverschiebungen zu verhindern. Außerdem sollten die Anzeigengrößen optimiert werden, um plötzliche Content-Reflows zu verhindern.
Webseite in verschiedene Inhaltsblöcke unterteilen
Wenn Sie Ihre Webseite mit Inhaltsblöcken für Text-, Bild- und Anzeigencontent strukturieren und gleichzeitig die CSS-Eigenschaft content-visibility: verwenden, kann die Renderingzeit in modernen Browsern erheblich verkürzt werden.
Durch das strategische Anwenden der Eigenschaft content-visibility: innerhalb dieser Inhaltsblöcke optimieren Sie den Renderingprozess für Text-, Bild- und Anzeigeninhalte. So wird sichergestellt, dass nur die Inhalte vollständig gerendert werden, die sich derzeit im Darstellungsbereich befinden. Das führt zu einem schnelleren ersten Seitenaufbau und reibungsloseren Nutzerinteraktionen. Diese Leistungssteigerung ist besonders nützlich, wenn es sich um lange Anzeigen oder Seiten mit vielen Anzeigen handelt.
Wichtige Anzeigenflächen priorisieren
Nicht alle Anzeigenflächen sind gleich. Beispielsweise sind Anzeigenflächen, die ohne Scrollen sichtbar sind, in Bezug auf Sichtbarkeit und Monetarisierung in der Regel wertvoller als solche, die nur mit Scrollen sichtbar sind. Dies liegt daran, dass Anzeigen, die ohne Scrollen sichtbar sind, im ersten Darstellungsbereich ohne Scrollen sichtbar sind und von Nutzern eher gesehen werden. „Below the fold“-Anzeigen werden eingeblendet, wenn der Nutzer weit genug nach unten scrollt, um sie zu sehen.
„Above the fold“-Anzeigen
„Above the fold“-Anzeigenflächen beziehen sich auf den Teil einer Webseite, der ohne Scrollen sichtbar ist und einen bedeutenden Wert in der digitalen Werbung hat. Diese erstklassigen Placements sind aus mehreren Gründen nützlich:
- Anzeigen, die ohne Scrollen sichtbar sind, sind für Nutzer unmittelbar nach dem Laden einer Webseite sichtbar. Die Wahrscheinlichkeit, dass Nutzer diese Anzeigen bemerken und mit ihnen interagieren, führt zu höheren Klickraten.
- Werbetreibende betrachten häufig den oberen Teil einer Webseite als die wertvollste Immobilie. Sie ist der erste Eindruck, den Nutzer beim Besuch einer Website erhalten. Daher ist sie ein entscheidender Bereich für die Präsentation wirkungsvoller Premium-Anzeigen.
- Anzeigen „above the fold“ haben die höchsten Sichtbarkeitsraten, da sie für den Nutzer direkte Sichtverbindung haben. So wird sichergestellt, dass die meisten Nutzer, die die Seite besuchen, diese Anzeigen sehen, ohne nach unten scrollen zu müssen.
Es ist jedoch wichtig, ein Gleichgewicht zwischen Monetarisierung und Nutzererfahrung zu finden, wenn Sie Anzeigenflächen, die ohne Scrollen sichtbar sind, in der ersten Ansicht verwenden. Hier sind einige wichtige Überlegungen:
- Anzeigenflächen auf dem ersten Bildschirm sollten so schnell wie möglich im ersten Darstellungsbereich des Nutzers geladen werden. Anzeigen, die zu langsam geladen werden, können sich negativ auf die Nutzererfahrung auswirken und zu höheren Absprungraten führen. Die Optimierung der Ladezeiten von Anzeigen ist von entscheidender Bedeutung, um für eine reibungslose Nutzererfahrung beim Surfen zu sorgen.
- Anzeigen-Placements „above the fold“ sind zwar wertvoll, es ist jedoch wichtig, diese Premiumfläche nicht mit zu vielen Anzeigen zu überlasten. Übermäßig viele Anzeigen überladen die Seite, beeinträchtigen die Lesbarkeit des Inhalts und beeinträchtigen die Nutzererfahrung. Versuche, ein Gleichgewicht zwischen Monetarisierung und einem übersichtlichen, nutzerfreundlichen Layout zu finden.
- Stellen Sie sicher, dass die Anzeigenflächen, die ohne Scrollen sichtbar sind, mit verschiedenen Bildschirmgrößen und Geräten kompatibel sind. Mit responsiven Designs können Sie für ein einheitliches und visuell ansprechendes Layout sorgen – unabhängig von der Bildschirmgröße des Nutzers.
„Below the fold“-Anzeigen
Auch „Below the fold“-Anzeigenflächen, also Anzeigen in dem Teil einer Webseite, der erst nach dem Scrollen sichtbar wird, sind in der Welt der digitalen Werbung von großem Wert. Diese Placements bieten einzigartige Vorteile, die „above the fold“-Placements ergänzt werden.
Anzeigen, die nur mit Scrollen sichtbar sind, profitieren von Nutzern, die nach unten scrollen, um sich weitere Inhalte anzusehen. Diese Placements erregen die Aufmerksamkeit aktiver Nutzer, die aktiv nach zusätzlichen Informationen suchen, und machen sie für Unternehmen wertvoll, die komplexere Werbebotschaften oder Storytelling vermitteln möchten.
- Anzeigenflächen, die anfänglich nicht sichtbar sind, können zum angrenzenden Inhalt passen, was eine Chance für kontextbezogene Relevanz bietet. Diese Ausrichtung kann zu mehr Nutzerinteraktionen führen, da Nutzer Anzeigen entdecken, die einen Bezug zu den Inhalten haben, die sie sich ansehen.
- Durch ein durchdachtes Design können „below the fold“-Anzeigen nahtlos in den umgebenden Content eingebunden werden und sind für Nutzer weniger störend. Diese Integration – auch als native Werbung bezeichnet – kann zu einer harmonischen Nutzererfahrung führen.
- Anzeigen-Placements, für die Scrollen erforderlich ist, bieten mehr Gestaltungs- und Formatflexibilität mit reichlich Platz und Freiheit beim Experimentieren. Videoanzeigen, interaktive Elemente und größere Bilder können mit Lazy Loading ausgeliefert werden, um die Aufmerksamkeit der Nutzer zu wecken, ohne sie zu stören.
Bei Anzeigen-Placements "below the fold" (mit Scrollen sichtbar) sind jedoch folgende Aspekte zu berücksichtigen:
- Anzeigen-Placements „below the fold“ können effektiv sein, aber es muss unbedingt sichergestellt werden, dass Nutzer zum Scrollen nach unten scrollen. Mit visuellen Hinweisen oder Inhaltsteasern können Sie Nutzer dazu anregen, sich weitere Inhalte anzusehen, und so die Wahrscheinlichkeit erhöhen, dass die Anzeige zu sehen ist.
- Die Platzierung von Anzeigen „below the fold“ (mit Scrollen sichtbar) sollte die Qualität oder Lesbarkeit des Contents nicht beeinträchtigen. Für ein ausgewogenes Verhältnis zwischen Anzeigen und Content sorgen, um die Nutzer nicht zu überfordern und für eine positive Nutzererfahrung zu sorgen.
- Im Gegensatz zu Anzeigen-Placements, die ohne Scrollen sichtbar sind, müssen Anzeigen, die mit Scrollen sichtbar sind, möglicherweise nicht sofort geladen werden. Wenn Sie das Laden dieser Anzeigen verzögern, bis sie kurz vor dem Darstellungsbereich des Nutzers erscheinen, können Sie die Ladezeit der Seite insgesamt verbessern und die anfänglichen Seitenrenderingzeiten verkürzen.
Strategischer Einsatz von „Below the fold“-Anzeigen können „Above the fold“-Anzeigen ergänzen und eine Plattform für kreative Anzeigenformate und kontextabhängige Relevanz bieten. Für eine positive Nutzererfahrung sind jedoch die Optimierung der Sichtbarkeit, ein ausgewogenes Verhältnis der Inhalte und die Verwaltung des Timings von Anzeigen entscheidend.
Aktuelle Best Practices für Google Publisher-Tags (GPTs):
- Allgemeine Best Practices
- Best Practices für Anzeigen
- Layout Shift minimieren
- Leistung beobachten
- Häufige Implementierungsfehler vermeiden
Anzeigen mit Lazy Loading
Beim Lazy Loading werden nicht kritische Ressourcen erst dann geladen, wenn sie benötigt werden. Wenn Sie Lazy Loading auf Anzeigen anwenden, die nicht sofort sichtbar sind (also „Below the fold“-Anzeigen), wird sichergestellt, dass sie nur dann geladen werden, wenn sie sichtbar sind. Dadurch wird Bandbreite gespart und die Seitengeschwindigkeit insgesamt wird verbessert. Browser nutzen jetzt natives Lazy Loading für iFrames mit einem einfachen loading=lazy-Attribut.
Durch die Implementierung von Lazy Loading werden Anzeigen dynamisch abgerufen, wenn sie kurz vor dem Darstellungsbereich des Nutzers erscheinen. Dadurch werden die anfängliche Ladezeit und die Total Blocking Time (TBT) (die stark mit INP korreliert) im Hauptthread in diesem wichtigen Teil des Seitenlebenszyklus reduziert. Dadurch werden negative Auswirkungen auf die Nutzerfreundlichkeit minimiert.
Anzeigen ohne Aktualisierung der Seite aktualisieren
Ein weiteres Verfahren, mit dem Sie ein Gleichgewicht zwischen der Seitenleistung und dem Laden von Anzeigen finden können, ist die Möglichkeit, Anzeigen alle 30 bis 240 Sekunden1 zu aktualisieren, ohne die gesamte Seite neu laden zu müssen. Bei diesem Ansatz können Anzeigeninhalte dynamisch aktualisiert werden, ohne dass es zu Störungen beim Browsen des Nutzers oder zu unnötigen Verzögerungen kommt.
In mobilen Apps führt die Aktualisierung von Anzeigen in vorhandenen Webansichten zu einer besseren Leistung als durch das Aktualisieren der gesamten Seite oder das Neuerstellen von WebViews, da dadurch der Daten- und Ressourcenaufwand minimiert wird. Dies führt zu schnelleren Aktualisierungen von Inhalten und einer reibungsloseren Nutzererfahrung, ohne die Latenz, die mit dem Neuladen der Seite verbunden ist.
Durch die asynchrone Aktualisierung von Anzeigen können Websiteinhaber den Seiteninhalt intakt halten und gleichzeitig den Anzeigeninhalt nahtlos direkt und in Echtzeit aktualisieren. Dadurch wird nicht nur die Seitengeschwindigkeit verbessert, weil die gesamte Seite nicht neu geladen werden muss. Außerdem wird so dafür gesorgt, dass die ausgelieferten Anzeigen relevant und ansprechend bleiben. Mit dieser Technik können Websiteinhaber ein Gleichgewicht zwischen Monetarisierung und Leistung finden, indem sie zeitnah ansprechende Anzeigeninhalte bereitstellen und gleichzeitig negative Auswirkungen auf die Nutzererfahrung minimieren.
Das Aktualisieren von Anzeigenflächen lohnt sich besonders auf Seiten, auf denen Nutzer tendenziell länger verweilen, wie Rezeptseiten, DIY-Anleitungen oder andere inhaltsreiche Websites. Auf einer Bastelseite für Heimwerker, auf der die Nutzer möglicherweise viel Zeit mit dem Befolgen der Anleitungen verbringen, kann das strategische Aktualisieren von Anzeigenflächen in den Pausen zwischen den Schritten oder beim Ansehen von Bildergalerien sowohl die Nutzererfahrung als auch die Werbeeinnahmen verbessern. Auf einer Rezeptseite kann das Aktualisieren der Anzeigenflächen, nachdem die Nutzer durch die Zutatenliste oder die Anweisungen gescrollt haben, das Interesse der Nutzer aufrechterhalten.
Asynchrones Laden priorisieren
Eine der wirkungsvollsten Strategien zur Verbesserung der Seitengeschwindigkeit beim Ausliefern von Anzeigen ist das asynchrone Laden. Beim asynchronen Laden werden Anzeigen unabhängig vom Inhalt der Hauptwebseite geladen. So kann die Seite weiter gerendert werden und interaktiv werden, ohne warten zu müssen, bis die Anzeigen vollständig geladen sind. Dadurch wird die empfundene Ladezeit deutlich verkürzt und so die Zufriedenheit der Nutzer erhöht.
Fügen Sie das Attribut async in die Skript-Tag-Definition ein. Beispiel:
AdSense:
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
AdSense (automatische Anzeigen):
<script async data-ad-client="ca-pub-xxxxxxxxxxxxxxxx" src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
Google Publisher-Tag:
<script async src="https://securepubads.g.doubleclick.net/tag/js/gpt.js"></script>
Anzeigengrößen, -position und -formate optimieren
Größe, Position und Format von Anzeigen können einen erheblichen Einfluss auf die Seitengeschwindigkeit haben. Große Anzeigen können den Seitenaufbau verlangsamen und somit zu Frustration bei den Nutzern führen. Um dies zu vermeiden, sollten Websiteinhaber eng mit den Werbetreibenden zusammenarbeiten, um die Anzeigengrößen und -formate zu optimieren. Wenn Sie komprimierte Bildformate und ein effizientes Anzeigen-Creative verwenden, lassen sich die Dateigrößen reduzieren, ohne die Bildqualität zu beeinträchtigen. Durch diese Optimierungen wird nicht nur die Seitengeschwindigkeit verbessert, sondern auch der Datenverbrauch für Nutzer mit eingeschränkter Bandbreite minimiert.
Better Ads Standards
Die Einhaltung des Better Ads Standards ist für die Auslieferung von Anzeigen unerlässlich. Dadurch wird nicht nur die Nutzerfreundlichkeit verbessert, weil aufdringliche und störende Anzeigenformate reduziert werden, sondern es wirkt sich auch positiv auf die Positionierung und Seitenladezeit der Anzeigen aus.
Bei Einhaltung dieser Standards werden Anzeigen eher an Positionen platziert, die weniger aufdringlich und aufdringlich sind. Das kann zu mehr Nutzerinteraktionen und einer höheren Klickrate führen.
Darüber hinaus kann die Einhaltung dieser Richtlinien zu einer schnelleren Seitenladegeschwindigkeit führen, da leichtere, weniger ressourcenintensive Anzeigenformate bevorzugt werden, wodurch die Website-Leistung insgesamt und die Zufriedenheit der Nutzer verbessert werden.
Strategische Bewertung von Werbenetzwerken und Anbietern
Nicht alle Werbenetzwerke und Anbieter bieten die gleiche Leistung. Für eine optimale Seitengeschwindigkeit sollten Websiteinhaber die Leistung der verschiedenen Werbenetzwerke, der Header Bidding-Implementierung und der Anbieter sorgfältig bewerten.
Partnerschaften mit Anbietern, bei denen Geschwindigkeit im Vordergrund steht und die nachweislich einfache Anzeigeninhalte effizient bereitstellen, kann die Seitenleistung erheblich steigern und die Nutzerfreundlichkeit verbessern.
Fazit
Für Websiteinhaber, die eine außergewöhnliche Nutzererfahrung bieten und gleichzeitig die Einnahmen durch Onlinewerbung maximieren möchten, ist es von entscheidender Bedeutung, ein Gleichgewicht zwischen Monetarisierung und Leistung zu finden.
Mit Methoden wie asynchronem Laden, Lazy Loading, Optimieren von Anzeigenformaten und -größen, intelligentem Caching und sorgfältiger Bewertung von Werbenetzwerken sowie Header Bidding und Anbietern können Websiteinhaber die Herausforderungen beim Laden von Anzeigen bewältigen, ohne die Seitenleistung zu beeinträchtigen. Die Priorisierung einer effizienten Anzeigenauslieferung sorgt letztendlich für eine Schichtung der Nutzer, mehr Interaktionen und eine nachhaltige Umsatzgenerierung.
Fußnoten
- Für Ad-Server gelten möglicherweise Einschränkungen und Anforderungen. Beispielsweise müssen Publisher in Ad Manager ihr Inventar, das auf der Benutzeroberfläche aktualisiert wird, deklarieren. Bei einigen Käufern muss eine Aktualisierungsdeklaration größer oder gleich 240 Sekunden sein. Allgemein gilt: Je länger das Intervall zwischen den einzelnen Aktualisierungen ist, desto beliebter ist Ihr Inventar für Käufer. Weitere Informationen