1. Herzlich willkommen bei WPDE.org, dem grössten und ältesten deutschsprachigen Community-Forum rund um das Thema WordPress. Du musst angemeldet oder registriert sein, um Beiträge verfassen zu können.
    Information ausblenden

2 blockierende Skript-Ressourcen und 12 blockierende CSS-Ressourcen

Dieses Thema im Forum "Allgemeines" wurde erstellt von Persephone, 25. März 2016.

Schlagworte:
  1. Persephone

    Persephone Well-Known Member

    Registriert seit:
    21. Februar 2016
    Beiträge:
    597
    Zustimmungen:
    48
    Hallo liebe WP Freunde und frohe Ostern,

    nach vielen Wochen der Fehlersuche, ist meine Website nun endlich "responsive" aber leider überaus lahm und ich bin, was das betrifft, echt am Ende meines Lateins. :???:
    Das Problem bei den Erklärungen im Internet ist, dass jeder von seinem Wissensstand aus erklärt und oft die wichtigsten und relevanten Information fehlen.
    Wenn ich nach einer Antwort suche, muss ich mich zuerst durch lange Einführungen und Wiederholungen lesen, um an Erklärungen wie: "den Schalter im Admin Panal einfach auf "responsive" stellen." zu erhalten.... :roll:
    Ich habe nun folgende Frage:
    Wie beseitige ich JavaScript- und CSS-Ressourcen, die das Rendering blockieren, in Inhalten "above the fold" (ohne Scrollen sichtbar) ?

    Java Script -

    CSS-Ressourcen -



    Freue mich über Tipps und Auskünfte, die mich der Lösung näher bringen, weil so geht es nicht weiter. Die Seite wird zu einer echten Belastung und macht keinen Spaß mehr. :( Dabei denke ich, es kann es so schwer nicht sein, es sollte eigentlich hinzukriegen sein. 8)

    DANKE!



    http://astronja.de/
     
    #1 Persephone, 25. März 2016
  2. Persephone

    Persephone Well-Known Member

    Registriert seit:
    21. Februar 2016
    Beiträge:
    597
    Zustimmungen:
    48
    Hm, keine einzige Reaktion auf meinen Beitrag, dabei wurde er schon von 64 Leuten aufgerufen. :roll:
     
    #2 Persephone, 27. März 2016
  3. Persephone

    Persephone Well-Known Member

    Registriert seit:
    21. Februar 2016
    Beiträge:
    597
    Zustimmungen:
    48
    Scheinbar hat hier niemand Ahnung von der Materie oder es will mir keiner von euch helfen.
    Letzteres kann verschiedene Gründe haben, nur dann sollte ich darüber informiert werden.
    Jedenfalls finde ich das Verhalten hier schon rechts sonderbar und wenig zielführend.
    Ich habe auf meinen anderen Beitrag einige Privatnachrichten mit Hilfsangeboten erhalten aber da ist bisher auch nichts bei raus gekommen.
    Darin erzählt mir jeder, was er ist und was er kann aber dann höre ich nichts mehr von ihnen. HALLO ???
     
    #3 Persephone, 28. März 2016
  4. maxe

    maxe Well-Known Member
    Ehrenmitglied

    Registriert seit:
    1. Mai 2008
    Beiträge:
    19.581
    Zustimmungen:
    277
    Hallo, alles klar bei dir? Vielleicht überlegst du mal, dass Ostern (Ferien) ist und die freiwilligen Helfer hier auch ein privates Leben haben. Manche Sachen lassen sich halt nicht in 1-2 Sätzen erklären. Wenn ich solch fordernde Worte lese, hab ich schon kein Bock mehr zu helfen.
    Wie oft hilfst du denn hier bei anderen Problemen??? Lass mich raten ... noch kein mal!
     
    #4 maxe, 28. März 2016
  5. Persephone

    Persephone Well-Known Member

    Registriert seit:
    21. Februar 2016
    Beiträge:
    597
    Zustimmungen:
    48
    Danke, was anderes habe ich nicht erwartet!
     
    #5 Persephone, 29. März 2016
  6. Persephone

    Persephone Well-Known Member

    Registriert seit:
    21. Februar 2016
    Beiträge:
    597
    Zustimmungen:
    48
    Herzlichen Dank für ihre Beschreibung, ich weiß schon was above-the-fold-heißt und auch was Google schreibt.
    Doch jetzt meine Fragen:
    Das ist in Ihrer Konfiguration aber ausgeschlossen, weil Sie die genannten CSS- und JS-Dateien brauchen, um einen Teil der Inhalte, die sich im oberen Seitenbereich befinden, überhaupt darstellen zu können. Warum habe ich die CSS- und JS Datein nicht, wenn sie doch notwendig sind?

    Die einzig mögliche Näherung an eine Lösung ist, genau die Elemente in den CSS-Dateien zu identifizieren, die benötigt werden, um den above-the-fold-Teil darzustellen,
    Sind das nicht die Dateien, die ich oben in meinem Beitrag angegeben habe?

    diese aus den Stylesheets zu entfernen und stattdessen inline in die Seite einzubauen. Das ist auch die von Google empfohlene Vorgehensweise.
    Richtig, aber was soll mir das sagen b. z .w. was entferne ich aus welchem Stylesheet von welcher Stelle? Was und wo ist Inline? Was ist mit "einbauen" gemeint? Mit Seite ist das Stylesheet gemeint, oder? Ich muss genau wissen, welche Daten ich von wo nach wo in welche Dateien - p.h.p- oder Stylsheets ex- und importieren soll. Ich weiß schon um was es geht aber für diese Aktion brauche ich eine genauere Ablaufbeschreibung. Mag sein,dass ich jetzt wieder gemeckert bekomme, ich wolle an die Hand genommen werden und all so ein Kram aber ich bin Leie und was ich auf meiner Seite habe, dass habe ich bisher alles alleine gemacht, mir jeden Schritt angelesen, das meiste in englisch.

    Sollten dies aber sehr viele Elemente sein (angesichts der langen Liste von CSS-Dateien ist das vermutlich so), bringt das auch nichts,
    Die genaue Anzahl ist doch oben angegeben oder nicht? Angesichts welcher langen Liste von CSS- Dateien ist was vermutlich so und wieso bringt das auch nichts?


    Einzig die Webfont-Dateien können Sie dynamisch nachladen, d.h. aus der statischen Liste entfernen und stattdessen mit einen "onload"-Ereignis der Seite verknüpfen. Dort führen Sie aus (Pfade und Namen müssen Sie natürlich noch anpassen):
    <script src="http://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js"></script>
    <script>
    WebFont.load({
    google: {
    families: ['Droid Sans', 'Droid Serif']
    }
    });
    </script>

    Danke aber letzteres hilft mir so nicht weiter, wegen oben angegebener Problemstellung.

    Jetzt haben wir meinen Beitrag ja noch einmal durchgesprochen und für alle verständlicher gemacht, meine Fragen auch.
    Hoffe es geht weiter und ich erhalte etwas Unterstützung von euch.     Danke!


     
    #6 Persephone, 29. März 2016
  7. Monika

    Monika Well-Known Member
    Ehrenmitglied

    Registriert seit:
    4. Juni 2005
    Beiträge:
    14.126
    Zustimmungen:
    2
    eventuell hilft dir das Plugin Autooptimize,

    musst dich mit den erweiterten Einstellungen spielen, und immer kontrollieren,ob dann noch alles funktioniert.

    teste aber vor der Nutzung mit http://tools.pingdom.com/fpt/ (unter Settings Amsterdam) anhaken

    und schau dir dort nur die Ladezeit an!

    ist diese nach der Nutzung von Autooptimize höher als vorher,befriedigst du Google Page Speed aber nicht deine Nutzer.

    Eine Website so schnell zu machen wie es Google Page Speed haben mag, grad die "Above the fold" Optimierung setzt einfach sehr hohes Können voraus,dass nicht in 2-4 Sätzen erklärt werden kann.

    Bei manchen Themes gehts gar nie. Daher lassen sich ja viele Menschen, die bei page speed sehr gute Ergebnisse haben wollen, das WP Theme individuell mit genau diesem Fokus coden.
    Fertig Themes, egal ob kostenfrei oder gekauft können das sehr oft nicht, weil sie 100dertausend Möglichkeiten bieten müssen, da sie sonst nicht genommen oder gekauft werden.


    Viele Slider funktionieren nicht, wenn sie ihre Scripte nicht in den html header laden können etc etc. Und um das alles zu wissen und dann damit umzugehen erfordert eben technisches Können.
    Angefangen wie schreibt man CSS mit dem Fokus auf Performance,
    wie reduziert man HTML sinnvoll
    wie lädt man Scripte asynchron => und dass sie dann noch funktionieren :)

    Es gibt ja wirklich Grund wieso Menschen für 100/100 bei google page speed ( ohne Google Analytics, weil das verhindert 100/100 sehr oft) verdammt viel Geld auf den Tisch legen.


    ############
    Wenn dir Angaben wie "baue das Script so und so ein", einfach fremd sind, dann kann ichs dir vielleicht so erklären:
    du hast noch nie ein Auto gebaut, magst aber sofort einen Formel 1 Wagen bauen => das kann nicht gut gehen.
     
    #7 Monika, 29. März 2016
    Zuletzt bearbeitet: 29. März 2016
  8. Monika

    Monika Well-Known Member
    Ehrenmitglied

    Registriert seit:
    4. Juni 2005
    Beiträge:
    14.126
    Zustimmungen:
    2
    :)

    naja ..sogar mit Slider, weil dieser es kann, weil ihn ein sehr guter Coder gemacht hat

    HTML:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    geht nicht, gibts nur dann, wenn es an nötiger Zeit fehlt, um diese umzusetzen, wobei man hier Zeit=Geld fast gleichsetzen kann...
     
    #8 Monika, 29. März 2016
  9. borusse

    borusse Gast

    Ok war einer von den 64 die deinen Beitrag aufgerufen haben, kann blos nichts dazu sagen. Hätte ich das schreiben sollen? Hätte dir das geholfen?
     
    #9 borusse, 29. März 2016
  10. AausB

    AausB Member

    Registriert seit:
    1. April 2016
    Beiträge:
    7
    Zustimmungen:
    0
    Ich kann nur sagen, setzt Autoptimize und bei gefallen auf das Cache-Enabler Plugin. Die Probleme mit den blockierenden Ressourcen werden verschwinden. Und es gibt noch weitere nette Vorteile die diese Plugins mit an Board haben.

    Die Einstellungen der Plugins sind recht einfach erklärt und man hat sie in null komma nix produktiv.
    Ich hätte grad fast vergessen das ich selbst vor kurzem einen Artikel zu diesem Thema auf meinem Blog veröffentlicht habe.
    Schau mal auf die Seite https://www.appentwicklerblog.de/wordpress-ladezeiten-optimieren-mit-pagespeed-insights/ wenn du an der Performance deiner Seite schrauben willst.

    Gruß
     
    #10 AausB, 1. April 2016
  11. Persephone

    Persephone Well-Known Member

    Registriert seit:
    21. Februar 2016
    Beiträge:
    597
    Zustimmungen:
    48
    Herzlichen Dank für den Hinweis, habe mir die Seite angeschaut und habe dazu einige Fragen:
    Google Fonts

    Standardmäßig lädt Wordpress die Schriftart in der Kopfzeile. Dies führt automatisch zu blockierenden Ressourcen. Um dies zu beheben installieren wir ein kostenloses Plugin namens „Disable Google Fonts“. Vereinzelt bieten Themes diese Funktion in ihren eigenen Einstellungen. Dort sollte man zuerst nachschauen.
    Wir laden unsere Google-Schrift mit dem folgenden Code in der Fußzeile, direkt vor dem </ body> -Tag.
    <link href='https://fonts.googleapis.com/css?family=Noto+Serif:300,500,700' rel='stylesheet' type='text/css'>
    Wo befindet sich die Fußzeile denn genau?
    Wo finde ich den Hinweis über Fonts Einstellungen im Theme, um da zuerst nachzuschauen?
    Danke für Ihre / Deine Bemühungen. Server.png
     
    #11 Persephone, 6. April 2016
    Zuletzt bearbeitet: 6. April 2016
  12. Monika

    Monika Well-Known Member
    Ehrenmitglied

    Registriert seit:
    4. Juni 2005
    Beiträge:
    14.126
    Zustimmungen:
    2
    nein
    nicht WP lädt die Schriften in den header, sondern das jeweilige Theme
    der Unterschied ist sehr verkürzt so: WP ist das Auto, das Theme der Lack :)

    wenn du die Schriftart deines Themes => Google Font deaktivierst, hast du ein sehr anders Layout=> keine Ahnung, ob es dir dann gefällt.

    wenn du die Schrift erst im html Footer lädst dann kommt es zum "Flackern", wenn jemand deine Site nicht in seinem Browsercache hat => deine Entscheidung, ob du das in Kauf nimmst

    und das Plugin autooptimize schlug ich auch vor, hast es vermutlich überlesen :)
     
    #12 Monika, 6. April 2016
  13. Persephone

    Persephone Well-Known Member

    Registriert seit:
    21. Februar 2016
    Beiträge:
    597
    Zustimmungen:
    48
    Hallo Monika, danke für deinen Hinweis, ich weiß im Moment nicht, ob ich Google Fonts, Krikelkrakel Fonts oder Blogoma`s Hieroglyphen Im Theme habe, weil ich nicht weiß, wo ich den Hinweis überhaupt finden soll.
    Ich habe vorhin noch ein Bild/Grafik mit der Bezeichnung "Server" hinzugefügt, darauf kannst du erkennen, dass ich das autoptimize Plugin am 14.02.2016 installiert habe. Vielleicht ist mir dabei ein Fehler unterlaufen oder ich muß noch weitere Einstellungen vornehmen, von denen ich bisher keine Ahnung habe. Ich erkenne nämlich noch nicht den Nutzen von diesem Plugin.
    Mühsam ernährt sich das Eichhörnchen ...
    Was ich verstehe, setzte ich um und mit dem Rest gehe ich euch auf den Geist, weil ich ´s nicht verstehe. Verstehste? ;)
     
    #13 Persephone, 6. April 2016
  14. Monika

    Monika Well-Known Member
    Ehrenmitglied

    Registriert seit:
    4. Juni 2005
    Beiträge:
    14.126
    Zustimmungen:
    2
    bemeckert Google Page Speed => Google Fonts?
    wenn nein, haste sie nicht,
    wenn ja, siehe oben :)

    Autooptimize ist kein Garant, dass alles OK wird,
    ich kann dir wirklich nur raten: klicke bei dem Plugin auf erweiterte Einstellungen und probier einfach aus,

    richtig testen kann mans bei dem Tool Page Speed Insights ca jede Minute neu, weil die das letzte Ergebnis ziemlich lange in deren Cache behalten.
     
    #14 Monika, 6. April 2016
  15. Persephone

    Persephone Well-Known Member

    Registriert seit:
    21. Februar 2016
    Beiträge:
    597
    Zustimmungen:
    48
    War lange nicht mehr hier, weil es nichts bringt.
     
    #15 Persephone, 15. Mai 2016
  16. maxe

    maxe Well-Known Member
    Ehrenmitglied

    Registriert seit:
    1. Mai 2008
    Beiträge:
    19.581
    Zustimmungen:
    277
    musst ja auch nicht wieder kommen, weil es nichts bringt.
     
    #16 maxe, 16. Mai 2016
  17. Woogie-Design

    Woogie-Design Well-Known Member

    Registriert seit:
    20. August 2014
    Beiträge:
    211
    Zustimmungen:
    0
    Vielleicht solltest Deine Planeten befragen woran es liegen könnte oder der Merkur steht einfach gerade nicht korrekt, deshalb kann ich Dir nicht antworten.
     
    #17 Woogie-Design, 17. Mai 2016
(Du musst angemeldet oder registriert sein, um Beiträge verfassen zu können. )
  1. Diese Seite verwendet Cookies, um Inhalte zu personalisieren, diese deiner Erfahrung anzupassen und dich nach der Registrierung angemeldet zu halten.
    Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies.
    Akzeptieren Weitere Informationen...
    Information ausblenden
  1. Diese Seite verwendet Cookies, um Inhalte zu personalisieren, diese deiner Erfahrung anzupassen und dich nach der Registrierung angemeldet zu halten.
    Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies.
    Akzeptieren Weitere Informationen...
    Information ausblenden