本文使用「署名 4.0 国际 (CC BY 4.0)」许可协议，欢迎转载、或重新修改使用，但需要注明来源。 [署名 4.0 国际 (CC BY 4.0)](https://creativecommons.org/licenses/by/4.0/deed.zh)

本文作者: 苏洋

创建时间: 2015年01月14日
统计字数: 1286字
阅读时间: 3分钟阅读
本文链接: https://soulteary.com/2015/01/14/how-to-write-the-document-head.html

-----


# 如何相对正确的书写页面 head

清理evernote，看到去年8月10日写的博客改版的计划。许多都已经做到了，许多细节处理或许之后有空的时候，可以写几篇长文出来分享。 经过细节调整，一般情况下，可以在1s之内完整“呈现”页面，这靠的不单单是“页面的输出HTML静态化”这么简单的事情来完成的。 此中大概，如果有兴趣，可以参考：[天下武功，唯快不破](http://www.soulteary.com/2015/01/10/give-me-better-feeling-when-i-visite-your-website.html) 本篇暂且记录一些未完成的东西，其中每一点差不多都能做成单独的服务或者在网上已经有了成型的产品。

### **尚未完全完成的功能**

*   对于不支持脚本的页面跳转至特殊页面或加额外参数。
*   根据浏览器动态选择最合适的图片内容。
*   支持在线地图、在线幻灯片、文档分类图、置顶公告、文章内相关内容推荐、三方评论不可用时，自带评论功能可用。
*   完成阅读列表、总结 && 作品收集。
*   页面性能收集 & 错误收集。

额外分享一些页面head相关的细节，似乎许多人都不会在意这些细节，殊不知，许多事情，细节见真章。

### **关于页面head**

*   首先要指定编码，当然服务端也要指定编码，保持一致。
*   然后是对于可以切换内核的浏览器提示优先切换内核，诸如国内占比比较大的360浏览器6.0版本之后。然后是IE相关的浏览器使用其支持的最高版本的文档模式。
*   接着考虑可以使用viewport来支持不同尺寸和分辨率的设备。
*   关于页面相关说明，诸如作者可以在适当位置添加。
*   蜘蛛是否抓取索引的标志可以考虑添加。
*   接着是dns-prefetch缓存assets相关的域名。
*   如果你确定页面多数内容是弹出新窗口，那么可以指定页面的链接打开模式。
*   对于不支持或者禁用脚本的网站，可以使用转向带参数，请求无脚本时候的网站内容。
*   页面标题是页面必不可少的，同时也是蜘蛛索引的重要指标，可以考虑程序动态输出。
*   引入主要的样式文件，同时根据设备类型来引入设备相关的样式文件，以支持平板以及打印机。
*   前端脚本通过后端变量设置版本，以利于文档和静态资源的更新。
*   关于前置全局脚本，需要做到：
    *   如果页面不作为iframe内容使用，要防止恶意被嵌套，发生误导或者钓鱼相关的事情。
        *   如果使用类名作为钩子来告知页面程序是否支持调用，可以在此进一步处理。
        *   对于旧版本的IE，这里特指版本小于等于IE8的老旧浏览器，如果要做优雅降级，那么需要再此做前置程序处理。
        *   如果页面程序存在依赖数据来渲染的情况，前置的数据也推荐放置于此。
        *   如果页面依赖脚本加载器，可以在此添加加载器脚本。
        *   对于旧版本的浏览器可以使用IE条件注释配合shim脚本，以及respond来提供一些额外的功能支持，以减少写代码时的额外处理，以及保持一致性访问。
        *   页面关键词和相关说明也是至关重要的，如果你做SEO的话。
        *   如果你还要提供RSS以及PING,请也在此一并提供。
        *   对于搜索引擎提供shortlink，以合并改版rewrite后的状况。

--EOF--