Tutorials / Webentwicklung / Webseiten-Optimierung / Ladezeit verbessern / HTML / HTML-Elemente entfernen

Mit HTML die übertragene Datenmenge reduzieren

Nicht notwendige HTML Elemente entfernen

Das HTML-Element für den Head-Bereich entfernen

Das <head>-HTML-Element im HTML-Quelltext ist nach W3C-Spezifikation ein optionales HTML-Element und kann weggelassen werden.

Das schließende </head>-HTML-Element kann auch alleine weggelassen werden, erst recht wenn ein öffnendes <body>-HTML-Element im Quelltext folgen sollte.

<!DOCTYPE html>
<html lang="de">
 <head>
  <meta charset="utf-8">
  <title>Seitentitel</title>
  <meta name="description" content="Seitenbeschreibung ...">
  <link type="text/css" href="style_a.css" rel="stylesheet">
  <link type="text/css" href="style_b.css" rel="stylesheet">
  <script type="text/javascript" src="script_1.js"></script>
  <script type="text/javascript" src="script_2.js"></script>
  <meta name="robots" content="index, follow">
  <style>
   .inline-css {
     margin: 0;
     padding: 0;
   }
  </style>
 </head>
 <body>
  <h1>Überschrift</h1>
  <p>Text im Absatz...</p>
  <ul>
   <li>Listen-Eintrag 1</li>
   <li>Listen-Eintrag 2</li>
  </ul>
  <script type="text/javascript" src="script_3.js"></script>
  <!-- ein Kommentar noch zum Schluß -->
 </body>
</html>

Die modernen Browser-Render-Engines verstehen anhand der Inhalte des HTML-Quelltextes welche Daten in den <head>-Bereich und welche Daten in den <body>-Bereich einer Webseite gehören und setzen automatisch die entsprechenden HTML-Tags in den HTML-Quelltext des DOM an den richtigen Stellen wieder ein.
Dies kann man mit einer entsprechenden Webmaster-Browser-Erweiterung überprüfen.

Selbst am Ende des HTML-Quelltextes absichtlich platziertes Javascript (um die Render-Zeit der Webseite zu beschleunigen) wird von den modernen Browser-Render-Engines dem <body>-Bereich zugeordnet.

<!DOCTYPE html>

<title>Seitentitel</title>
<meta name=description content='Seitenbeschreibung ...'>

 <link type=text/css href=style_a_b.css rel=stylesheet>
 <script type=text/javascript src=script_1_2.js></script>
 <style>.inline-css{margin:0;padding:0}</style>

<h1>Überschrift</h1>
<p>Text im Absatz...
 <ul>
  <li>Listen-Eintrag 1
  <li>Listen-Eintrag 2
 </ul>

 <script type=text/javascript src=script_3.js></script>

Entfernte HTML-Elemente, die nicht benötigt werden, reduzieren die zu übertragende Datenmenge und können somit das Laden von Webseiten verbessern.