Heim  >  Artikel  >  Web-Frontend  >  Implementierungsschritte der Optimierung und Komprimierung von HTML-Webseiten

Implementierungsschritte der Optimierung und Komprimierung von HTML-Webseiten

php中世界最好的语言
php中世界最好的语言Original
2017-11-29 11:57:413166Durchsuche

想要对自己的HTML网页实现优化压缩的话需要检查5个方面,分别是,将table改为div布局,缩减精简div、span、ul li等系列标签,删除多余空格,表格类型布局时候适当使用table替代div布局,html网页GZIP压缩,将table改为div布局 。下面给大家详细的介绍一下

尽量将table标签布局html重构div布局,可以节约至少40%的代码量。由于div代码少于table布局的html网页,所以搜索引擎索引权重也优于table布局的html网页。

缩减精简div、span、ul li等系列标签  

布局DIV+CSS网页时候,我们有时候可以节约一些DIV布局代码,减少代码量。

如下案例代码:

<div class="div"> 
  <ul> 
  <li>DIV</li> 
  <li>DIV</li> 
  <li>DIV</li> 
  </ul> 
</div> 
可以改为:
<ul class="div"> 
  <li>DIV</li> 
  <li>DIVC/li> 
  <li>DIV</li> 
</ul>

这样可以节约一对div标签,从而减少html代码量,起到压缩html作用。这样直接对ul命名css样式类,可以区别在一个页面不同地方使用ul li列表标签。

三、删除多余空格   -   TOP


删除多余空格换行,可以有效地压缩html代码占用字节,一般在开发完成后可以对html中代码进行删除换行和空格内容。

可以借助于DW软件进行批量删除html内标签之间空格

如:

2664b5c137162ed32cb2c4b60e3a831f 

  ca532c8fbc0323c93614f1e58a1d475316b28748ea4df4d9c2150843fecfba68 

16b28748ea4df4d9c2150843fecfba68 

可以删除空格与换行后:

2664b5c137162ed32cb2c4b60e3a831fca532c8fbc0323c93614f1e58a1d475316b28748ea4df4d9c2150843fecfba6816b28748ea4df4d9c2150843fecfba68

Dies kann durch Leerzeichen und Zeilenumbrüche belegte Bytes einsparen.

Beachten Sie, dass die Web-Publishing-Version DW verwenden kann, um überflüssige Leerzeichen und Leerzeilen zu löschen. Wenn Sie den Code erneut bearbeiten möchten, rufen Sie die DW-Software auf, um den Code zu formatieren.

4. Verwenden Sie bei der Gestaltung des Tabellentyps entsprechend das Tabellenlayout anstelle des Div-Layouts – TOP


Wenn es sich um ein Tabellendatenlistenlayout handelt, würden wir dies tun Wählen Sie besser eine Tabelle. Da die Verwendung einer Tabelle als Tabellenlayout besser ist als ein Div-Layout, spart die Verwendung eines Tabellenlayouts HTML-Tags-Code und CSS-Stile als ein Div-Layout.

Tabelle wie unten gezeigtDatentyp, es wird empfohlen, das TABLE-Tag + CSS-Layout zu verwenden

HTML-Webcode-Komprimierungstabelle, Tag-Layouttabelle

Ähnlich dieser Liste Für Tabellentabellen wird empfohlen, das Tabellen-Tag-Layout zu verwenden

5. Webseiten-GZIP-Komprimierung – TOP


Es wird empfohlen Stellen Sie die Gzip-Komprimierungsfunktion für Webseiten auf Ihrem eigenen Server ein.

1. Welche Vorteile bietet das Öffnen von GZIP?

Antwort: Nachdem Gzip aktiviert wurde, werden die an den Browser des Benutzers ausgegebenen Daten komprimiert, wodurch die über das Netzwerk übertragene Datenmenge reduziert und die Browsing-Geschwindigkeit erhöht wird.

2. So aktivieren Sie die Gzip-Komprimierungsfunktion von IIS:

Antwort: Wenn Sie statische Dateien (HTML) komprimieren müssen, müssen Sie zunächst ein Verzeichnis auf der Festplatte erstellen und Geben Sie ihm „IUSR_ Schreibberechtigungen für den Benutzer „Maschinenname“. Wenn Sie dynamische Dateien (PHP, ASP, ASPX) komprimieren, ist dies nicht erforderlich, da die Seiten jedes Mal dynamisch generiert und nach der Komprimierung aufgegeben werden. Klicken Sie dann im IIS-Manager mit der rechten Maustaste auf „Website“ – Eigenschaften, nicht auf eine bestimmte Website unten, sondern auf die gesamte Website. Rufen Sie die Registerkarte „Dienste“ auf und wählen Sie „Dynamische Inhaltskomprimierung und statische Inhaltskomprimierung aktivieren“. Wählen Sie dann die Servererweiterung unter der Website aus und erstellen Sie eine neue Servererweiterung. Der Name spielt keine Rolle, der Pfad zum Hinzufügen der Datei unten lautet: c:windowssystem32inetsrvgzip.dll, und aktivieren Sie dann diese Erweiterung. Derzeit können statische Inhalte komprimiert werden, bei dynamischen Inhalten liegen ASPX-Dateien jedoch nicht im Komprimierungsbereich. Weil die komprimierbare Standarddatei diese Erweiterung nicht hat. Und Sie können keinen Ort zum Hinzufügen von Erweiterungen in der Verwaltungsoberfläche finden. Derzeit können Sie nur die Konfigurationsdatei ändern. Es gibt eine MetaBase.xml-Datei unter c:windowssystem32inetsrv. Sie können sie mit Notepad öffnen. Es gibt drei Abschnitte mit demselben Namen, nämlich „deflate“, „gzip“ und „Parameters“. Die beiden Abschnitte sind grundsätzlich gleich. Fügen Sie in diesen beiden Absätzen eine ASPX-Zeile unter dem Parameter HcScriptFileExtensions hinzu. HcDynamicCompressionLevel wird auf 9 geändert (0-10, 9 ist die kostengünstigste Variante). Anschließend müssen Sie den IIS-Dienst neu starten, um die Geschwindigkeit nach der Komprimierung zu testen.

Ich glaube, dass Sie die Methoden beherrschen, nachdem Sie diese Fälle gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!


Verwandte Lektüre:

Detaillierte Erklärung des Unterschieds zwischen HTML und XHTML

So verwenden Sie den CSS-Bildrotationseffekt

So optimieren Sie HTML-Webseiten

Das obige ist der detaillierte Inhalt vonImplementierungsschritte der Optimierung und Komprimierung von HTML-Webseiten. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn