Zur Navigation

Gzip-Compression nutzen für css und js [3]

21 Jörg Kruse

Ich habe mal die Originaldatei mit Firebug analysiert. Du hast da ein "verstecktes Zeichen" drin:

http://www.fahrrad-workshop-sprockhoevel.de/ebene-tipps2015.css

#haupt_kopf {
	position: absolute;
	width: 980px;
	height: 105px;
	z-index: 1;
	left: -1px;
	top: 0px;
}

Dieses "" kann man mit dem normalen Browser nicht sehen, es handelt sich um ein sogenanntes BOM, was z.B. Windows Notepad am Anfang einer Datei abspeichert, wenn die Datei in UTF-8 gespeichert wird. Dieses Zeichen erscheint vor dem "<?php", deswegen funktionieren die beiden PHP-Befehle bei dir nicht!

Speicher die CSS-Datei mal in einem anderen Zeichensatz - dann sollte das BOM weg sein. Und danach füge den PHP-Code am Anfang der Datei ein.

04.01.2015 22:53 | geändert: 04.01.2015 22:58

1 Forenmitglied fand diesen Beitrag gut

22 krieger98

Ich habe die CSS-Dateien nochmal mit "notepad" neu angelegt.
Die Seiten werden jetzt richtig dargestellt und die Kompremierung klappt auch.
http://s201291267.online.de/
Was PageSpeed noch bemängelt ist, dass das Browser Caching für die CSS-Dateien nicht genutzt wird und das das Ablaufdatum nicht festgelegt ist.
https://developers.google.com/speed/pagespeed/insights/?url=http%3A%2F%2Fs201291267.online.de%2F&tab=desktop
Auf meiner Hauptseite "www.fahrrad-workshop-sprockhoevel.de " verwende ich die gleichen Cache-Funktionen hier wird das nicht bemägelt. https://developers.google.com/speed/pagespeed/insights/?url=http%3A%2F%2Fwww.fahrrad-workshop-sprockhoevel.de%2F&tab=desktop
Wie kann ich das noch beheben und das Ablaufdatum der CSS festlegen?
So sieht das jetzt aus:
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType text/css "access plus 1 month"
ExpiresByType text/javascript "access plus 1 month"
ExpiresByType text/htm "access plus 1 month"
ExpiresByType application/javascript "access plus 1 month"
ExpiresByType image/gif "access plus 1 month"
ExpiresByType image/jpeg "access plus 1 month"
ExpiresByType image/png "access plus 1 month"
ExpiresByType image/x-icon "access plus 1 month"
</IfModule>

05.01.2015 16:48

23 Jörg Kruse

Diese Direktive bezieht sich nur auf statische CSS-Dateien:

ExpiresByType text/css "access plus 1 month"

Bei den CSS-Dateien auf s201291267.online.de handelt es sich aus Sicht des Webservers jetzt aber um PHP-Dateien.

Du kannst aber auch in PHP einen entsprechende HTTP-Header setzen:

<?php
ob_start("ob_gzhandler");
header("Content-type: text/css");
header('Expires: ' . gmdate('D, d M Y H:i:s \G\M\T', time() + (30 * 24 * 3600)));
?>

Zu dem aktuellen Timestamp time() werden hierbei die Sekunden addiert, 30 * 24 * 3600 entsprechen einem Monat

05.01.2015 17:31 | geändert: 05.01.2015 17:33

1 Forenmitglied fand diesen Beitrag gut

24 krieger98

Ich habe die Änderung durchgeführtes war war ein Erfolg.
Was PageSpeed nur noch bemängelt ist das Browser Caching für:
http://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js (60 Minuten)
http://pagead2.googlesyndication.com/pagead/js/lidar.js (60 Minuten)
http://pagead2.googlesyndication.com/pagead/osd.js (60 Minuten)
http://pagead2.googlesyndication.com/pagead/show_ads.js (60 Minuten)
http://www.google-analytics.com/analytics.js (2 Stunden)
Da habe ich aber keinen Einfluß darauf oder?

05.01.2015 18:18

25 Jörg Kruse

Nein, da kannst du nichts machen.

Das PageSpeed-Tool führt Dateien von externen Domains wohl mit auf, da es ja nicht völlig ausgeschlossen ist, dass man auf die ein oder andere davon Zugriff hat.

05.01.2015 19:39

1 Forenmitglied fand diesen Beitrag gut

26 krieger98

Nochmal Danke für Deine Hilfe.
Ich werde jetzt alles Umsetzen auf die Hauptseite vom Fahrrad-Worshop.

05.01.2015 20:13

27 Forum

Da der folgende Beitrag thematisch schon weit von der ursprünglichen Fragestellung abweicht, habe ich ihn in einen eigenen Thread verschoben:

Googel PageSpeed: blockierende Ressource

09.01.2015 11:20 | geändert von Jörg: 09.01.2015 11:23

28 krieger98

Ich bin dabei meine Seiten umzustellen auf HTML5 im Augenblick noch htm. Möchte auch hier das Browser Caching nutzen und habe in den CSS Dateien hier folgendes eingefügt:
<?php ob_start("ob_gzhandler");header("Content-type: text/css");
header('Expires: ' . gmdate('D, d M Y H:i:s \G\M\T', time() + (30 * 24 * 3600)));
?>
Wie man sieht wird der Inhalt total verschoben. Woran könnte das liegen?
http://s201291267.online.de/

Ohne diesen Eintrag in der CSS wird alles richtig dargestellt.
http://s201291267.online.de/muster-1.html

Auf der Musterseite ist aber auch "<?php ob_start("ob_gzhandler"); ?>"
eingefügt.

27.01.2015 20:39 | geändert: 27.01.2015 20:54

29 Jörg Kruse

Die Datei http://s201291267.online.de/css/style.css wird als "text/html" ausgeliefert, und deswegen vom Browser nicht als CSS-Datei verarbeitet

Zitat von krieger98
und habe in den CSS Dateien hier folgendes eingefügt:
<?php ob_start("ob_gzhandler");header("Content-type: text/css");
header('Expires: ' . gmdate('D, d M Y H:i:s \G\M\T', time() + (30 * 24 * 3600)));
?>

Der PHP-Code muss ganz am Anfang der Datei stehen. Das betrifft nicht nur sichtbare Zeichen:

1. es darf auch keine Leerzeile vor dem PHP-Code stehen
2. es darf kein Leerzeichen oder Tabulator-Zeichen davor stehen
3. es darf kein BOM enthalten sein, wie in diesem Fall

Andernfalls können die PHP-Befehle nicht ausgeführt werden.

Edit:

Ich vermute mal, dass 3. wieder die Ursache ist. Ein Einmaliges Abspeichern mit einem Windows-Editor wie Notepad im Zeichensatz UTF-8 reicht schon, um ein BOM hneinzumogeln.

27.01.2015 21:29 | geändert: 27.01.2015 21:35

1 Forenmitglied fand diesen Beitrag gut

30 krieger98

Zitat von Jörg
Die Datei http://s201291267.online.de/css/style.css wird als "text/html" ausgeliefert, und deswegen vom Browser nicht als CSS-Datei verarbeitet

Zitat von krieger98
und habe in den CSS Dateien hier folgendes eingefügt:
<?php ob_start("ob_gzhandler");header("Content-type: text/css");
header('Expires: ' . gmdate('D, d M Y H:i:s \G\M\T', time() + (30 * 24 * 3600)));
?>

Der PHP-Code muss ganz am Anfang der Datei stehen. Das betrifft nicht nur sichtbare Zeichen:

1. es darf auch keine Leerzeile vor dem PHP-Code stehen
2. es darf kein Leerzeichen oder Tabulator-Zeichen davor stehen
3. es darf kein BOM enthalten sein, wie in diesem Fall

Andernfalls können die PHP-Befehle nicht ausgeführt werden.

Edit:

Ich vermute mal, dass 3. wieder die Ursache ist. Ein Einmaliges Abspeichern mit einem Windows-Editor wie Notepad im Zeichensatz UTF-8 reicht schon, um ein BOM hneinzumogeln.
Ich habe nochmal alles geprüft ein BOM war nicht vorhanden da ich die Datei unter UTF-8 ohne BOM abgespeichert hatte. Eine Leerzeile war auch nicht vorhanden.Ich habe die von Ihnen erstellten CSS-Dateien genommen und den den Code eingefügt und unter einen anderen Namen zum Test abgespeichert. Jetzt ist alles OK.
http://s201291267.online.de/
Siehe auch die Bewertung von pagespeed:
https://developers.google.com/speed/pagespeed/insights/?url=http%3A%2F%2Fs201291267.online.de%2F&tab=desktop

27.01.2015 23:04

Beitrag schreiben (als Gast)

Die Antwort wird nach der Überprüfung durch einen Moderator freigeschaltet.





[BBCode-Hilfe]