Zusammenfassung einiger Vorschläge zum HTML-Code-Schreibstil

Das Protokoll der Ressourcendatei weglassen

Es wird empfohlen, den Protokollteil (http:, https:) in der URL von Bildern, Mediendateien, Stilen und Skripten wegzulassen. Nach dem Weglassen des Protokollteils erbt die Ressourcendatei das Protokoll der Seiten-URL. Dies kann nicht nur das Problem gemischter Inhalte verhindern, sondern auch die Größe der Seite reduzieren. Beispiel: Um auf eine JavaScript-Datei zu verweisen, können Sie sie folgendermaßen schreiben.

Warum werden h4-, h5- und h6-Tags selten verwendet?

Titel-Tags umfassen h1 bis h6. Wir verwenden häufig h1, h2, h3, aber selten h4, h5 und h6.

Auf einer Website, die semantisch einwandfrei ist und sich traut, nackt zu sein (ohne CSS für das Layout zu verwenden), hat das Titel-Tag nicht nur Semantik, sondern auch einige Stilfunktionen. Aber angesichts der heutigen Popularität von CSS gibt es eigentlich keinen großen Unterschied zwischen der Verwendung von h1 und h6, und das Erscheinungsbild kann trotzdem angepasst werden.

Als Titel-Tag hat es eine leistungsfähigere Funktion. Das Titelelement bedeutet ein Schlüsselwort mit hohem Wert auf der Seite, daher werden h1, h2 und h3 häufig verwendet, um Schlüsselwörter zu gewichten. Die Gewichte von h4, h5 und h6 sind jedoch nicht hoch, sogar niedriger als strong und em, daher werden sie selten verwendet. Es wird geschätzt, dass ihre Autoritätsstufen wie folgt sind:

h1 > h2 > h3 > stark > em > h4 > h5 > h6

Wann verwendet man thead, tbody oder tfoot?

Ursprünglich dachte ich, dass thead als Tabellenüberschrift verwendet wird, um Tabellentiteleinheiten wie th zu platzieren; tbody wird verwendet, um Tabelleninhalte zu platzieren, und tfoot wird für die Tabellenbeschreibung verwendet. Tatsächlich ist mein Verständnis nicht ganz richtig. Diese Tags sind eigentlich entbehrlich.

Denn der Browser muss im Allgemeinen die gesamte Tabelle herunterladen, bevor sie angezeigt werden kann, was sich im Zeitalter des Tabellenlayouts auf die Lesbarkeit des Benutzers auswirkt. Daher werden diese Tags verwendet, um die Tabelle in mehrere Teile zu unterteilen, und der heruntergeladene Teil kann angezeigt werden. Darüber hinaus werden beim Drucken langer Tabellen auch Kopf- und Fußzeilen auf jeder Seite angezeigt.

Optionale Tags weglassen

Wer Dreamwave verwendet hat, sollte sich merken, dass der Standardcode beim Erstellen einer HTML-Datei wie folgt aussieht.

Wir werden den Titel sowie externe CSS- und JavaScript-Referenzen in den Kopfbereich und den auf der Seite angezeigten Inhalt in den Textkörper einfügen. Tatsächlich sind HTML, Kopf und Textkörper jedoch alles optionale Tags.

Nach dem Entfernen dieser optionalen Tags sieht es zwar komisch aus, aber die Seite wird normal angezeigt und kann die W3C-Prüfung bestehen. Ich habe das bereits auf meinem Blog gemacht. Aber eine Sache ist zu beachten: Wenn Sie die Seite in XHTML schreiben möchten, behalten Sie bitte das HTML-Tag bei, da Sie den folgenden Code immer noch als Deklaration benötigen.

b-Label und i-Label

Viele Leute denken, dass das Schicksal des b-Tags und des i-Tags dasselbe ist wie das des u-Tags und dass sie vom W3C als „veraltete Tags“ eingestuft werden. In der HTML5-Spezifikation wird jedoch weiterhin die Verwendung dieser beiden Tags empfohlen. Ich habe das immer gewusst und mit meinen Freunden darüber gestritten. Aber ich habe nie verstanden, wie sie in HTML5 definiert sind.

hr-Tag

hr ist eine Linie, eine horizontale Linie, die den Inhalt teilt. Ich denke immer, dass hr eine lahme Sache ist, die gezeichnete Linie ist mit CSS nicht einfach zu handhaben und nutzlos. Tatsächlich ist hr die Trennlinie des Artikels in der Semantik, die den Kontext des Artikels vollständig teilt und sie unabhängig macht.

Seine Funktion ähnelt der Trennlinie in vielen Log-Blog-Posts, mit der Ausnahme, dass hr auch für Crawler semantisch verständlich ist.

Warum verwenden wir ein Tag normalerweise als Schaltfläche?

Es ist verständlich, dass es nicht input type="button" ist, da der Hover-Effekt bei niedrigeren IE-Versionen nicht sichtbar ist. Aber warum ist es ein a-Tag statt eines span? Ist es richtig, aus einem a-Tag einen Button ohne href zu machen? Darüber habe ich noch nicht nachgedacht. Früher habe ich es reflexartig gemacht.

Nachwort

Der HTML/CSS-Code-Styleguide von Google ist ein kurzes und prägnantes Handbuch zum Schreiben von Code mit Vorschlägen. Er ist sehr nützlich, aber seien Sie bitte nicht abergläubig. Es gibt darin beispielsweise einen Punkt, der empfiehlt, zwei Leerzeichen für die Einrückung zu verwenden, was in vielen Teams möglicherweise nicht machbar ist. Unser Team verwendet immer noch Tabulatoren.

Viele HTML-Vorschläge in diesem Handbuch beziehen sich auf HTML5, aber hier verwenden wir den HTML-Stil statt des XHTML-Stils. An vielen Stellen wird der Code weggelassen, um die Lesbarkeit des Codes zu beeinträchtigen. Sie sollten sich selbst ein Urteil über die Kompromisse bilden.