Mit einfachen Tricks deine Website zum rennen bringen
Beitrag vom
Mal abgesehen davon, dass der Inhalt eurer Seite gut sein muss, gilt es auch noch zu beachten, dass die Technik stimmt. Insbesondere die Ladezeit einer Website ist für ein gutes Besuchererlebnis ausschlaggebend. Wenn die Seite sehr langsam lädt und unnötig viel Traffic verursacht, verärgert das eure Besucher und die Suchmaschinen.
Ich habe mal in einem Video zusammengefasst, welche Punkte zu beachten sind, damit die Seite nicht unnötig langsam lädt und zeige einige Tricks, um die Ladezeit eurer Seite zu optimieren.
Hier findest du den Code aus dem Video. Kopiere ihn einfach und füge ihn in deine .htaccess Datei ein, um deinen Apache dazu zu bringen, Daten zu komprimieren und das Browsercaching zu aktivieren:
# Deflate Compression by MimeType
<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE text/javascript
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/atom_xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE application/x-shockwave-flash
</IfModule>
# Deflate Compression by FileType
<IfModule mod_deflate.c>
<FilesMatch "\.(js|jpg|jpeg|gif|png|css)$">
ExpiresActive on
ExpiresDefault "access plus 1 month"
SetOutputFilter DEFLATE
</FilesMatch>
</IfModule>
#Caching einschalten
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType text/css "access plus 1 month"
ExpiresByType text/javascript "access plus 1 month"
ExpiresByType text/html "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>
<ifmodule mod_headers.c>
<filesmatch "\\.(ico|jpe?g|png|gif|swf)$">
Header set Cache-Control "max-age=2592000, public"
</filesmatch>
<filesmatch "\\.(css)$">
Header set Cache-Control "max-age=604800, public"
</filesmatch>
<filesmatch "\\.(js)$">
Header set Cache-Control "max-age=216000, private"
</filesmatch>
</ifmodule>
Bildbearbeitung: Krita
JPEG Kompression: JPEGMini & ImageOptim, für Linux empfehle ich Trimage
PNG Kompression: TinyPNG
Editor: ATOM Text Editor
Icons: FontAwesome & Fontastic
Tags: CSS / JS, NERD-Cast, Optimierung, Performance, Video, Website