HTML-Gewichtsverlust, optimierte HTML-Tags zur Erstellung von Webseiten_HTML/Xhtml

HTML-Gewichtsverlust, optimierte HTML-Tags zur Erstellung von Webseiten_HTML/Xhtml_Webseitenproduktion

WBOY

Freigeben： 2016-05-16 16:42:43

Original

1449 Leute haben es durchsucht

HTML 4

HTML (nicht XHTML), MIME-Typ ist text/html, sodass einige Tags weggelassen werden können. Mit HTML 4 DTD können Sie die folgenden Tags weglassen (diese sogenannten vermeidbaren Elemente sind hier durchgestrichen markiert)

<code><del><font face="Consolas" size="2"></area></font></del></code>

Nach dem Login kopieren

<code><del><font face="Consolas" size="2"></base></font></del></code>

Nach dem Login kopieren

<code><font face="Consolas" size="2"><body></font></code>

Nach dem Login kopieren

<code><font face="Consolas" size="2"></body></font></code>

Nach dem Login kopieren

<code><del><font face="Consolas" size="2"></br></font></del></code>

Nach dem Login kopieren

<code><del><font face="Consolas" size="2"></col></font></del></code>

Nach dem Login kopieren

<code><font face="Consolas" size="2"></colgroup></font></code>

Nach dem Login kopieren

<code><font face="Consolas" size="2"></dd></font></code>

Nach dem Login kopieren

<code><font face="Consolas" size="2"></dt></font></code>

Nach dem Login kopieren

<code><font face="Consolas" size="2"><head></font></code>

Nach dem Login kopieren

<code><font face="Consolas" size="2"></head></font></code>

Nach dem Login kopieren

<code><del><font face="Consolas" size="2"></hr></font></del></code>

Nach dem Login kopieren

<code><font face="Consolas" size="2"><html></font></code>

Nach dem Login kopieren

<code><font face="Consolas" size="2"></html></font></code>

Nach dem Login kopieren

<code><del><font face="Consolas" size="2"></img></font></del></code>

Nach dem Login kopieren

<code><del><font face="Consolas" size="2"></input></font></del></code>

Nach dem Login kopieren

<code><font face="Consolas" size="2"></li></font></code>

Nach dem Login kopieren

<code><del><font face="Consolas" size="2"></link></font></del></code>

Nach dem Login kopieren

<code><del><font face="Consolas" size="2"></meta></font></del></code>

Nach dem Login kopieren

<code><font face="Consolas" size="2"></option></font></code>

Nach dem Login kopieren

<code><font face="Consolas" size="2"></p></font></code>

Nach dem Login kopieren

<code><del><font face="Consolas" size="2"></param></font></del></code>

Nach dem Login kopieren

<code><font face="Consolas" size="2"><tbody></font></code>

Nach dem Login kopieren

<code><font face="Consolas" size="2"></tbody></font></code>

Nach dem Login kopieren

<code><font face="Consolas" size="2"></td></font></code>

Nach dem Login kopieren

<code><font face="Consolas" size="2"></tfoot></font></code>

Nach dem Login kopieren

<code><font face="Consolas" size="2"></th></font></code>

Nach dem Login kopieren

<code><font face="Consolas" size="2"></thead></font></code>

Nach dem Login kopieren

<code><font face="Consolas" size="2"></tr></font></code>

Nach dem Login kopieren

Ihr Code lautet beispielsweise

<code><font face="Consolas" size="2"><li>List item</li></font></code>

Nach dem Login kopieren

kann als

geschrieben werden

<code><font face="Consolas" size="2"><li>List item</font></code>

Nach dem Login kopieren

Ein weiteres Beispiel ist, dass ein Absatz mit

enden sollte

<code><font face="Consolas" size="2"></p></font></code>

Nach dem Login kopieren

Am Ende können Sie einfach

schreiben

<code><font face="Consolas" size="2"><p>My paragraph</font></code>

Nach dem Login kopieren

Sie können sogar HTML, Head und Body entfernen (stellen Sie sicher, dass dies für Sie angenehm ist, bevor Sie es als Ihren Codierungsstandard übernehmen).

Nach dem Weglassen des Tags ist der HTML-Code weiterhin gültig und die Dateigröße wird reduziert. Bei typischen Seiten können Sie 5–20 % sparen.

HTML 5

Die ständige Weiterentwicklung von HTML 5 bietet einige Möglichkeiten, die Dateigröße zu reduzieren.

Zum Beispiel Seitendokumenttypdeklaration

<code><font face="Consolas" size="2"><!DOCTYPE html></font></code>

Nach dem Login kopieren

Vergleich

<code><font face="Consolas" size="2"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"></font></code>

Nach dem Login kopieren

Anscheinend ist die DTD von HTML 5 kürzer.

HTML 5 ist einfacher zu verwenden und kürzer, wenn die Codierung für die Seite angegeben wird:

<code><font face="Consolas" size="2"><meta charset="utf-8"></font></code>

Nach dem Login kopieren

ersetzt

<code><font face="Consolas" size="2"><meta http-equiv="content-type" content="text/html; charset=utf-8"></font></code>

Nach dem Login kopieren

Normalerweise verarbeiten Browser HTML korrekt.

Außerdem können Sie im heutigen HTML 5 das Typattribut entfernen, das MIME-Typen deklariert, wie z. B.

<code><font face="Consolas" size="2">type="text/css"</font></code>

Nach dem Login kopieren

oder

<code><font face="Consolas" size="2">type="text/javascript"</font></code>

Nach dem Login kopieren

Sie können

verwenden

<code><font face="Consolas" size="2"><script></font></code>

Nach dem Login kopieren

Ersatz

<code><font face="Consolas" size="2"><script type="text/javascript"></font></code>

Nach dem Login kopieren

verwenden

<code><font face="Consolas" size="2"><style></font></code>

Nach dem Login kopieren

Ersatz

<code><font face="Consolas" size="2"><style type="text/css"></font></code>

Nach dem Login kopieren

In allen Seitentypen (auch XHTHML) können Sie

weglassen

<code><font face="Consolas" size="2">type="text/css"</font></code>

Nach dem Login kopieren

HTML 5 macht es einfacher.

Die gleichzeitige Verwendung aller oben genannten Methoden führt zu Dateieinsparungen von 10–20 % (oder sogar mehr), abhängig von Ihrem Codierungsstil und der Menge des Textinhalts auf der Seite. Der Code wird sauberer und Besucher gelangen schneller zum Inhalt der Website. Wir verwenden viele dieser Techniken im Privacy Center-Projekt und sparen so 20 % der ursprünglichen Dateigröße.