首先，网页代码繁杂，会涌现网站加载速率慢的直接后果。有鉴于海内网速慢的大环境，更是加剧了繁杂网页打开慢，加载慢的问题。
其次，移动端用户的崛起，造成了大量用户通过手机，平板等移动端访问网站的状况，网站打开速率慢的问题更加凸显。
再次，网站加载速率的快与慢直接影响到网站给予搜索引擎友好度的多与少。
末了，从网站管理者或者seo优化职员来讲，繁杂的网页会造成掩护困难的问题。
实际来看，优化网站页面(前端)不是技能难题，给页面减肥也是随意马虎操作的事情，小明seo教程的建议是：随意马虎的完成的事情需即可，立时完成。网站页面(前端)优化方法及建议如下：
1：启用GZIP压缩网页。
什么是GZIP压缩?GZIP最早由Jean-loup Gailly和Mark Adler创建，用于UNⅨ系统的文件压缩。我们在Linux中常常会用到后缀为.gz的文件，它们便是GZIP格式的。现今已经成为Internet 上利用非常普遍的一种数据压缩格式，或者说一种文件格式。
GZIP压缩网页与什么用?
HTTP协议上的GZIP编码是一种用来改进WEB运用程序性能的技能。
大流量的WEB站点常常利用GZIP压缩技能来让用户感想熏染更快的速率。
这一样平常是指WWW做事器中安装的一个功能，当有人来访问这个做事器中的网站时，做事器中的这个功能就将网页内容压缩后传输到来访的电脑浏览器中显示出来.一样平常对纯文本内容可压缩到原大小的40%.这样传输就快了，效果便是你点击网址后会很快的显示出来.当然这也会增加做事器的负载。
以小明seo教程为例，利用的是阿里云做事器，其默认就有GZIP压缩模块，网站原网页大小为78120，压缩后大小为10544，估计的压缩比达到了86.5% 。抛开硬件条件，网站代码越少，越精简，相对来讲其打开，加载的速率就会更快。
2：网页(前端)支持浏览器缓存以达到速率优化效果。
浏览器缓存有什么用?浏览器缓存(Browser Caching)是为了节约网络的资源加速浏览，浏览器在用户磁盘上对照来要求过的文档进行存储，当访问者再次要求这个页面时，浏览器就可以从本地磁盘显示文档，这样就可以加速页面的阅览。
浏览器缓存放在什么地方?
可放到文件，内存中(如session)，还有cache(高速缓存)，还有 cookie，session，viewstate，这些是我们常常用到的，但可以认为他们是缓存数据。实在cache跟session有相似功能，但 cache可在代码中设置过期韶光，依赖项。所谓依赖项(例如：微软的类cachedependcy sqlCacheDependency)当依赖项变动了，系统会关照cache过期，无效。缓存可是有做事器缓存，客户端缓存。
举例如何利用浏览器缓存以优化网页(前端)。
利用浏览器缓存以优化网页(前端)
对付seo优化职员来讲，不必节制如何利用浏览器缓存代码，但须要知晓干系事理。
3：利用内容分发网络(CDN)优化网站加载速率。
内容分发网络(CDN)观点：CDN是构建在网络之上的内容分发网络，依赖支配在各地的边缘做事器，通过中央平台的负载均衡、内容分发、调度等功能模块，利用户就近获取所需内容，降落网络拥塞，提高用户访问相应速率和命中率。CDN的关键技能紧张有内容存储和分发技能。
内容分发网络(CDN)事理：CDN的基本事理是广泛采取各种缓存做事器，将这些缓存做事器分布到用户访问相对集中的地区或网络中，在用户访问网站时，利用全局负载技能将用户的访问指向间隔最近的事情正常的缓存做事器上，由缓存做事器直接响运用户要求。
内容分发网络(CDN)目的：利用户可就近取得所需内容，办理 Internet网络拥挤的状况，提高用户访问网站的相应速率。
内容分发网络(CDN)的主体是空间商而非网站管理员本身。
4：删除多余代码。
很多时候，一个网站的网页中存在很多多余的代码。如首页用到的js，列表页就用不到，如果全站利用头部调用，就让某些本不须要干系代码的网页也无端添加了许多代码，这些代码的精简，是有利于前真个打开速率的。也便是说：网站中的每一个页面，都无需多余代码。
5：充分利用css掌握样式。
网站页面(前端)优化方法及建议-css样式
一个前端代码精简的网站，其css代码与div是分离的，无需在前端对某些代码利用style定义样式，统统以css掌握即可。如：某一个网页中即利用了style定义样式，又利用了css定义样式，这样就重复了代码，也会造成网站前端加载速率的慢化。
6：CSS代码的优化与掌握。
小明seo教程所供应的统统网站页面(前端)优化方法及建议，其终极目的都是加快网站打开速率，这些方法和建议的落地点在于精简代码，给网页前端进行减肥，css代码优化的点包括但不限于：缩写css代码;排列css代码;同属性提取共用css选择器;分离网页颜色和背景设置样式(较大站点须要把稳);条理化css代码等。
7：前端js代码优化.
与css代码类似，前端js代码优化方法包括但不限于：
避免全局查找：在一个函数中会用到全局工具存储为局部变量来减少全局查找，由于访问局部变量的速率要比访问全局变量的速率更快些;
定时器：如果针对的是不断运行的代码，不应该利用setTimeout，而该当是用setInterval，由于setTimeout每一次都会初始化一个定时器，而setInterval只会在开始的时候初始化一个定时器;
字符串连接：如果要连接多个字符串，该当少利用+=;如果是网络字符串，比如多次对同一个字符串进行+=操作的话，最好利用一个缓存，利用Java数组来网络，末了利用join方法连接起来;
避免with语句：和函数类似 ，with语句会创建自己的浸染域，因此会增加个中实行的代码的浸染域链的长度，由于额外的浸染域链的查找，在with语句中实行的代码肯定会比表面实行的代码要慢，在能不该用with语句的时候只管即便不要利用with语句;
数字转换成字符串：般最好用”” + 1来将数字转换成字符串，虽然看起来比较丑一点，但事实上这个效率是最高的;
浮点数转换成整型：很多人喜好利用parseInt()，实在parseInt()是用于将字符串转换成数字，而不是浮点数和整型之间的转换，我们该当利用Math.floor()或者Math.round();如果定义了toString()方法来进行类型转换的话，推举显式调用toString()，由于内部的操作在考试测验所有可能性之后，会考试测验工具的toString()方法考试测验能否转化为String，以是直接调用这个方法效率会更高;
多个类型声明：在Java中所有变量都可以利用单个var语句来声明，这样便是组合在一起的语句，以减少全体脚本的实行韶光，就如上面代码一样，上面代码格式也挺规范，让人一看就明了。
插入迭代器：如var name=values; i++;前面两条语句可以写成var name=values[i++];
利用DocumentFragment优化多次append;
利用一次innerHTML赋值代替构建dom元素;
通过模板元素clone，替代;
利用firstChild和nextSibling代替childNodes遍历dom元素;
删除DOM节点;
利用事宜代理;
重复利用的调用结果，事先保存到局部变量;
注：seo优化职员不必要求节制前端js代码优化的详细代码，这是前端职员的事情。
8：tab表格的利用建议。
tab表格布局网页是较过期的技能，现目前效果更好的是div。对付tab表格的利用建议如下：只管即便少利用tab表格，杜绝在嵌套条件下的表格利用。
9：网站图片seo优化。
网站图片优化是加快整站打开，加载速率的主要一环，对付网站来讲，我们须要利用精确的图片尺寸与格式，并在不危害图片质量的情形下压缩图片。
首先，利用精确的图片格式如jpg格式的图片。
其次，利用合理的图片尺寸。图片尺寸越大，对加载的速率影响越大。有干系统计，图片减少50%，其网站整体页面会减少75%。对付图片尺寸的处理，其基本哀求是在知足用户需求的根本上利用相应大小的图片。
再次，利用工具压缩图片。图片变小有利于网站打开速率的提升，利用压缩工具可以让图面所占的空间更小。
10：删除多余的字体和网页注释。
从字体方面剖析，如果利用字体过多，势必会造成网站加载速率变慢，从而不利于网站前真个打开速率的提升;
从网页注释剖析，网页注释有利于前端开拓职员对付网站的掩护，但其余一方面，这些注释对搜索引擎是无用的，是多余的“噪声”。
分享来源：http://www.habaijian.com/seofenxiang/197.html
