标签：
优化网页图片文件
你的网页一定有图片，加载一个网页往往图片的总尺寸是最大的，特别是那些颜色丰富的背景图片和大副广告图片。所以一般要在同等图片质量的情况下要尽可能地 减小图片尺寸。在Photoshop中我们可以用保存为Web图片的选项试一下。图片也有几种常用的文件格式。如JPEG一般是用来存储照片或全彩色图片 的，比如照片、屏幕截图等。GIF图片格式的颜色要比JPEG少，适合做小图，如制作按钮、Logo等，另外GIF支持动态效果。PNG跟GIF比较相 似，但它的尺寸较大，支持的颜色也比GIF要多，并且PNG支持背景透明。我们可以试试使用一种不同的格式保存图片试下，如将PNG和JPEG换成GIF 试试。
图片使用height和width属性
你会给每个图片加上height和width属性吗？这两个属性可以让浏览器在加载图片之前就知道图片的长和宽，并预留出指定的长宽待图片加载后显示。如 果没有这两个属性，浏览器还需要在读取图片成功后再处理一次页面布局样式，这无疑减慢了网页加载速度。所以在固定图片大小的情况下最好都使用上长和宽属 性。
CSS文件压缩瘦身
DIV+CSS是现在流利的网页布局方式，DIV定义了元素，CSS控制显示效果。所以往往我们会把CSS写到另外一个或多个外部链接CSS文件中，并且 CSS文件代码也有很多行。我们可以使用一些CSS压缩工具来删除CSS文件中不必要的多余内容，如重复定义样式、空格等来瘦身。可以尝试使用一下 CleanCSS工具来压缩你的CSS文件。
目录地址后加上斜杠（/）
如访客点击访问这样一个目录地址：http://www.techolics.com/tools，去打开这个目录下的index.html文档。当服务 器收到请求后它需要消耗一些时间来分析这是一个文件还是一个目录。但是如果我们在最后加上一个斜杠（/），服务器就知道你是在访问一个目录地址，然后就直 接加载默认文档index.html或index.php就行了。这样服务器就不用花时间来分析这个地址，也起到了一定加速的作用。
整合CSS、JS文件减少HTTP请求次数
现在的网页都有多个图片、CSS外部文件链接、Javascript外部脚本链接。所以当访问一个网页时浏览器需要多次向服务器请求这些文件。在请求和加 载之间会产生不少的时间差。特别是一些网页上有多个小图片、图标按钮的网页，有多少图片，浏览器就需要请求多少将这些小文件，多将请求这些小图片文件将明 显影响网页的加载速度。所以我们应该尽可能将小图片拼合一个PNG大图片上，然后通过坐标来显示图标。一次请求一个大图片比多次请求小图片速度要快不少。 同样，最好将CSS和Javascript尽可能地整合到一个文件中都有助于加快网页载入速度。
写在最后，这里只提到了一些简单的初级皮毛，因为这些是最容易做的优化方式。下一步我们还需要考虑网页代码（php或aspx）是否优化高效、服务器的响 应速度、服务器带宽是否够用等等更深层的因素。但如果将上面几点做到位，相信网页加速速度会提高不少。所以如果你有更多经验请在讨论区留言分享给大家吧。
减少数据库调用：页面数据调用数据库查询）方面原因，程序尽量减少访问数据库次数，数据库使用连接池，最好能使用静态化的方式，或者用CDN，没有CDN的可以使用缓存的方式将动态数据缓存下来。
iframe不要用：<iframe>页面引用过多，会影响页面加载速度，同时搜索引擎不建议使用iframe，影响爬虫抓取。
JS文件放在HTML代码最后：过多Js调用，影响页面加载速度。只要不是页面加载的时候就必须执行的JS方法，就可以将JS的调用以及文件放置到页面的最底部，因为DOM的解析是从上至下，如果JS文件的包含放置在最上面，将会加载完JS再加载页面的DOM。
CSS或者JS代码要合并：多个CSS文件或者多个JS文件，最好能合并为一个文件，减少HTTP请求数量，节约加载速度。
采用CSS Sprite（CSS精灵）方式处理背景图片，所有的背景图片最好能够整合到一张图片中的，不要单独存放。（减少http请求数量）
标签：
原文地址：http://www.cnblogs.com/zyfdeboke/p/4908319.html
