如何在HTML标记中订购<script>标记与<style>标记以获得最佳结果

Question

如何在HTML标记中订购<script>标记与<style>标记以获得最佳结果

Kzq*_*qai 10 html scripting upload coding-style

我正在http://royronalds.com上建立我的网站,我正在试图找出<head>最合理的元素顺序.只是从我现在拥有的东西,我有:

<head>
<style> 外部样式表
<meta>
<title>
<link> 到favicon
<script> 对于jQuery
<script> 网站的主要JavaScript
<script> 谷歌分析,异步脚本.
</head>

是否有理由对这些进行不同的订购,以便加载时间和其他问题更顺利地发生,如果是这样,理想的订单会是什么？

Answer 1

zom*_*bat 6

<script>如果它们对内容不是必不可少的,那么可以产生重大影响的一件事就是将标签移动到页面底部.

例如,我会将google analytics <script>标记移动到</body>每个页面上标记之前的最后一个标记.脚本标记是"阻止内容",因此在脚本下载并执行之前,浏览器不会继续使用页面呈现.您的主要javascript和JQuery文件可能无法轻松移动,具体取决于您使用它们的方式,但分析肯定可以在底部.

查看YSlow最佳实践以获得更多优化技术.

Answer 2

mol*_*olf 6

现代浏览器等待任何类型的渲染,直到<head>检索整个部分(包括链接在其中的文件).因此,订单与性能无关.对于Javascript,文件的顺序是执行顺序.对于样式表,顺序确定优先级(如果所有其他事物相同,则最后定义的规则具有优先权).

如果你想优化客户端的性能,因此强烈建议将您的Javascript包括到了的尽头<body>元素,而不是把他们在<head>所有.有更多的考虑因素,雅虎的优化列表非常值得你花时间阅读.谷歌也有一些很好的建议.

归档时间：	15 年，10 月前
查看次数：	6103 次
最近记录：	15 年，5 月前