Support » Allgemeine Fragen » Wie kann ich HTML- und CSS-Dateien in WP ändern, optimieren, zusammenfügen??

  • Gelöst Timo Niels

    (@ltimoniels)


    Hallo WP-Universe,

    für meinen Schwiegervater sitze ich an genannter HP.

    Diese scheint unter anderem aufgrund einer sehr verschachtelten HTML- und CSS-Struktur sehr langsam zu laden.

    Natürlich ist dies auch mit dadurch bedingt, dass 85% der Seite Bildmaterial ist, doch befinden sich tatsächlich 30 *.CSS-Dateien im Verzeichnis, was laut Analyse-Tools mit verantwortlich für das sehr verzögerte Laden (und Scores zwischen 65% & 71%) ist.

    Wenn ich das alles überhaupt richtig verstanden habe – ich bin nämlich ein absoluter Neueinsteiger.

    Ich suche nun nach dem Verzeichnis innerhalb WP’s, in dem ich die HTML- & CSS- (und vielleicht sogar JavaScript-) Dateien einsehen und ändern kann.

    Ich gedenke diese jeweils bestmöglich zu kombinieren, optimieren und so zu einem besseren Resultat zu kommen.

    Ich habe nirgends eine in meinem WP-System (LogIn über IONOS-Oberfläche auf %domain%/wp-admin) umsetzbare Lösung finden können, da beispielsweise /wp-content bei mir schlichtweg nichts anzeigt.

    Geht das, was ich im Kopf habe so überhaupt? Oder sind die CSS- & HTML-Dateien beim Hoster hinterlegt?

    Danke für Aufklärung.

    LG
    Timo

    Die Seite, für die ich Hilfe brauche: [Anmelden, um den Link zu sehen]

Ansicht von 5 Antworten - 1 bis 5 (von insgesamt 5)
  • Hallo,
    du kannst der Einfachheit halber auch ein entsprechendes Cache Plugin nutzen, wie z. B. WP Fastest Cache, WP Optimize (alles kostenfrei) oder WP Rocket (kostenpflichtig).
    Allerdings ist die Performance der Webseite in der Tat nicht berauschend. Möglicherweise kann das eine oder andere Plugin da aber etwas nachhelfen.
    Einen speziellen Ordner für CSS-Dateien gibt es bei WordPress nicht.
    Viele Grüße
    Hans-Gerd

    Für 115 Anfragen und über 13 Megabyte Datenvolumen ist die Startseite der Website eigentlich noch erstaunlich flott.

    Die Anzahl der JavaScript und CSS-Dateien spielt heute nicht mehr eine so große Rolle wie noch vor ein paar Jahren, da die Dateien mit HTTP/2 asynchron übertragen werden – es werden also mehrere Dateien parallel abgerufen und erzeugen nich wie früher beim seriellen Abruf einen Flaschenhalseffekt. Die Website enthält trotzdem viel optischen Schnickschnack, der nur mit JavaScript und CSS umgesetzt werden kann. Dazu kommt eine hohe Wartezeit, bis überhaupt etwas passiert – vermutlich, weil intern erst einmal die vielen Einstellungen des Themes gerendert werden müssen. (Modernere Multi-Purpose-Themes wie Astra oder GeneratePress bieten generell eine bessere Performance, aber ein Wechsel ist nicht mit wenigen Mausklicks erledigt.)
    Abhilfe schafft hier ein Cache-Plugin, dass die Seiten in einem vorgegebenen Zeitfenster einmal abruft und dann eine fertige Fassung mit aneinandergehängten und minimierten CSS- und JavaScript-Dateien in einem Zwischenspeicher vorhält, bis der nächste Webseitenbesucher kommt. Unter den bezahlten Plugins hat sich WP-Rocket einen sehr guten Namen gemacht, auch weil die vielen Einstellungen des Plugins sehr gut beschrieben werden und auch Laien nicht ratlos zurücklassen. Wenn der Firmenauftritt den Griff in die Portokasse nicht zulässt, empfehle ich gerne das Plugin Comet Cache, das ebenfalls gut beschriebene Einstellungsmöglichkeiten hat und ganz gute Performancewerte liefert. Wenn du noch mehr rausholen möchtest, kannst du das ebenfalls bewährte Plugin Autoptimize installieren, wobei allerdings besondere Sorgfalt bei Einrichtung und anschließenden Tests nötig ist. Fehlerhafte Einstellungen können zu unschönen Fehlern führen, die schwer zu debuggen sind. Deshalb testen, testen, testen …

    Cache- und Optimierungs-Plugins können nur Symptome lindern, aber nicht die Performance erzielen, die du mit einem einfachen Theme mit erheblich weniger Gestaltungsvarianten und ohne einen zusätzlichen Page Builder erzielen würdest. Dem Web-Entwickler sollte man allerdings zugute halten, dass Kunden Fernsehen und Web gerne verwechseln und entsprechen hohe Anforderungen an die Gestaltung haben (ich hatte das abfällig „optischen Schnickschnack“ genannt, Sorry). Die lässt sich manchmal nur mit viel Aufwand umsetzen, was wieder zu langsamen Webseiten führt. es ist ein Kampf … 😀

    Ich suche nun nach dem Verzeichnis innerhalb WP’s, in dem ich die HTML- & CSS- (und vielleicht sogar JavaScript-) Dateien einsehen und ändern kann.

    Können wir dir das irgendwie ausreden? Themes sind komplexe Gebilde.
    Der Theme-Entwickler möchten Anwender/-innen gerne ein Dutzend verschiedene Layout-Varianten zur Verfügung stellen und wenn du Pech hast, sind für ein Dutzend Varianten auch ein Dutzend CSS-Regeln in einer Datei zusammengefasst. Etwas besser wird es, wenn je nach Einstellung nur bestimmte CSS-Dateien geladen werden, nur hast du dann eben wieder viele kleine CSS-Dateien, die alle übertragen werden müssen. Das noch weiter zu reduzieren wird ein sehr mühsames Unterfangen – ein Theme nach eigenen Vorstellungen neu zu schreiben geht wahrscheinlich schneller. Was einen Versuch wert wäre, ist das Plugin Asset CleanUp: Page Speed Booster, dass versucht, nicht benötigte CSS-Regeln auszuschließen und die Webseite damit performanter zu machen. Dass das nicht so einfach ist, kannst du den Beiträgen How to safely remove unused CSS in WordPress und The Tale of Removing Unused CSS from WordPress entnehmen – sofern das nicht noch mehr zur Verwirrung beiträgt.

    Deshalb nochmal in der Zusammenfassung:

    • wenn du ein Multi-Purpose-Theme verwendest, müssen die viele Einstellungen bei jedem Webseitenaufruf aufbereitet werden. Das lässt sich durch ein Cache-Plugin etwas abfangen.
    • dass viele JavaScript- und CSS-Dateien übertragen werden, ist nicht optimal, sollte aber auch nicht überbewertet werden, weil die Dateien heute anders übertragen werden. Hier kann ebenfalls ein Cache-Plugin (WP-Rocket oder Autoptimize) weiterhelfen.
    • Themes sind komplexe Software und lassen sich nich mal eben anpassen.
    Thread-Starter Timo Niels

    (@ltimoniels)

    Vielen Dank euch beiden – ich werde es mal auf diesem Wege versuchen.

    Thread-Starter Timo Niels

    (@ltimoniels)

    Danke übrigens an @pixolin & @hage. Das hat mir seinerzeit sehr weitergeholfen. Verzeiht, dass ich bisher nicht reagiert habe, man kann sich echt extrem in den Tiefen des WordPress-Universums verlieren.

    Wesentlich schneller ist es jedoch inzwischen schon nicht mehr 😀

    … man kann sich echt extrem in den Tiefen des WordPress-Universums verlieren.

    Wem sagst du das … 😀

Ansicht von 5 Antworten - 1 bis 5 (von insgesamt 5)
  • Das Thema „Wie kann ich HTML- und CSS-Dateien in WP ändern, optimieren, zusammenfügen??“ ist für neue Antworten geschlossen.