kann alles in beliebiger Reihenfolge verwenden? Ist das Platzieren von <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">wichtig, bevor<title>
Dies wird am häufigsten verwendet, ist es der beste Weg?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Title Goes Here</title>
<link rel="stylesheet" href="http://sstatic.net/so/all.css?v=5912">
<link rel="shortcut icon" href="http://sstatic.net/so/favicon.ico">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
$("#wmd-input").focus();
$("#title").focus();
$("#revisions-list").change(function() { window.location = '/posts/1987065/edit/' + $(this).val(); });
});
</script>
</head>
<body>
<p>This is my web page</p>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/mootools.js"></script>
</body>
</html>
Diese Seite http://stackoverflow.com hat keine Kodierung und<meta>
Ich benutze ein CMS mit einer SEO-Komponente, die <meta>nach js und css jede für SEO hinzufügt. Dateien. Kann die Platzierung von Elementen in einer beliebigen Reihenfolge, die zulässig sind, <head>die Dokumentenkompatibilität und -codierung beeinflussen?
<meta>Daher ist das Tag eine Problemumgehung für diese Fälle, jedoch nicht unbedingt erforderlich.Antworten:
In HTML
DOCTYPEmuss das zuerst kommen, gefolgt von einem einzelnen<html>Element, das ein<head>Element enthalten muss, das ein Element enthält<title>, gefolgt von einem<body>Element. Siehe die Beschreibung der globalen Struktur eines HTML-Dokuments in HTML 4.01 und im HTML5-Entwurf . Die tatsächlichen Anforderungen sind meistens die gleichenDOCTYPE, aber sie werden unterschiedlich beschrieben.Die tatsächlichen Tags (
<html>,</html>,<head>, usw.) sind optional; Die Elemente werden automatisch erstellt, wenn die Tags nicht vorhanden sind.<title>ist das einzige erforderliche Tag in HTML. Das kürzeste gültige HTML 4.01-Dokument (zumindest das ich generieren könnte) ist (benötigt ein,<p>weil es etwas in dem geben muss<body>, um gültig zu sein):Und das kürzeste gültige HTML5-Dokument:
Beachten Sie, dass in XHTML alle Tags explizit angegeben werden müssen. Es werden implizit keine Elemente eingefügt.
Browser führen unter bestimmten Umständen ein Sniffing des Inhaltstyps durch, um den Typ einer Ressource zu bestimmen, die nicht mithilfe eines
Content-TypeHTTP-Headers angegeben wurde, sowie das Sniffing der Zeichenkodierung, wenn derContent-TypeHeader nicht angegeben wurde oder kein enthältcharset(Sie sollten es im Allgemeinen versuchen um diese Header einzuschließen und sicherzustellen, dass sie korrekt sind, aber es gibt einige Umstände, unter denen Sie dies nicht können (z. B. lokale Dateien, die nicht über HTTP übertragen wurden). Zu diesen Zwecken schnüffeln sie jedoch nur eine begrenzte Anzahl von Bytes am Anfang des Dokuments. Daher sollte sich alles, was das Sniffing von Inhalten oder das Sniffing von Zeichencodierungen beeinflussen soll, am Anfang des Dokuments befinden.Aus diesem Grund gibt HTML5 an, dass jedes
metaTag, mit dem der Zeichensatz (entweder<meta http-equiv="Content-type" content="text/html; charset=...">oder einfach<meta charset=...>) angegeben wird, innerhalb der ersten 1024 Byte der Datei liegen muss, damit es wirksam wird. Wenn Sie also Informationen zur Zeichenkodierung in Ihr Dokument aufnehmen möchten, sollten Sie das Tag früh in die Datei einfügen, möglicherweise sogar vor dem<title>Element. Denken Sie jedoch daran, dass dieses Tag nicht erforderlich ist, wenn Sie einenContent-typeHeader ordnungsgemäß angeben .In CSS haben spätere Stildeklarationen Vorrang vor früheren , alle anderen sind gleich. Daher sollten Sie im Allgemeinen die allgemeinsten Stylesheets einfügen, die möglicherweise früher überschrieben werden, und die spezifischeren Stylesheets später.
Aus Leistungsgründen kann es eine gute Idee sein, Skripte am unteren Rand der Seite direkt vor dem zu platzieren
</body>, da das Laden von Skripten das Rendern der Seite blockiert.Natürlich sollten
<script>Tags so bestellt werden, dass bei Skripten, die von jeder Bestellung abhängen, zuerst die Abhängigkeiten geladen werden.Abgesehen von den Einschränkungen, die ich bereits angegeben habe, sollte die Reihenfolge der Tags im Großen und Ganzen
<head>keine große Rolle spielen, außer für die Lesbarkeit. Ich neige dazu, das<title>nach oben zu sehen und die anderen<meta>Tags in eine logische Reihenfolge zu bringen.In den meisten Fällen sollte die Reihenfolge, in der Sie Dinge in den Text eines HTML-Dokuments einfügen, die Reihenfolge sein, in der sie angezeigt werden sollen, oder die Reihenfolge, in der auf sie zugegriffen werden soll. Sie können CSS verwenden, um Dinge neu anzuordnen, aber Screenreader lesen Dinge im Allgemeinen in der Quellreihenfolge, Suchindizes extrahieren Dinge in der Quellreihenfolge und so weiter.
quelle
iframeund nie einen sichtbaren Titel haben , nicht wirklich notwendig ist ), aber diesmal haben sie beschlossen, das nicht zu ändern.<script>Tags mit einemasyncoderdefer-Attribut einzufügen<head>. Siehe stackoverflow.com/questions/436411/…Dies ist die Vorlage, die ich verwende. Löschen Sie einfach alles, was Sie für ein neues Projekt nicht benötigen.
quelle
<html class="default">gemein ist?Wenn Sie ein paar Leistungsvorschläge zu Brians Antwort hinzufügen, sollte die höchste Priorität logischerweise Dinge sein, die heruntergeladen werden müssen, damit der Browser sie so schnell wie möglich herunterladen kann, und Dinge, die sich auf die Darstellung der Seite auswirken. Also würde ich vorschlagen:
Sie können auch in Betracht ziehen, CSS und JS in den Kopf zu laden, insbesondere wenn es klein ist und das externe Skript / Blatt wahrscheinlich nicht gemäß dem typischen Besucherprofil zwischengespeichert wird. Und wenn Sie es inline machen, möchten Sie es idealerweise komprimieren.
Letzte Sache: Der Benutzer muss auf den Kopf warten - und auf alle blockierenden Ressourcen, die er lädt -, also ist es am besten, so viel wie möglich in den Körper oder die Fußzeile zu stecken.
quelle
Laut W3 sollte sein:
quelle
Die meisten Browser haben nichts dagegen, wie Sie Ihre Elemente bestellen, aber Sie sollten immer
charsetzuerst angeben .Best Practices für IE7 + erfordern , dass die
charset,X-UA-CompatibleundbaseErklärungen , bevor irgendetwas kommen sonst in derhead, sonst wird der Browser startet über und wieder Parsen alles, was vorher war.quelle
Sie möchten zuerst Ihren Inhaltstyp, da dies die Zeichenkodierung angibt. Andernfalls versuchen einige Browser, die Kodierung zu erraten, wenn dies später erfolgt. (Ich kann mich nicht an die Einzelheiten erinnern, aber ich denke, der IE wird raten, ob er in den ersten 75 Zeichen des Dokuments keine Codierung findet?)
Die meisten Webserver senden die Codierung in den HTTP-Headern. Wenn jedoch ein Benutzer Ihre Seite speichert, werden die Header nicht damit gespeichert.
Ich würde CSS-Referenzen an zweiter Stelle setzen, damit der Browser sie so schnell wie möglich herunterlädt.
JavaScript würde ich nicht in den Kopf setzen, es sollte am Ende Ihrer Seiten stehen, da das Herunterladen das Rendern von Seiten blockiert.
quelle
IIRC, einige Browser laden das Dokument erneut, wenn sie auf ein
content-typeElement stoßen . Daher sollte dieses Element wahrscheinlich an erster Stelle imheadElement des Dokuments stehen.quelle