前端seo小结,网页代码优化
seo的目的:提高网站流量
- search engine optimization 搜索引擎优化seo
- search engine marketing 搜索引擎营销sem
权重10个等级 等级越大,权重越高
搜索网站提交入口
新上线页面可以在搜索引擎中提交url,让爬虫进行检索
seo优化的具体方法
链接:友情链接和网站内部链接
- 和权重高的网站进行交换链接
- 和内容相似的网站交换
- 内链,网站内的链接,提高网站的抓取率,用户的访问量。
内容质量
- 更新、质量、原创、关键词的密度2%-8%
- 标题的优化,比如:前端开发,如何才能赚到钱
优化:一个菜鸟前端的百万年薪之路 - 百度指数 长尾关键词
- 控制首页链接数量 :
首页是权重最高的地方,中小企业的网站链接在100个以内
其他优化
- 简洁的域名
- 给力的服务器配置
前端工程师怎样做seo
网站结构的优化
一、扁平化目录层次,三层结构以内,拒绝垂直搜索
二、分页优化
- 首页 上一页 下一页
- 首页 123456789 下一页
- 首页 123456789 下拉框
选用第三种方式,seo效果最好
三、html的优化
1、语义化标签
<header><nav><section><aside><article><footer>
2、标签中nofollow的使用
<meta name="robots” content="nofollow” />
/*告诉爬虫该页面无需追踪,不传递权重。
用于指示搜索引擎不要追踪网页上的带有nofollow属性的任何出站链接,*/
<a rel="external nofollow" href="url"><span>
/*以减少垃圾链接的分散网站权重!
对于外链链接,写上了nofollow标签,它会阻止蜘蛛进行跟踪,同时也阻止了权重的传递。*/
3、title标签的使用
4、keywords 关键字的使用
5、description 网页描述
6、导航使用ul ol,减少使用span,div
7、<em><i><b><strong>
巧妙利用标签
<strong>加粗,突出关键词,小蜘蛛会重点读取
<b>加粗,不影响seo
<em>斜体,会影响seo,效果仅次于strong
<i>斜体,不影响seo
8、h标签的使用
<h1> 正文标题用h1,副标题用h2 其他不需要用h标签
<p> 正文段落 <br/>标签需要用在<p/>中
9、表格中标签的使用
<table border="1">
<caption></caption>
<tr><th></th></tr>
<tr><td></td></tr>
</table>
表格使用 caption利于蜘蛛的爬取
10、<img> 应用alt属性
重要的内容HTML 放在最前面,利于seo
重要内容不要用js输出,不利于seo
尽少使用iframe 框架
display:none 小蜘蛛不读取
四、代码模块化、去冗余、精简
1、压缩图片、图片精灵
2、封装组件、函数等
五、自动化工具
- gulp
- webpack
六、提升客户体验(易用性,ui界面)