Ich sollte aus meiner Manie etwas machen. Oder es zumindest versuchen. Ich spreche vom permanenten, manche werden stattdessen penetranten sagen, Herumbasteln an meinem WordPress-Theme von GeneratePress â ĂŒbrigens auch an der Performance.
Dieses WordPress-Theme ist immerhin seit Jahren das Gleiche. Trotzdem Ă€ndert sich stĂ€ndig was. Manchmal tĂ€glich. Ich sollte, wie Claudia es mir mal geraten hatte, Screenshots machen und diese an geeigneter Stelle zeigen. Schade, die habe ich nicht. Wie es sich gehört, versuche ich bei all den Umbauarbeiten, die ĂŒbrigens nicht mittels eines der vielen Maintenance â Plugins âverstecktâ werden, sondern live mit allen TĂŒcken begleitet werden können, die Tests nicht zu vernachlĂ€ssigen. Das kostet am Ende oft mehr Zeit und Nerven als das Herumfuhrwerken selbst.
An anderer Stelle teste ich zusĂ€tzlich und stelle â was sonst â dort die gleichen bzw. ĂŒblichen Probleme fest. Möchte man die Performance im âgrĂŒnen Bereichâ halten, so sind vor allem zwei Faktoren entscheidend.
1. Fotos
Die Auslieferung der Fotos findet hier im Blog i.d.R. im *webp â Format statt. Dazu nutze ich seit einigen Jahren das Plugin von Imagify.
2. Fonts
NatĂŒrlich will ich nicht den immer noch zahlreich vorhandenen AbmahnanwĂ€lten zum Opfer fallen. Daher sind auch hier lĂ€ngst alle Fonts lokal gehostet. Die entsprechenden Werkzeuge, um sich im Google Font â Angebot umzuschauen bzw. die Fonts einzubinden sind zahlreich. Ich nutze am liebsten den âGoogle Font Helperâ.
Bei der Ăbernahme der vom Font Helper ĂŒbernommenen EintrĂ€ge fĂŒr eure style.css ist erst kĂŒrzlich ein Eintrag hinzugekommen, der meiner Erfahrung nach Auswirkung auf die Performance des Blogs haben kann. Es handelt sich um font-display: swap; Diesen Eintrag hatte ich bis dahin grundsĂ€tzlich manuell hinzugefĂŒgt. Er verhindert, dass Googles Speed-Test meckert. Fehlt dieser Eintrag (auch bei selbstgehosteten Fonts), so werden die Schriftarten erst angezeigt, wenn die Seite komplett geladen ist. Dies wird als Flash of Invisible Text (FOIT) bezeichnet.
Achtet darauf, dass die URL-EintrĂ€ge im unteren Teil dieses Beispieles korrekt sind. In meinem Fall muss ich die beiden Punkte vor dem Pfad löschen, weil ich aus mir heute unerfindlichen GrĂŒnden die Fonts gleich auf der ersten Hierarchieebene unterbringen wollte. Ich meine, ich hĂ€tte gelesen, dass dieses Vorgehen performancetechnisch besser sei. Das Verzeichnis befindet sich bei mir also nicht im Ordner: wp-content oder unterhalb meines darin befindlichen Themeordners, sondern auf der gleichen Ebene wie z.B. der Ordner wp-content. Meine Vorgehensweise hat den Vorteil, dass ich mit den gleichen Pfaden ggf. auch aus anderen Themes auf mein Font-Verzeichnis zugreifen kann. Der Pfad bleibt gleich. WĂ€ren die Fonts im Theme-Verzeichnis, sĂ€he dies anders aus.
Font-Display: swap;
Sollten die Fonts allerdings mit entsprechenden Plugins (Perfmatters) vorgeladen werden, so erĂŒbrigt sich der Eintrag. Steht er allerdings einmal im Eintrag der style.css, denke ich, ist man auf der sicheren Seite.
Wenn Sie einen System-Font-Stack verwenden, mĂŒssen keine Schriften auf die Seite geladen werden! Das ist ziemlich groĂ! Es beseitigt auch jede FOUT (Flash of Unstyled Text) oder FOIT (Flash of Invisible Text) HĂ€sslichkeit. Unsere Website verwendet Systemschriftarten, und ich wette, Sie haben es nicht einmal bemerkt. Das stimmt; Diese Seite lĂ€dt keine einzige Schriftart. Link folgenWie man WordPress beschleunigt (Optimierungen fĂŒr Core Web Vitals im Jahr 2023)
Woorkup
So sehr ich schöne Schriftarten liebe, so sehr muss ich darauf hinweisen, dass mehrere verschiedene Fonts im Blog die Performance negativ beeinflussen. Hier habe ich zurzeit nur zwei verschiedene im Einsatz. Eine davon gehört zum Font-Stack meines Themes. Er sieht so aus:
-apple-system, system-ui, "system-ui", "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";Kostet gleich mehrere Prozente
Lediglich fĂŒr einige Ăberschriften nutze ich einen anderen Font (MuseoSans700 bzw. MuseoSans900). Ăndere ich den Verweis auf die Standard-Fonts (s.o.) fallen die Performancewerte von Pagespeed sofort um ein, zwei Punkte. Nimmt man weitere Fonts hinzu, verschlechtern sich die Werte zusehends.
Sieht man regelmĂ€Ăig auf die Werte, die z.B. die Google â Messungen ergeben, stellt sich schnell ein gewisser Frust ein. Ich bin jedenfalls kaum zufriedenzustellen mit dem, was Pagespeed mir verrĂ€t. Besser gesagt, ich verstehe einfach nicht, welche Stellschrauben zu drehen wĂ€ren, um die Seite noch besser zu machen. đ
Werte fĂŒr meine Startseite
Links: Computer, Rechts: Mobil
Warum ist der Wert fĂŒr die mobile Ausgabe immer schlechter als der fĂŒr den Desktop? Ehrlich? Ich habs bis jetzt nicht verstanden. ErklĂ€rende Texte gibt es schon genĂŒgend. Aber ich verstehe nicht, was die Autoren da schreiben. So halte ich mich fest an den Dingen, die ich nachvollziehen und vor allem selbst gestalten kann. Das sind nun einmal zum jetzigen Stand Fotos und Fonts.
Diese guten Werte beziehen sich auf die Startseite. Die Posts oder Pages sind noch einmal ein ganz anderes Thema. In meinem Fall fallen die Werte je nachdem deutlich ab. Es kommt darauf an, welche Elemente im Beitrag verwendet werden. Ich halte es nicht so, dass ich vor der Freigabe eines Artikels auch noch auf die Google Pagespeed â Werte sehe. Mir reicht es schon, wenn ich mich damit herumquĂ€le, einen einigermaĂen guten SEO-Wert zu erreichen.
BeweggrĂŒnde â alles nur SpaĂ
Bestimmt fragen sich einige Leserinnen und Leser, wieso ich in diese Dinge ĂŒberhaupt so viel Zeit bzw. Ehrgeiz stecke. Die Antwort ist einfach. Ich habe Freude an den Sachen und immerhin lerne ich â wenn auch langsam â immer etwas hinzu. Und auch das macht mir SpaĂ. Meinen Zugriffszahlen, kann ich mal ganz uneitel sagen, schaden meine vielen Versuche nicht. Sie stehen und fallen eher mit irgendwelchem Content, der mal gelungen und mal daneben ist. Jedenfalls schlieĂe ich das einmal aus den Zahlen. Das nĂ€chste Projekt wartet schon. Oder auch nicht.
Block Themen und die CSS-Eigenschaft font-display â Horst Scheuer
Das ist so mit Bastelsystemen, wo man viel auf Drittanbieter ausweichen muss. Es gab frĂŒher eine Alternative namens Ghost, wo da einiges besser lief. Beim Handy hĂ€ngt halt viel von den verbauten Komponenten ab.
Um die Darstellungsleistung zu verbessern gelten immer noch die alten Webregeln: So wenig Schnickschnack wie möglich, so wenig Inhalte von Drittanbietern, wie möglich und was man kleiner kriegen kann, sollte man auch entsprechend verkleinern. Die eigenen 8 K Aufnahmen sind halt nix fĂŒr die schnelle Darstellung.
Beim PC werden die Rahmenwerke zusĂ€tzlich von der Grafikkarte gestĂŒtzt, daher ist die Performanz da oftmals besser.
FĂŒr jemand, der nicht permanent mit unlimitiertem Datenvolumen online ist, ist WP gar nicht erst zu empfehlen. 2 Wochen ohne Updates aller Komponenten und die Seite ist eine einzige Scammerhölle (wenn man GlĂŒck hat).
FĂŒr die Darstellung von Bildern brĂ€uchte man eigentlich keine Plug-ins. Das bringen die Browser selbst mit.
Auch die Abwicklung von Audio- und Videodateien kann man in der Regel dem Browser ĂŒberlassen, nur sieht das dann halt nicht immer alles so toll aus.
Audio und Videodateien kann man fĂŒr das Web neu rendern lassen. Wenn es Interesse an hochauflösendem Material gibt, so lĂ€sst sich das immer noch per wetransfer.com (oder Ă€hnlichen) verschicken oder man nutzt halt entsprechende Mediaportale dafĂŒr und bettet nur den Verweis ein.
Hier auf meinem Billighandy fluscht Deine Seite im Moment ganz gut.
Da mag ich dir nicht zustimmen, Juri. Hier laufen an die 30 Plugins und mit etwas Einsatz habe ich es hinbekommen, dass sich das nicht signifikant auf die Performance niederschlĂ€gt. AuĂerdem – glaube ich – ist das Theme durchaus nutzerfreundlich. Die Leserinnen und Leser profitieren davon. Ehrlich, wo hat es so einen schönen Kommentarbereich? đ
Puritanisch(er) gehts auch und auch das hat seine Reize. Es gibt heute wie Anfang des Jahrtausends Anbieter, die dem User quasi alles aus der Hand nehmen. Auch das hat seine Daseinsberechtigung. Ich habe lieber alle Spielmöglichkeiten und möchte basteln können. Deshalb bin ich seit der ersten Stunde ein Fan von WordPress. Schau dich um: Die Leute setzen es immer noch ein, trotz aller Stinkstiefeleien, die man immer mal wieder dazu liest. Ich finde, das Team macht einen groĂartigen Job. Und es ist innovativ. Die Blocktechnik hat Wordpress stark verĂ€ndert und sich im Gegensatz zu den Behauptungen vieler so genannten Experten, durchgesetzt. Ich finde es immer wahnsinnig irrefĂŒhrend, wenn ich die Bewertungen des Gutenberg-Plugins sehe. Die kommen aufgrund der massiven Ablehnung wohl nie mehr in die Pötte. Total ungerecht und es entlarvt aber gleichzeitig einen groĂen Teil der Community.
Was tĂ€te ich ohne WordPress? Mir wĂ€re ganz schön langweilig und ich hĂ€tte weniger SpaĂ bei meiner Suche nach Weiterentwicklung und IndividualitĂ€t. Ich habe ĂŒbrigens einige Jahre Joomla genutzt. War schön, diese Zeit. Ich war Betreiber der Office-Seite Officetipps.net. Joomla ist ein klassisches CMS. Ich finde, WordPress kann selbst dort mithalten.
Freut mich zu hören, dass Wutzone auch auf einem Billighandy gut flutscht. Das ist fĂŒr mich Ansporn und BestĂ€tigung nicht mit dem Quatsch aufzuhören.đ
poestlich = Wabi!! Ja, Wabi ist schon ein klasse Theme. Ich nutze Wabi als Child-Theme. Ich habe alle Ănderungen per Gutenberg exportiert und in das Child-Theme gepackt.
Wabi finde ich auch schön. Danke fĂŒr den Tipp bezĂŒglich des Exports.
Habe mein Blog auch mal von Pagespeed untersuchen lassen. Ergebnis: Nichts, was mich jetzt irgendwie in Unruhe versetzen wĂŒrde, auĂer vielleicht die Anmerkung zu meiner robots.txt, wo angeblich drei EintrĂ€ge problematisch sind. Die schaue ich mir bei Gelegenheit mal an.
PerformancemĂ€Ăig kann ich nichts weiter „schrauben“, was am Ende als tatsĂ€chlich wahrnehmbarer Effekt beim Besucher ankĂ€me.
Sehr zufrieden bin ich damit, dass ich lediglich 10 Plugins einsetze, von denen genau 10 reine Backend-Plugins sind, die nichts mit der Gestaltung und der Performance des Blogs zu tun haben.
Mein Blog ist also im Grunde ein reines WP mit dem 20.20.3-Standardtheme. Ein paar wenige Fonts werden lokal geladen, das Stylesheet meines Child-Themes ist bis auf die notwendigen Initialangaben leer.
NatĂŒrlich habe ich in den mitgelieferten Styles des Themes, die ich bisher verwendet habe, einige Ănderungen nach meinem Geschmack vorgenommen. Das erledige ich aber im Rahmen des Full-Site-Editings mit dem Gutenberg.
Das ist ĂŒbrigens fĂŒr mich der interessanteste Lerneffekt, den ich mit WordPress in den letzten Jahren hatte.
Genau, das meine ich, Boris. Mit WordPress wird jeder Blogger nach seiner Facon glĂŒcklich. Es wird offenbar (Nutzer) buchstĂ€blich jedem gerecht. Ich fand die EinfĂŒhrung der Blocks sensationell, andere eben die Möglichkeit des Full-Site-Editings. Da bin ich trotz Widerwillens auch dabei: https://poestlich.de
Das ist die Variante mit erweiterter Metazeile und Kommentar-Bereich.
Da du nun deine neue Domain so oft erwĂ€hnt hast đ Du hattest schon weitaus schickere Namen!
Stimmt vermutlich. Die hier laufen immer noch auf mich:
2Bier.de
Bedburgisches.de
Blogkonzil.de
Blogmemo.de
erftnetz.de
nexil.de
horstschulte.com
netzexil.de
wortschwatz.de
đ
ÀÀÀh ja => O M G
Und welche gefÀllt dir davon am besten?
netzexil.de
wortschwatz.de
blogmemo.de
erftnetz.de
Nur wenn du die nicht alle nutzt, warum sammelst du die dann?
Danke, Su. Ich lass‘ es mir durch den Kopf gehen. đ
@Horst: Ich kann das nachvollziehen, ich bastle auch stĂ€ndig. FĂŒr meine Domain https://textrebell.de bin ich mal einen andern Weg gegangen. Keine Googlefonts, keine Plugins, Caching, Optimierung nur ĂŒber .htacess.
NatĂŒrlich auch mit dem Theme von GeneratePress; das Theme bringt die Grundvoraussetzung fĂŒr eine schnelle Seite bereits mit. Das Ergebnis kann sich sehen lassen. Mit den richtig grottenlangsamen Websites ist es aber dank http/2 sowieso vorbei. Das „Auskitzeln“ der letzten Hundertstelsekunde macht einfach SpaĂ.
Vielleicht erinnert sich noch jemand an den Suchmaschinenoptimierungs-Wettbewerb mit der berĂŒhmten Hommingberger Gepardenforelle? War auch Quatsch, machte aber einen HeidenspaĂ đ
https://de.wikipedia.org/wiki/Hommingberger_Gepardenforelle
Hallo Peter, das ist ja interessant. Ich bin also nicht alleine mit meinen Neigungen đ
Hier im Blog nutze ich die .htaccess ĂŒbrigens auch intensiv. Ich habe diesen Inhalt komplett ĂŒbernommen. Es lĂ€uft…
Hier wechsle ich die externen Fonts – auch die von Google – hin und wieder gegen den Standard Font Stack aus. Das macht sich immer wieder gut. BloĂ… lange bleibt es nicht so. Dann habe ich wieder etwas anderes.
GeneratePress ist ein tolles Theme. Der Code ist, wie du sagst, auf Geschwindigkeit getrimmt. Der Code ist phĂ€nomenal optimiert. Trotzdem setze ich seit Jahren schon wp-rocket und – weniger lang – das Optimierungstool „Perfmatters“ ein. Die vertragen sich gut, wenn man es nicht ĂŒbertreibt. Meinst du der Performanceschub wĂ€re hauptsĂ€chlich auf http2 zurĂŒckzufĂŒhren? Ich fand den vor ein paar Jahren gemachten Versionssprung bei PHP. Da nahm WordPress echt Fahrt auf. Mittlerweile lĂ€uft hier die Version 8.1.
wutzone ist aber sehr gut đ
Hilft mir sehr die Regeln;)
Martin