1. 爱易网页
  2. HTML教程
  3. HTML优化加快网页速度

HTML优化加快网页速度

日期：2014-02-25　 浏览次数：20657 次

网页制造aiyiweb文章简介：减少web页面下载时间的关键就是设法减小文件大小.

     明显HTML，暗渡“公用脚本” 

      减少web页面下载时间的关键就是设法减小文件大小。当多个页面共用一些成分内容时，就可以考虑将这些公用部分单独分离出来。比如：我们可以将多个HTML页面都用到的脚本程序编写成独立存在的.js文件，然后再在页面中按如下方式调用它： 

 <script src="myfile.js"></script> 

      这样，公用文件只需求下载一次，然后就进入缓冲区。等下次再次调用包含公用文件的html页面时，下载时间明显减少。 

      让款式表内容进入地下任务 

      CSS是HTML打扮器，一个漂亮的Web页面不可能没有它。HTML页面中有多种援用CSS的方法，不同的方法导致的效率也不一样。通常，我们可以将定义于<style></style>间的款式控制代码提取出来，保存到单独的.css文件中，然后在HTML页面中以<LINK>标记或者@import标记的方式进行援用： 

     <style> 
     @import url("mysheet1.css"); 
     </style> 

      请留意2点：1、.css文件中无需包括<style>标记；2、@import和LINK标记要定义在HTML页面的HEAD部分。 

      宝贵内存节省两法

      尽量减少HTML页面占用的内存空间是加快页面下载速度的一个无效方法。在这方面，有2个需求留意的问题： 

      1、使用同一种脚本言语 

      HTML页面离不开脚本程序的支持，我们经常会在页面中嵌入多种脚本言语，比如JavaScript与VBScript。但是，不知你发觉没有：这样的混合使用减慢了页面的访问速度。缘由在于：要解释并运转多种脚本代码，就必须在内存中装载多种脚本引擎。所以，请尽量在页面中使用同一种脚本言语编写代码。 

      2、巧用IFrame 

      你使用过<IFRAME>标记吗？它可是一个非常美好的功用。如果要在一个HTML文档中包含第2个页面的内容，通常的方法是使用<FRAMESET>标记。但是有了<IFRAME>，一切变得简单了。比如，开发一个文档预览页面，可以在左边放置一系列主题，在左边放置一个IFRAME，其中包含要预览的文档；当鼠标擦过左边的每一个主题链接时，就在左边建立一个新的IFRAME以预览文档。这样做，代码效率无疑是高效的，但同时导致了繁重的处理过程，最终是缓慢的速度。

      只使用单一的IFRAME。当鼠标指向一个新主题时，只需求修正IFRAME元素的SRC属性即可。这样，任何时间内只会有一个预览文档保留在内存。 

      择优选用动画定位属性 

      每天上网浏览页面，你一定会看到许多动画效果。比如，一个可爱的小兔子在页面上来回地走动 ... 实现这个效果的核心技术就是CCS定位。通常，我们是使用element.style.left和element.style.top2个属性来达到图形定位的目的。但是，这样做会产生一些问题：left属性前往一个字符串，并且其中包含了度量单位（比如100px)。因此，要设定新的位置坐标，就必须首先对这个字符串前往值进行处理，然后才能赋值，象下面一样： 

相关资料更多>

  1. 网页设计颜色之黄金分割法
  2. 小弟我们一起学：HTML5标签系列教程（一）-video标签
  3. 7.HTML语言剖解之表格标记
  4. 站在DIV+CSS的上端
  5. IE js方法触发有关问题
  6. 页面内容的位置变了解决办法
  7. 在浏览器预览中位置出现偏差！该怎么处理
  8. 哪里有切图教程？贵也买,该怎么处理
  9. HTML编码转义，可将HTML标签相互转义