一条关于“Web页面的性能优化 & SEO”的探索之路

1.对Web页面的性能优化理解：

☆ 首先，为了提高页面的加载速度，让用户有更好的体验，前端网站的性能优化是非常有必要的（优化页面，加快页面加载速度）。

优化方式如下：

☆ 对文件和资源进行优化：

1. 书写css和js的时候要注意代码优化，尽量重复利用;
2. 可以用一个大的css文件来合并多个小的css文件，浏览器在请求每一个css文件时都会发送一个http请求，在http请求带来的延迟没有结束的时候，用户都将在等待中度过;
3. 如果网页中使用了大量背景图片，那么这些图片每一张都会发送一个http请求，可以使用css sprite来合并网页中的需要频繁加载的多个图片。对于合并之后的图片，我们需要注意对它图片质量和大小的优化，图片越小加载速度越快;
4. css文件放置在head，js放置在文档尾部。

☆ 利用多个域名来存储网站资源：

1. 可以节约cookie带宽；
   2.减少cookie的传输；
2. 节约主域名的连接数，优化页面响应速度。

☆ 利用多个域名来存储网站资源：

Ajax调用都采用缓存调用方式，一般采用附加特征参数方式实现，注意其中的<script src=”xxx.js?{verhash}”，{verhash}就是特征参数，这个参数不变化就使用缓存文件，如果发生变化则重新下载新文件或更新信息。

☆ 注意语义结构化：

1. html语义化就是让页面的内容结构化，便于对浏览器、搜索引擎解析；
2. 在页面没有css或者css还未加载出来的时候，页面也能呈现出很好的结构。
3. 搜索引擎的爬虫依赖于标记来确定上下文和各个关键字的权重，利于 SEO。
4. 方便盲人阅读器、屏幕阅读器等等设备来解析。
5. 用户体验更好，例如图片的alt属性，在图片没有加载出来时给予合理的解释。
6. 便于团队开发和维护。
7. 遵循分离结构和表现原则。

☆ 减少HTTP请求：

研究表明：80%~90%时间花在了下载页面中的所有组件进行的HTTP请求上。因此，改善响应时间最简单的途径就是减少HTTP请求的数量。

☆ 总结如下：

① 优化图片资源的格式和大小；
② 开启网络压缩；
③ 使用浏览器缓存；
④ 减少重定向请求；
⑤ 使用CDN存储静态资源；
⑥ 减少DNS查询次数；
⑦ 压缩css和js内容；

2.对SEO理解：

☆ 到底什么是SEO呢？ 点击此处

（1）SEO（搜索引擎优化）主要是通过关键词的收录来提高你网站的排名，主要应用在社交媒体，电商，新媒体，微博和微信营销。

☆☆ 优化网站有三要素：①标题；②关键词；③描述。

（2）下面介绍提高权重的方法

☆☆ 提高权重的方法

1.外链（友情链接）：指网站与网站之间的链接向导，互联网是链接与链接实现的一条网络
交换的注意事项：和内容相近的网站交换
链接交换形式多式多样（单向链接）（单向直链，黑帽），灌水式外链。
内链（网站内部页面与页面之间的链接），提高搜索引擎的抓取率。

2.内容质量
（1）更新：不断去更新，不会在抓取你的网站
（2）质量：内容质量不能乱写
（3）原创：躲避搜索引擎的文章对比机制，
（4）关键词密度（2%-8%），关键词占整篇文章的比重。
介绍白帽和黑帽，沙盒的区别
白帽：以正常方式优化自己的网站
黑帽：以不正常的方式：购买外链，垃圾站（色情网站，赌博网站），黑客行为（偷偷进入其他网站，加入单向直链）
沙盒：谷歌把垃圾网站放入沙盒。

3.话术设置（优化标题）
比如：原标题，前端开发，如何才能提高高薪就业
修改话术后：一个菜鸟前端的百万年薪之路
注：好的话术可以带来更多的流量。

4.关键词挖掘
（1）头脑风暴：一群人围绕特定领域进行改善，提出新的点子，出新的主意；
（2）利用搜索引擎相关搜索：浏览器的最底下会出现相关搜索（关键词查询工具：百度指数）长尾关键词目的性很强 ，可延伸性强；

5.域名选择（方便用户记忆）
（1）后缀选择，一般选择.com；
（2）短域名：越短越好记；
（3）域名历史，买之前，在搜索引擎搜索以下，查看是否有非法信息；

6.服务器选择
（1）相应速度快，如果三秒还没有打开，用户会对它失去兴趣，带宽尽量要大。
（2）稳定，国内服务器比较稳定；

7.代码优化
（1）代码去冗余（减少冗余代码，代码精简化，模块化）；
（2）自动化（工具：grunt，gulp,webPack,tinyPNG):可以压缩代码；
（3）语义化（p,h,a…)；

8.站群推广
（1）淘宝客；
（2）镜像网站；

其他手段
1.提升客户体验（易用性，UI优化等等）；
2.内容形式多样（视频，奇思妙想，还可以放游戏）；
3.代码属性的优化（alt,title,logo，写图片的一些属性，例如图片是干嘛的，描述性的信息可以让搜索引擎帮你抓取)；
4.相关搜索引擎产品协助（文库，问答。推荐工具：百度文库，可以上传文章，可以在文章里写网站链接，新闻：每天按时发一些消息）；

下面介绍几款推广的工具
1.推广工具；
2.百度指数，谷歌统计；
其他专业工具
1.CNZZ；
2.爱站网，战网工具（SEO综合查询）；