前端优化：SEO

前端

一、简介

1. 定义

搜索引擎优化 (Search Engine Optimization, SEO)：使用优化手段使网页被网络爬虫（如百度蜘蛛等）更友好地接纳，以提升排名和被搜索数量。

2. 分类

分为白帽SEO和黑帽SEO两种，前者指的是合法优化，后者指利用搜索引擎的政策缺陷等欺骗手段进行排名提升。

二、白帽SEO

1. 内容方面优化

1. 网站标题、关键字、描述；
2. 网站内容优化；
3. 网站地图设置；
4. Robot.txt文件；

2. 前端代码优化

1) 网站结构布局优化

1. 扁平化目录层次：首页→栏目页→内容页，跳转3次即可到网站内任何一页；
2. **首页链接数量适中：**100个锚左右即可，不勉强，信息内容传达至上；
3. 导航优化：主导航、副导航、面包屑导航结合；
4. 内容页：分页条（<<、<、数字、>、>>、下拉）、相关链接（相关性和权重）；
5. 控制页面大小：不超过100k，加载速度不能太慢；

2) 网页代码优化

1. 重要的HTML放前面，JS放最后</body>之前；
2. JS、Flash、iframe生成的网页不利于搜索引擎抓取，重要内容不用JS输出；
3. title、meta[name="keywords"]、meta[name="description"]；
4. 标签应用、类名命名均高度语义化；
5. <a>标签要加title属性，对于网站外链需加rel="nofollow"；
6. 文章标题首选<h1>、<h2>；
7. <table>应用<caption>定义表格标题，在CSS内根据需要隐藏；
8. <strong>、<em>都有增强语义的意思，为表强调则不妨少用<b>、<i>多用语义化的前两者；
9. <img>应配合alt、title说明使用；
10. <br />应在文本<p>内使用；
11. 文本<p>内不建议使用 等非文本；
12. 慎用display:none;，爬虫将过滤这一属性的容器内容，如需隐藏，可用z-index等属性或显示到视界之外；

附：参考

慕课：SEO在网页制作中的应用