首页 / 大前端 / 前端开发中Seo注意事项

前端开发中Seo注意事项

2020-12-28 12:28 大前端 阅读 3729 来源

1.meta标签

在浏览网站的时候,我们会经常看到head里面会有这样两个meta标签

<meta name="keywords" content="">
<meta name="description" content="">

keywords我们称为关键字,简单理解就是你这个网站内容的关键字简单描述,要把网站你要优化的关键词放入到keywords后面的content中,多个关键词的时候要用英文的逗号隔开。

description是给搜索引擎判断这按个页面内容的,它对应的content应当放你网站的简介。

示例如下

<meta name="keywords" content="Seo,网站优化,搜索引擎优化">
<meta name="description" content="这是一个讲解seo优化的内容">

这两个标签异常重要,必须设置好。


2.网站Logo

网站的Logo一般讲都是一张图片,而网络蜘蛛是不能识别图片内容的,遇到图片只会读取alt里面的内容,所以我们的网站Logo图片中一定加一个Alt。通常一个alt是不够的,我们还会在图片外层嵌套一个h1标签和一个a便签(这两个标签作用在后面会讲到),用来提高我们的Logo字体的爬取权重,当网络蜘蛛检测到以后,会默认这个alt里面的字很重要。

示例如下

<h1>
    <a href='/' title='网站关键字'>
         <img src='https://www.baidu.com' alt='网站关键字' />
    </a>
</h1>


3.img图片

以上我们也讲解到了,网络蜘蛛不能爬取图片内容,只能识别img标签上面的alt属性,所以在html中放入图片的时候一定要加上相应的alt属性

示例如下

<img src='https://www.baidu.com' alt='网站关键字' />


4.a标签

在开发中要进行的给a标签加上title属性,网络蜘蛛会爬取a链接上的titile里面的内容,但是大量的使用title会感觉体验不好,在这里要随机应变,但是不要出现herf='#'这种空指向

示例如下

<a href='http://www.baidu.com' title='百度网站'>百度网站</a>


5.h1~h6标签

h1要分配给网站名称或给带alt标签的logo使用。h2标签用来定义“站点副标题”。如果没有副标题,h2标签最好也空着,以备不时之需。h3标签用来定义导航栏目名称,h4标签用来定义文章列表标题,但大多数内容系统,文章列表输出用UL标签,所以h4可能就派不上用场,这里只是以此类推。


6.页面结构清晰

使用语义化标签比如header、footer、content、section,js、css使用外部文件

猜你喜欢