18 Tipps zur Website-Optimierung

Schnelles Laden von Seiten ist sehr wichtig für die Verbesserung des Suchmaschinenrankings, der Website-Conversion-Raten und der allgemeinen Benutzererfahrung. Auch die Ladegeschwindigkeit von Website-Seiten ist ein wichtiger Faktor bei der Messung der Website-Performance.

Wenn Ihre Website nicht mit Höchstleistung läuft, kostet Sie ein langsames Laden mehr Geld in Form von niedrigen Rankings und Kosten für den Suchverkehr. Die Ladegeschwindigkeit einer Seite kann einen großen Einfluss auf das Nutzerverhalten und die Conversion-Raten haben.

Also? Welche einfachen Möglichkeiten gibt es, die Ladegeschwindigkeit zu optimieren?

1. Bildoptimierung

Zunächst müssen Sie die Bilder auf Ihrer Website optimieren, um die geringste Chance auf eine Beschleunigung der Website zu haben. Entfernen Sie zusätzliche Anmerkungen, unnötigen Platz und nutzlose Farben aus dem Originalbild und speichern Sie das Bild im JPEG-Format, da es eine hohe Qualität gewährleistet, obwohl es weniger Platz beansprucht.

Für WordPress-Websites wird empfohlen, das smush.it-Plug-in zu verwenden, um die Bilder der Website automatisch zu optimieren. Wenn das Bild im PNG-Format vorliegt, können Sie tinypng verwenden, um das Bild zu optimieren und die Bildqualität zu verbessern.

2. GZip-Komprimierung aktivieren

Die GZip-Komprimierung klingt kompliziert, ist aber eigentlich sehr einfach. Sie wird verwendet, um die Größe von HTTP-Anfragen zu reduzieren und Antwortzeiten zu verkürzen. Da Sie auf diese Weise GZip-komprimierte Dateien anstelle von HTML-Dateien an den Browser senden können, werden die Warte- und Ladezeiten der Seiten verkürzt. Für den Apache-Server können Sie der .htaccess-Datei den folgenden Code hinzufügen, um die GZip-Komprimierung zu aktivieren.

<ifModule mod_gzip.c>
mod_gzip_on Yes
mod_gzip_dechunk Yes
mod_gzip_item_include file .(html?|txt|css|js|php|pl)$
mod_gzip_item_include handler ^cgi-script$
mod_gzip_item_include mime ^text/.*
mod_gzip_item_include mime ^application/x-javascript.*
mod_gzip_item_exclude mime ^image/.*
mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*
</ifModule>

Wenn der obige Code die GZip-Komprimierung nicht aktiviert, löschen Sie ihn und verwenden Sie den folgenden Code:

# compress text, html, javascript, css, xml:
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
# Or, compress certain file types by extension:
<files *.html>
SetOutputFilter DEFLATE
</files>

Oder fügen Sie den folgenden PHP-Code oben im HTML/PHP hinzu Datei:

<?php if (substr_count($_SERVER[&#39;HTTP_ACCEPT_ENCODING&#39;], &#39;gzip&#39;)) ob_start("ob_gzhandler"); else ob_start(); ?>

3. Server-Reaktionszeit

Selbst wenn die Website optimiert wurde, wird es keinen großen Effekt geben, es sei denn, die Server-Reaktionszeit ist sehr schnell. Wenn es um die Verbesserung der Website-Geschwindigkeit geht, spielt die Server-Reaktionszeit eine wichtige Rolle. Hier sind einige Vorschläge zur Verbesserung der Serverantwortzeit.

Verwenden Sie dedizierte Server, anstatt sich für gemeinsam genutzte/gehostete Server zu entscheiden.

Verbessern Sie die Qualität Ihres Webservers.

Entfernen Sie nicht benötigte Plug-ins. Nur die erforderlichen Plug-ins müssen immer aktiviert bleiben.

4. Browser-Cache

Der Browser verfügt über eine Cache-Funktion, die bestimmte Dateien speichern, HTTP-Anfragen reduzieren und so die Ladegeschwindigkeit der Website verbessern kann. Sie können das Browser-Caching aktivieren, indem Sie den Expires-Header in der .htaccess-Datei festlegen. Dies kann mit dem folgenden Code erreicht werden:

## EXPIRES CACHING ##
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/jpg "access plus 1 year"
ExpiresByType image/jpeg "access plus 1 year"
ExpiresByType image/gif "access plus 1 year"
ExpiresByType image/png "access plus 1 year"
ExpiresByType text/css "access plus 1 month"
ExpiresByType application/pdf "access plus 1 month"
ExpiresByType text/x-javascript "access plus 1 month"
ExpiresByType application/x-shockwave-flash "access plus 1 month"
ExpiresByType image/x-icon "access plus 1 year"
ExpiresDefault "access plus 2 days"
</IfModule>
## EXPIRES CACHING ##

Hinweis: Wenn die Ablaufzeit mit der Datei verknüpft ist, wird der Inhalt in der.htaccess-Datei aktiviert Die Datei muss geändert werden. Sie müssen die Datei zunächst umbenennen, damit der Browser den neu hinzugefügten Code abrufen kann.

5. Aktivieren Sie lange Verbindungen (Keep-Alive)

Der Keep-Alive-Header ist sehr wichtig, um die Latenz verteilter Anfragen zwischen dem Browser und dem Server zu verkürzen. Wenn ein Benutzer eine Webseite über einen Browser anfordert, liest der Browser eine bestimmte vom Server gesendete HTML-Datei. Wenn die angeforderte Seite externe CSS- und JavaScript-Dateien enthält, sendet der Browser erneut eine separate Anfrage, um diese Dateien abzurufen. Wie Sie sich vorstellen können, verlängert sich dadurch die Ladezeit der Seite.

Verwenden Sie den Keep-Alive-Header, um die Verbindung aufrechtzuerhalten, bis der Browser alle mit dieser Seite verbundenen Ressourcen vom Server erhält. Fügen Sie der .htaccess-Datei den folgenden Code hinzu, um diese Funktion zu aktivieren:

<ifModule mod_headers.c> Header set Connection keep-alive </ifModule>

6. Verwenden Sie CDN

内容分发网络（CDN）是位于不同地理位置的服务器组成的网络。每个服务器都拥有所有网站的文件副本。当用户请求文件和网页时，就可以直接从就近的网站服务器获取相应资源（也可以是从负载最小的服务器）。你可以使用Amazon cloud front 或者MaxCDN为网站开启CDN加速。

　内容分发网络（CDN）是位于不同地理位置的服务器组成的网络。每个服务器都拥有所有网站的文件副本。当用户请求文件和网页时，就可以直接从就近的网站服务器获取相应资源（也可以是从负载最小的服务器）。你可以使用Amazon cloud front 或者MaxCDN为网站开启CDN加速。

　　7、压缩CSS、JavaScript和HTML文件

　　通过删除所有不必要的空格和注释，从而减小文件大小，提高页面的加载速度。下面是一些优化CSS、JavaScript和HTML文件的流行工具，非常有用。

CSS Minifier

Avivo

HTML Compressor

　　8、避免重定向

　　重定向是对网站访问者的一种极大的刺激。就类似你去一个朋友家，却发现你朋友早已经搬到三个街区远的地方了。重定向会消耗额外的时间，降低加载速度。

　　9、指定字符集

　　指定字符集是加速浏览器渲染页面的另一个有用的技巧。下面的代码就能轻松实现：

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

10、避免错误请求

　

　当用户在网站上搜索时，收到404或410错误是比较失望的。错误请求会对网站的页面加载速度产生不利影响。因此，建议你无论如何都要避免错误请求。Check My Link 能帮你找出404链接，清除它们，改善用户体验。

　　11、丢弃跟踪代码、嵌入视频的元素和分享按钮

　　很多网站管理员认为使用多个跟踪代码提供嵌入和分享按钮会带给用户更好的体验，实际上这只会给网站增加更多的服务请求。例如，一个iframe会请求一个新页面，这会自动降低网站的加载速度。所以，丢弃这些跟踪代码，可以提高网站加载速度，提升用户体验。

　　12、异步脚本

　　还有一个可以提高网站页面速度的超棒选择就是异步加载脚本。如此一来网页负载就并不必依赖于这些异步脚本。在异步模式中，脚本是在后台下载的，不会影响浏览器对页面的渲染和加载。

<script async src="http://www.yoursite.com/script.js"></script>

13、样式表置顶，脚本置底

　　将样式表放在顶部有利于页面迅速加载，因为这样可以使得页面慢慢呈现。一般来说，在同一时间，大部分浏览器支持并行下载两个组件（图像、样式和脚本）。但是通常而言，脚本会在并行下载时会阻止其他的下载，直到脚本下载完毕。

　　14、JavaScript的延迟解析

　　为了加载网页，浏览器必须解析所有的标记内容，从而增加了网站的加载时间。通过延迟解析脚本，那么就可以减少初始网站的加载时间了。

15. Vermeiden Sie das Blockieren von JavaScript und CSS

Bevor der Browser eine Webseite rendert, muss er zunächst einen DOM-Baum erstellen, indem er die HTML-Auszeichnungssprache analysiert. Wenn während dieses Prozesses ein Skript auftritt, wird der Prozess abgebrochen und das Skript ausgeführt, bevor mit der ursprünglichen Aktivität fortgefahren wird. Es wird daher empfohlen, das Blockieren von JavaScript, insbesondere externen Skripten, zu vermeiden.

Das Blockieren von JavaScript kann ebenfalls zu Verzögerungen auf der Website führen. Sie können das Laden von unwichtigem JavaScript also genauso gut verschieben oder es asynchron laden. Eine andere Möglichkeit besteht darin, diese HTML-Codes in die Website einzubetten und dabei sicherzustellen, dass das CSS optimiert ist.

16. Code optimieren: Kein Inline-CSS verwenden

Inline-Stile können den Inhalt nicht klar vom Design trennen. Gleichzeitig ist möglicherweise eine Menge Wartungsarbeit erforderlich, was dem Website-Administrator verschiedene Unannehmlichkeiten bereitet und die Größe der Webseite weiter erhöht.

17. Dateitrennung

Website-Dateien können in CSS, JavaScripts und Bilder unterteilt werden. Die Dateitrennung verbessert nicht direkt die Ladezeit der Website. Dies kann jedoch die Serverstabilität verbessern, insbesondere wenn es zu plötzlichen Spitzen im Website-Verkehr kommt. Subdomains können auch zum Hosten von Dateien verwendet werden, was die Anzahl paralleler Downloads erhöht.

18. Reduzieren Sie HTTP-Anfragen so weit wie möglich

Eine weitere einfache Möglichkeit, die Webseitengeschwindigkeit zu optimieren, besteht darin, HTTP-Anfragen zu reduzieren. Wenn eine Website zu viele HTTP-Anfragen auf einmal erhält, kommt es bei ihren Besuchern zu verzögerten Antwortzeiten, was nicht nur die CPU-Auslastung erhöht, sondern auch die Seitenladezeiten erhöht. Wie können also HTTP-Anfragen reduziert werden? Sehen Sie sich die folgenden Schritte an:

Reduzieren Sie die Anzahl der Objekte auf Ihrer Website.

Minimieren Sie die Anzahl der Weiterleitungen auf Ihrer Website.

Verwenden Sie die CSS-Sprites-Technologie (nur den Teil des Bildinhalts, den Sie benötigen).

JavaScripts und CSS-Dateien zusammenführen.

Referenzartikel

12 umsetzbare Möglichkeiten zur Verbesserung der Seitengeschwindigkeit

13+ Möglichkeiten zur Optimierung der Seitengeschwindigkeit Ihrer Website