web开发中利用HTML优化网页的速度技巧

2017.05.05

　　web开发指的是网站的前端开发，是从网页制作演变而来的。想要成为专业的web开发人员，虽然需要掌握一些复杂的组件技术来加快html页面的访问速度，但是这并不是绝对的，在HTML与DHTML方面还是有很多少技巧可循的。

　　web开发中利用HTML优化网页的速度技巧

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

　　web开发中减少web页面下载时间的关键就在于设法减小文件大小。所以当遇到多个页面共用一些成分内容时，我们就可以考虑将这些公用部分单独分离出来，然后再在页面中按如下方式调用它们。这样公用文件只需要下载一次即可，等下次再次调用包含公用文件的html页面时，下载时间明显减少。

　　技巧二，让样式表内容进入地下工作

　　CSS是HTML装扮器，HTML页面中有多种引用CSS的方法，不同的方法导致的效率也不一样。一个漂亮的网站页面可以通过很好的使用CSS来实现。

　　操作案例：将定义于<style></style>间的样式控制代码提取出来，保存到单独的.css文件中，然后在HTML页面中以<LINK>标记或者@import标记的方式进行引用：

　　<style>

　　@import url("mysheet1.css");

　　</style>

　　注意：其中.css文件中无需包括<style>标记，@import和LINK标记要定义在HTML页面的HEAD部分。

　　技巧三，宝贵内存节省方法

　　网站的内存是非常宝贵且有限的，可以说是用一点少一点，所以我们在进行web开发时一定要尽量减少HTML页面占用的内存空间。

　　1、使用同一种脚本语言，提升网站的访问速度HTML页面离不开脚本程序的支持，在web开发中经常会在页面中嵌入多种脚本语言，如JavaScript、VBScript等。但是，这样的混合使用会降低网站了页面的访问速度。因为要解释并运行多种脚本代码，就必须在内存中装载多种脚本引擎。所以，我们一定要避免在页面中使用不同的脚本语言编写代码。

　　2、巧用<IFRAME>标记

　　<IFRAME>标记是一个非常美妙的功能，当我们需要在一个HTML文档中包含第2个页面的内容，最好的方法就是使用<FRAMESET>标记。这样做可以使代码的效率提高，但是却会导致繁重的处理过程使页面的访问速度变慢，此时我们就可以使用IFRAME。当鼠标指向一个新主题时，只需要修改IFRAME元素的SRC属性即可。这样任何时间内只会有一个预览文档保留在内存。

　　技巧四，择优选用动画定位属性

　　网站页面中的动画可以提升网站的设计效果，吸引更多的用户，但是动画却会影响网站的打开速度。此时我们可以使用element.style.left和element.style.top两个属性来达到图形定位的目的。但这样做会产生一些问题：left属性返回一个字符串，并且其中包含了度量单位（比如100px)。

　　所以要设定新的位置坐标，就必须首先对这个字符串返回值进行处理，然后才能赋值，操作方法如下：

　　dim stringLeft, intLeft

　　stringLeft = element.style.left

　　ntLeft = parseInt(stringLeft)

　　intLeft = intLeft + 10

　　element.style.left = intLeft;　

400-6446-365 / 010-64928252 我想要个更针对我需求的方案

上一篇文章：网页设计网页制作的简易流程下一篇文章：网页设计之CSS中常见的六大问题解析

看过此文章的人也看过