Warum registrieren? Nur als registriertes Mitglied vom ABAKUS Forum hast Du vollen Zugriff auf alle Funktionen unserer Website.

HowTo: Google Adsense Code Performance optimiert einbauen

Alles zum Thema Google Adsense.
supervisior
PostRank 8
PostRank 8
Beiträge: 967
Registriert: 26.06.2006, 09:11

Beitrag von supervisior » 26.07.2018, 16:27

Dass die Ladegeschwindigkeit einer Webseite nicht erst seit gestern ein Ranking Faktor ist, sollte ja bekannt sein. Viele der vermeintlichen Optimierungsmaßnahmen lassen sich für den Nutzer aber gar nicht reproduzieren oder er merkt es gar nicht, sodass man mit dem was Google gerne hätte meist dann auch nur für Google interessant ist. Nicht generell, aber auch nicht so geringfügig, dass man es vernachlässigen könnte.

Es geht jetzt aber weniger primär um die Ladegschwindigkeit, um vorrangig Google zu bedienen, sondern das Nutzerverhalten zu beeinflussen. Die Ladegeschwindigkeit beeinflusst das Nutzerverhalten zwar auch, aber die Geschwindigkeit ist relativ bezogen auf was und wie viel geladen wird. Wenn man 5 Sekunden oder länger warten muss bis überhaupt was angezeigt wird, hat man ohnehin schon verloren und man braucht sich nicht wundern, wenn die Absprungrate schon während des Ladens exorbitant hoch ist. Das Problem daran ist nur, dass Google Analytics in jedem Fall und Matomo mit Einschränkung gar keine Informationen darüber liefern, wann der Absprung erfolgt. Sicher ist nur, dass es gar keinen Absprung noch während des Ladevorgangs geben sollte(darf). Dies ist besonders bei mobilen Geräten wichtig!

Im Fokus steht nun also das Nutzerverhalten positiv zu beeinflussen, um in Folge dessen die Absprungrate nicht nur, aber besonders noch während des Ladens einer Seite zu reduzieren. Bindet man externe Quellen (Scripte), wie z.B. den Adsense Code oder jede andere Art von externen Quellen ein, erhöht man die Absprungrate unweigerlich schon während des Ladevorgangs um ein Vielfaches. Die meisten Scripte für Affiliate oder Adsense werden zwar asyncron oder via defered loading (nach)geladen, aber diese Methode löst das Problem nicht und beeinflusst auch maßgeblich die Pagespeed Bewertung. Letzteres kann man mit dem Nachfolgenden HowTo vollständig vernachlässigen, sprich es fließt nicht in die Pagespeed Bewertung ein, bzw. bzw. verbessert die Bewertung ungemein. Garantiert!

Es geht nun aber nicht um Google oder irgendwelchen Bewertungen zur Ladegschwindigkeit, sondern um den Nutzer und dessen Verhalten und um dieses Verhalten zu beeinflussen, ist es unabdingbar so wenig wie möglich und wie nötig beim ersten Aufruf einer Seite laden zu lassen. ohne dass es dadurch zu Einschränkungen in der Funktionalität einer Seite kommt. Die einfache Lösung liegt also darin nicht alles gleichzeitig laden zu lassen, sondern "häppchenweise", ohne dass dies den Seitenaufbau oder Seitenfunktionalität negativ beeinflusst. Dieses häppchenweise Laden von Seitenelementen wie css, js, Bilder usw. wird zwar schon durch jeden Browser begünstigt, aber diese in jedem Browser schon vorhandene Reglementierung wirkt sich leider nicht auf das Rendering einer Seite aus. Zum Thema Rendering könnte man zwar ein eigenes Thema füllen, wichtig in diesem Zusammenhang ist aber nur, dass jede eingebundene css und js Datei das Rendern und somit den Seitenaufbau negativ beeinflusst.

Primäres Ziel dieses HowTo ist es nun, dass Ladeverhalten zu optimieren, um in Folge dessen das Nutzerverhalten im Sinne eines vorzeitigen Absprungs zu beeinflussen. Das nachfolgende HowTo habe ich zwar unter Google Adsense platziert, lässt sich aber unverändert auf jedes andere Script übertragen. Wer in der Lage ist den Adsense Code einzubauen, sollte eigentlich keine Schwierigkeit haben die nachfolgende Modifikation zu integrieren.

Wenn man in der Google Adsense Console eine neue Anzeige erstellt, dann gibt Adsense immer zu jeder Anzeige das Grundscript aus:

Code: Alles auswählen

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
98 von 100 Adsense Nutzer machen dabei den ersten grundlegenden Fehler dieses Basis Script wirklich zu jeder Anzeige einzubinden. Das ist grundlegend falsch und noch falscher geht schon mal gar nicht. Dieses Basis Script muss maximal nur 1x eingebunden werden und das am untersten Ende einer HTML Seite unmittelbar vor dem </body> Tag. Biitte nicht im Header platzieren. weil das die erste Bremse schlechthin ist! Wenn jemand die nachfolgende Optimierung nicht einbauen will oder kann, sollte zumindest das ändern!

Anstelle dessen, wie Google das Einbinden des Adsense Code vorgibt. bindet man das o.g. Basis Script nun wie folgt und natürlich am Ende vor dem </body> Tag ein.

Code: Alles auswählen

<script>
    function downloadJSAtOnload&#40;&#41; &#123;
        var b = document.createElement&#40;"script"&#41;;
        b.src = "//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js";
        document.body.appendChild&#40;b&#41;
    &#125;;
</script>
Im Anschluss den Parameter für die Client Identifikation und optional die jeweiligen Parameter für z.B. Auto-Ads usw.

Code: Alles auswählen

<script>
    &#40;adsbygoogle = window.adsbygoogle || &#91;&#93;&#41;.push&#40;&#123;
        google_ad_client&#58; "ca-pub-xxxxx"
    &#125;&#41;;
</script>
Das entscheidende kommt jetzt, weil dadurch maßgeblich das Lade- und Anzeigeverhalten verändert wird.

Code: Alles auswählen

<script>
    if &#40;window.addEventListener&#41; &#123;
        window.addEventListener&#40;"load", downloadJSAtOnload, false&#41;
    &#125; else &#123;
        if &#40;window.attachEvent&#41; &#123;
            window.attachEvent&#40;"onload", downloadJSAtOnload&#41;
        &#125; else &#123;
            window.onload = downloadJSAtOnload
        &#125;
    &#125;;
</script>
Diese Optimierung verändert nicht nur technisch etwas, sondern maßgeblich das Anzeigeverhalten der Adsense Anzeigen, die mit dieser Optimierung die Anzeigen leicht verzögert anzeigen lassen, eben weil die Anzeigen erst dann geladen werden, wenn wirklich alles andere der Seite schon geladen ist. In der Summe führt diese Optimierung dazu, dass beim ersten Aufruf einer Seite weit weniger (gleichzeitig) geladen werden muss und dadurch die Seite spürbar schneller wird, was sich dann auch bei der Pagesped Bewertung niederschlägt. Eure Nutzer werden es Euch danken, weil der Seitenaufbau dadurch spürbar schneller abläuft.

Wer darüber hinaus Support braucht, um den Seitenaufbau um den Faktor 10 zu erhöhen, bitte per PM melden.



Ungeachtet der nachfolgenden Kommentare die Anleitung ist aktuell und funktioniert sofern man sich an die Anleitung hält! Im Zweifelsfalle die Anleitung nochmal durchlesen.
Zuletzt geändert von supervisior am 11.02.2019, 11:39, insgesamt 4-mal geändert.

Hanzo2012
Community-Manager
Community-Manager
Beiträge: 1694
Registriert: 26.09.2011, 23:31

Beitrag von Hanzo2012 » 26.07.2018, 17:51

Das AdSense-Script dürfte allerdings beim Großteil der Besucher schon im Browser-Cache liegen und gar nicht vom Google-Server geladen werden, d. h. keinerlei Overhead verursachen ...

supervisior
PostRank 8
PostRank 8
Beiträge: 967
Registriert: 26.06.2006, 09:11

Beitrag von supervisior » 26.07.2018, 18:26

Ja und nein und wenn, dann bezieht sich das nur auf das Basis Script. Nein, weil jede Seite andere Anzeigen vom Google Server bezieht.

Hanzo2012
Community-Manager
Community-Manager
Beiträge: 1694
Registriert: 26.09.2011, 23:31

Beitrag von Hanzo2012 » 26.07.2018, 18:28

Ja, ich meinte natürlich das „Basis-Skript“. Darauf bezieht sich ja dein Tipp.

supervisior
PostRank 8
PostRank 8
Beiträge: 967
Registriert: 26.06.2006, 09:11

Beitrag von supervisior » 26.07.2018, 18:35

Wenn es um die Pagespeed Bewertung geht, spielt das, was im Cache ist, keine Rolle, bzw. diese Modifikation bekommt dann eine besondere Bedeutung.

ghazii
PostRank 1
PostRank 1
Beiträge: 6
Registriert: 28.03.2018, 10:15

Beitrag von ghazii » 04.08.2018, 15:11

Wow !
Tausend Dank Supervisior !
Die UserExpirience steigt dadurch enorm. Ich plage mich schon lange damit herum, das das Adsensescript die Darstellung bzw. das Laden meiner Navigation hinausgezögert hat. Somit hat man einen subjektiv langsamen Eindruck der Webseite, obwohl alles andere sichtbar und als erstes gelasden wurde.

Nun geht es Rambazamba und ist vom subjektiven Feeling einfach sauschnell. Auch die Werte bei Pingdom haben sich um 2/3 reduziert. Ich bin wirklich begeistert ;)

Eine Frage bleibt jedoch:

Wenn ich diesen BEreich auch einmalig nach unten vor den schliessenden Body-Tag platziere:

<script>
(adsbygoogle = window.adsbygoogle || []).push({
google_ad_client: "ca-pub-xxxxx"
});
</script>

Wird lediglich die erste Anzeige ausgespielt. Alle folgenden leider nicht.

Ich habe jetzt mal diesen Bereich unten weggelassen und wie gehabt unter jeder Anzeige stehengelasssen. Funktioniert soweit sehr gut. Wundert mich aber.

Mach ich da was falsch ?

Und wenn es darum geht den Seitenaufbau um den Faktor 10 zu verbessern, schicke ich dir noc h eine PN.
Zuletzt geändert von ghazii am 04.08.2018, 15:17, insgesamt 1-mal geändert.

Hanzo2012
Community-Manager
Community-Manager
Beiträge: 1694
Registriert: 26.09.2011, 23:31

Beitrag von Hanzo2012 » 04.08.2018, 15:14

Den push-Aufruf musst du einmal pro Anzeige machen. Also bei 3 Anzeigen 3-mal.

ghazii
PostRank 1
PostRank 1
Beiträge: 6
Registriert: 28.03.2018, 10:15

Beitrag von ghazii » 04.08.2018, 15:16

Ok...das heisst das ich das o.g. Script vor dem schliessenden Body-Tag komplett weglassen kann....korrekt ?

supervisior
PostRank 8
PostRank 8
Beiträge: 967
Registriert: 26.06.2006, 09:11

Beitrag von supervisior » 04.08.2018, 16:01

Nein!

Dieses Script 1x vor dem </body> Tag.

Code: Alles auswählen

<script>
    if &#40;window.addEventListener&#41; &#123;
        window.addEventListener&#40;"load", downloadJSAtOnload, false&#41;
    &#125; else &#123;
        if &#40;window.attachEvent&#41; &#123;
            window.attachEvent&#40;"onload", downloadJSAtOnload&#41;
        &#125; else &#123;
            window.onload = downloadJSAtOnload
        &#125;
    &#125;;
</script>
Alles andere je 1x pro Anzeige bei jeder Anzeige

supervisior
PostRank 8
PostRank 8
Beiträge: 967
Registriert: 26.06.2006, 09:11

Beitrag von supervisior » 23.08.2018, 11:12

Hier noch eine nicht unwichtige Ergänzung.

@Hanzo2012 meinte zuletzt, dass der Adsense Code, bzw. die dazugehörige .js Datei bei vielen schon im Browser Cache wäre. Grundsätzlich ist das zwar richtig, hat aber einen nur unwesentlichen Belang, bzw. ist unerheblich, was das reine Laden dieser .js Datei anbetrifft. Auch wenn diese Datei bereits im Browser Cache ist, muss diese ja immer und auf jeder Seite andes gerendert werden und das schließt jede .js und .css Datei mit ein. Dieses Rendern verbraucht CPU Power. Je leistungsfähiger ein Rechner, umso schneller geht auch der Seitenaufbau. Beim Laden einer Seite hat jeder Browser aber noch mehr zu tun als nur .js und .css Dateien zu rendern. Ohne entspreche Beeinflussung/Änderung was wann und wie geladen/gerendert werden soll, versucht der Browser das nach Möglichkeit alles gleichzeitig zu tun und das bremst, bzw. moniert dann auch jedes Analysetool um den Pagespeed zu messen.

Das oben gezeigte Script beeinflusst das Timing Verhalten und stellt das Rendern gewissermaßen hinten an, was den Seitenaufbau aber beschleunigt, weil der Browser dann icht mehr alles gleichzeitig versucht abzuarbeiten. Das mit Cachen ist dabei vollkommen nebensächlich.

PostRank 4
PostRank 4
Beiträge: 115
Registriert: 09.10.2010, 09:55

Beitrag von » 23.08.2018, 15:28

Hallo, auch ich möchte mich für den Tipp bedanken!
Auf dem zweiten Code im ersten Beitrag ist am Ende ein " '; " zu viel hinter dem schließenden </script>. Oder gehört das da etwa hin?

supervisior
PostRank 8
PostRank 8
Beiträge: 967
Registriert: 26.06.2006, 09:11

Beitrag von supervisior » 23.08.2018, 15:45

Richtig! War Copy&Paste Fehler. Kommt also weg

Micha_Es
PostRank 4
PostRank 4
Beiträge: 197
Registriert: 23.03.2008, 20:29

Beitrag von Micha_Es » 16.10.2018, 15:57

Sorry, bitte nochmal für "Doofies"


Auf der Seite vor dem Body Tag:

Code: Alles auswählen

<script>
      function downloadJSAtOnload&#40;&#41; &#123;
          var b = document.createElement&#40;"script"&#41;;
          b.src = "//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js";
          document.body.appendChild&#40;b&#41;
      &#125;;
  </script>

Und das hier auch vor den Body Tag?

Code: Alles auswählen

<script>
    if &#40;window.addEventListener&#41; &#123;
        window.addEventListener&#40;"load", downloadJSAtOnload, false&#41;
    &#125; else &#123;
        if &#40;window.attachEvent&#41; &#123;
            window.attachEvent&#40;"onload", downloadJSAtOnload&#41;
        &#125; else &#123;
            window.onload = downloadJSAtOnload
        &#125;
    &#125;;
</script>

Und das hier dorthin, wo die Anzeige erscheinen soll?

Code: Alles auswählen

<script>
    &#40;adsbygoogle = window.adsbygoogle || &#91;&#93;&#41;.push&#40;&#123;
        google_ad_client&#58; "ca-pub-xxxxx"
    &#125;&#41;;
</script>

Micha_Es
PostRank 4
PostRank 4
Beiträge: 197
Registriert: 23.03.2008, 20:29

Beitrag von Micha_Es » 16.10.2018, 16:51

Noch eine Frage hinterher.

Verstößt das nicht auch gegen die AdSense Richtlinien, dass an den Code nicht verändern darf?!

supervisior
PostRank 8
PostRank 8
Beiträge: 967
Registriert: 26.06.2006, 09:11

Beitrag von supervisior » 16.10.2018, 16:58

Micha_Es hat geschrieben:Noch eine Frage hinterher.

Verstößt das nicht auch gegen die AdSense Richtlinien, dass an den Code nicht verändern darf?!
Der Code wird hier nicht verändert. Nur das wie er geladen wird. Der Code selbst bleibt unangetastet. ansonsten würde er gar nicht funktionieren.

Antworten
  • Vergleichbare Themen
    Antworten
    Zugriffe
    Letzter Beitrag