15 Best Practices für HTML-Anfänger

Im Folgenden sind dreißig Best Practices für HTML-Anfänger aufgeführt, die allen als Referenz zur Verfügung gestellt werden. Die spezifischen Inhalte lauten wie folgt:

1. Tags geschlossen halten

In der Vergangenheit habe ich es oft gesehen ähnlich Der folgende Code (Anmerkung: Wie lange ist das her...):

Some text here.     

Some new text here.     

You get the idea.

Beachten Sie, dass das UL/OL-Label auf der Außenverpackung fehlt (wer weiß, ob das beabsichtigt oder unbeabsichtigt ist), und es wird auch vergessen, das LI-Tag zu schließen. Nach heutigen Maßstäben ist dies eindeutig eine schlechte Praxis und sollte zu 100 % vermieden werden. Halten Sie das Etikett auf jeden Fall geschlossen. Andernfalls kann es bei der Validierung von HTML-Tags zu Problemen kommen.

Ein besserer Weg

        
• Some text here. 
        
• Some new text here. 
        
• You get the idea. 
     

2. Deklarieren Sie den richtigen Dokumenttyp

Wenn Benutzer auf Probleme stoßen, wird dies empfohlen dass er zuerst zwei Dinge tut:

1. Überprüfen Sie die CSS-Datei, um sicherzustellen, dass keine Fehler vorliegen.

2. Bestätigen Sie, dass der richtige Dokumenttyp hinzugefügt wurde.

DOCTYPE erscheint vor dem HTML-Tag. Es teilt dem Browser mit, ob die Seite HTML, XHTML oder eine Mischung aus beiden enthält Browser kann korrekt analysieren.

Normalerweise stehen vier Dokumenttypen zur Auswahl:

nbsp;HTML PUBLIC “-//W3C//DTD HTML 4.01//EN” “http://www.w3.org/TR/html4/strict.dtd”>  
  
  
nbsp;HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”>  
  
  
nbsp;html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>  
  
  
nbsp;html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>

Es gibt unterschiedliche Meinungen darüber, welche Dokumenttypdeklaration verwendet werden soll. Es wird allgemein davon ausgegangen, dass die Verwendung der strengsten Deklaration die beste Wahl ist. Untersuchungen zeigen jedoch, dass die meisten Browser die normale Methode zum Parsen dieser Deklaration verwenden. Daher entscheiden sich viele Menschen für die Verwendung des HTML4.01-Standards. Entscheidend bei der Auswahl einer Aussage ist, ob sie wirklich für Sie geeignet ist. Daher müssen Sie sie umfassend berücksichtigen, um eine Aussage auszuwählen, die für Ihr Projekt geeignet ist.

3. Verwenden Sie niemals Inline-Stile

Wenn Sie in das Schreiben von Code vertieft sind, fügen Sie oft beiläufig oder nachlässig ein wenig Inline-CSS-Code hinzu

<p>I'm going to make this text red so that it really stands out and makes people take notice! </p>

Das scheint praktisch und kein Problem zu sein. Dies ist jedoch ein Fehler in Ihrer Codierungspraxis.

Wenn Sie Code schreiben, fügen Sie am besten keinen Stilcode hinzu, bis die Inhaltsstruktur vollständig ist.

Diese Codierungsmethode ähnelt einem Guerillakrieg, ein sehr nachahmender Ansatz. ——Chris Coyier

Ein besserer Ansatz besteht darin, den P-Stil nach Abschluss des Tag-Teils in einer externen Stylesheet-Datei zu definieren.

Empfehlung

#someElement > p {     
  color: red;     
}

4. Platzieren Sie alle externen CSS-Dateien im Head-Tag

Theoretisch können Sie CSS-Stylesheets überall einführen, aber in der HTML-Spezifikation wird die Einführung empfohlen im Head-Tag der Webseite, was das Rendern der Seite beschleunigen kann.

Während des Entwicklungsprozesses von Yahoo haben wir festgestellt, dass die Einführung eines Stylesheets im Head-Tag das Laden von Webseiten beschleunigt, da die Seite dadurch schrittweise gerendert werden kann. —— ySlow Team

     
<title>My Favorites Kinds of Corn</title>     
<link>     
<link>     

5. Platzieren Sie die Javascript-Datei unten

Ein Grundsatz, den Sie beachten sollten, besteht darin, die Seite so schnell wie möglich vor dem Benutzer anzuzeigen. Wenn ein Skript geladen wird, wird der Ladevorgang der Seite angehalten, bis das Skript vollständig geladen und ausgeführt ist. Daher wird mehr Zeit des Benutzers verschwendet.

Wenn Ihre JS-Datei nur bestimmte Funktionen implementieren muss (z. B. Schaltflächenklickereignisse), können Sie diese gerne am Ende des Hauptteils einführen. Dies ist definitiv der beste Weg.

Empfehlung

<p>And now you know my favorite kinds of corn. </p>     
<script></script>     
<script></script>