在< head&gt ;?中订购元素的最佳做法是什么? [英] What are best practices to order elements in <head>?

查看:167
本文介绍了在< head&gt ;?中订购元素的最佳做法是什么?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

可以使用任何顺序吗?在<$ c $之前放置< meta http-equiv =Content-Typecontent =text / html; charset = UTF-8> c>< title>



这是最常用的方法吗?

 <!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-typecontent =text / html; charset = utf-8>
< title>标题在这里< / title>
< link rel =stylesheethref =http://sstatic.net/so/all.css?v=5912>
< link rel =shortcut iconhref =http://sstatic.net/so/favicon.ico>
< script type =text / javascriptsrc =http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js>< / script>
< script type =text / javascript>
$(function(){

$(#wmd-input)。focus();
$(#title)。focus $ b $(#revisions-list)。change(function(){window.location ='/ posts / 1987065 / edit /'+ $(this).val();});

});
< / script>


< / head>

< body>
< p>这是我的网页< / p>

< script type =text / javascriptsrc =http://ajax.googleapis.com/ajax/libs/mootools.js>< / script>
< / body>

< / html>

此网站 http:// stackoverflow .com 没有任何编码,< meta>



具有在所有js和css之后为SEO添加每个< meta> 的SEO组件。文件。可以在< head> 中允许的任何顺序放置任何元素影响文档的兼容性和编码?

解决方案

在HTML中, DOCTYPE 必须先出现,然后是单个< html> 元素,其必须包含包含< title> 元素的< head> 元素, a < body> 元素。请参阅 HTML 4.01 HTML5草稿;除了 DOCTYPE ,实际需求大体相同,但它们的描述不同。



< html> < / html> < head> 等)是可选的;如果标签不存在,则会自动创建元素。 < title> 是HTML中唯一需要的标记。最短的有效HTML 4.01文档(至少,我可以生成)是(需要一个< p> ,因为需要在 < body> 有效):

 <!DOCTYPE HTML PUBLIC W3C // DTD HTML 4.01 Transitional // EN
http://www.w3.org/TR/html4/loose.dtd\"> ;<title> ;</title> ;<p>

最短的有效HTML5文档:

 <!DOCTYPE html>< title>< / title> 

请注意,在XHTML中,



浏览器在某些情况下执行内容类型嗅探,以确定未使用 Content-Type HTTP头,以及字符编码嗅探,如果 Content-Type 头未提供或不包括 charset (你通常应该尝试包括这些头,并确保它们是正确的,但在某些情况下,你不能,如本地文件不通过HTTP传输) 。为了这些目的,它们只在文档开始处嗅探有限数量的字节,因此任何旨在影响内容嗅探或字符编码嗅探的内容应该在文档的开头附近。



因此, HTML5指定用于指定字符集的任何 meta 标记(< meta http-equiv =Content-typecontent = / html; charset = ...> 或简单地< meta charset = ...> )必须在前1024字节的文件才能生效。因此,如果要在文档中包含字符编码信息,您应该尽早将该标记放在文件中,甚至可以在< title> 元素之前。但是请记住,如果您正确指定 Content-type 头,则不需要此标记。



href =http://www.w3.org/TR/CSS21/cascade.html#cascading-order>后来的样式声明优先于较早的样式,其他都相同。因此,您通常应该放置可能被覆盖的最通用的样式表,以及稍后更具体的样式表。



出于性能原因,这可能是一个好主意将脚本放在页面底部,就在< / body> 之前,因为加载脚本会阻止页面的呈现。



显然,< script> 标签应该排序,以便依赖于每个订单的脚本首先加载依赖关系。

$ b总的来说,除了我已经指定的约束以外,< head> 中的标签的顺序不应该太重要,除了可读性。我倾向于看到顶部的< title> ,并放置另一个< meta> 在某种逻辑顺序。



大多数情况下,你应该把东西放在HTML文档的正文的顺序应该是它们应该显示的顺序,或他们应该访问的顺序。您可以使用CSS重新排列事物,但屏幕阅读器通常会按照源顺序读取内容,搜索索引将按源顺序提取内容,等等。


can use anything in any order? does placing of <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> is important before <title>

this is most used, is it best way?

<!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>

this site http://stackoverflow.com doesn't have any encoding and <meta>

I use a CMS which has SEO component which adds every <meta> for SEO after all js and css. files. can placing of any elements in any order which are allowed in <head> affect document compatibility and encoding?

解决方案

In HTML, the DOCTYPE must come first, followed by a single <html> element, which must contain a <head> element containing a <title> element, followed by a <body> element. See the description of the global structure of an HTML document in HTML 4.01 and the HTML5 draft; the actual requirements are mostly the same other than the DOCTYPE, but they are described differently.

The actual tags (<html>, </html>, <head>, etc) are optional; the elements will be created automatically if the tags don't exist. <title> is the only required tag in HTML. The shortest valid HTML 4.01 document (at least, that I could generate) is (needs a <p> because there needs to be something in the <body> to be valid):

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd"><title></title><p>

And the shortest valid HTML5 document:

<!DOCTYPE html><title></title>

Note that in XHTML, all tags must be specified explicitly; no elements will be inserted implicitly.

Browsers perform content type sniffing in some circumstances to determine the type of a resource that hasn't been specified using a Content-Type HTTP header, and also character encoding sniffing if the Content-Type header hasn't been supplied or doesn't include a charset (you should generally try to include these headers, and make sure that they are correct, but there are some circumstances in which you cannot, such as local files not transferred over HTTP). They only sniff a limited number of bytes at the beginning of the document for these purposes, though, so anything that is intended to affect the content sniffing or character encoding sniffing should be near the beginning of the document.

For this reason, HTML5 specifies that any meta tag which is used to specify the character set (either <meta http-equiv="Content-type" content="text/html; charset=..."> or simply <meta charset=...>) must be within the first 1024 bytes of the file in order to take effect. So, if you are going to include character encoding information within your document, you should put the tag early in the file, possibly even before the <title> element. But recall that this tag is unnecessary if you properly specify a Content-type header.

In CSS, later style declarations take precedence over earlier ones, all else being equal. So, you should generally put the most generic style sheets that may be overridden earlier, and the more specific style sheets later.

For performance reasons, it can be a good idea to put scripts at the bottom of the page, right before the </body>, because loading scripts blocks the rendering of the page.

Obviously, <script> tags should be ordered so that scripts that depend on each order have the dependencies loaded first.

On the whole, other than the constraints I have already specified, the ordering of tags within <head> shouldn't matter too much, other than for readability. I tend to like to see the <title> towards the top, and put the other <meta> tags in some sort of logical order.

Most of the time, the order you should put things into the body of an HTML document should be the order they should be displayed in, or the order they should be accessed. You can use CSS to rearrange things, but screen readers will generally read things in source order, search indexes will extract things in source order, and so on.

这篇关于在&lt; head&gt ;?中订购元素的最佳做法是什么?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆