前端开发SEO搜索引擎优化方案

搜索引擎优化,一般都是比较概括,比如优化目录结构,meta定义。本文也结合其他网上博文的内容,进行了一些总结下面就来具体化以下前端可以实现的搜索引擎优化方法:

1.优化html标签

尽量多使用一些HTML5语义化标签,比如:header,nav,footer,ul,ol,section等。

2.meta描述

可定义关键词,网站描述等

<meta name=" keywords" content="关键词1,关键词2" />
<meta name="description" content="描述1,描述2">

3.前景图片<img /> 添加alt属性,这个比较重要,有很多适用场景.

<img src="" alt="图片加载失败文本描述"  title="图片描述文本"/ >

 适用场景:(1)当图片未成功显示的时候,仍可以显示文本,用户也可以大致了解图片主题

                   (2)当图片成功显示的时候,鼠标以上图片,可显示图片描述

                   (3)可解决网速慢,src引用错误,浏览器禁用图像,用户使用屏幕阅读器等情况

4.前景图片<img/>要定义大小,不然会造成页面重新渲染,影响加载速度

<img src="" width="" height=""/ >

 5.可以适当的给链接标签a添加 rel="nofollow" 属性(例如:当我们项目的某一个导航不需要蜘蛛跟踪链接)

<a href="#" ref="nofollow">不需要跟踪的导航</a>

作用:(1)引导爬虫抓取一些有用的信息页面,提高爬虫的抓取效率

           (2)防止一些不可信内容,防止页面指向以下垃圾站点和页面 

6.内联采用绝对路径,减少服务器的响应时间

例如:<a href="www.baidu.com">百度一下</a>

不要采用<a href="/index.html"></a>

7.页面层级嵌套不宜太深

8.再就是SVG。因为svg图像的源文件是一个文本文件,有利于访问

9.注意: 页面跳转尽量使用<a href="#"></a>不要使用<div onclick=""></div>

猜你喜欢

转载自blog.csdn.net/qq_37143787/article/details/85221905