SEOer不能忽略的网站HTML代码标签优化

网站代码码又称网站源代码或网站源码，作为SEOer不同于网页设计员需要懂得很多代码，不过了解并很好运用一些常用的HTML代码在网站优化和排名上能起到很大作用。主要介绍SEO优化中常用的title、meta、图片alt属性、H标签、nofollow标签，JS和CSS代码。

网站代码如何去查看？最简单方法就是在网页鼠标右键选择查看源代码、审查元素或者快捷键Ctrl+u。

一、部HTML代码标签Title和Meta

一个页面的三要素：标题（title）、描述（description）、关键词（keywords），这三个要素中的关键词的添加与否对网站优化排名上作用已经变得很小（有的网站你会看到虽然没有添加描述和关键词，但是排名也很好），但是从代码完整度情况考虑需要有这三种代码标签。

<title>页面的标题SEO</title>

<meta name="keywords" content="关键词" />

<meta name="description" content="页面描述内容" />

二、图片Alt属性

搜索引擎无法很好识别图片的文字信息，图片Alt属性可以帮助搜索引擎识别图片信息，因此，在优化网站时，尽可能利用Alt属性描述图片的主题内容，但是又要避免关键词的重叠堆砌，该图片属性作用也不仅仅告诉搜索引擎图片的主要信息，另外在图片出现加载失败时，还能够让访客理解图片所描述的内容，在完整的图片优化还可以在百度图片中获得排名。

1).表现方式：<img src="图片路径" alt="图片描述"/>所有的字母和符号都是英文状态下的，字母之间有空格。

上图中最佳的ALT属性：

①不太好，没有添加图片的alt属性内容

<img src="图片路径" alt=""/>

②较好的，添加了一个关键词

<img src="图片路径" alt="小狗"/>

③最好的，一段完整的描述

<img src="图片路径" alt="一只可爱的小狗"/>

④应避免的，关键词堆积

<img src="图片路径" alt="小狗 幼狗 大花狗 猎犬 牧羊犬 导盲犬"/>

2).什么情况下图片可以添加alt属性

并不是所有页面的图片都需要添加alt属性，网站上会有很多种图片，很小的图片，对你的文章没有任何表现意义的图片都可以不用写。

三、网站代码

（1）H标签

H（Heading）标签，HTML语言里一共有六种大小的h标签，是网页代码中对文本标题所进行的着重强调的一种标签，以标签<h1>、<h2>、<h3>到<h6>六种不同的表现形式对文本标题进行强调。文字从大到小，依此显示重要性的递减，也就是权重依次降低，h1定义最大的标题，h6定义最小的标题。h标签是成对出现的，以<h>开始，以</h>结束，遵循这样的原则是很有必要的，它能让页面的层级关系更清楚，让搜索引擎更好地抓取和分析出页面的主题。

正确使用：

h标签不是一个必要的标签，就是说可以没有；

h标签每个页面都可以有，它是以页面为单位的，比如说你的首页可以有h标签，产品页没有h标签，或者你的首要没有h标签，在详情页有h标签；

h1标签应用在页面最核心的地方，如果你的网站首页或者栏目页找不到能表现页面核心的地方可以把h1标签放在logo里面，事实上大部分网站logo都会使用H1标签，而在详情页可以添加在正文标题里面；

一个页面只能有一对h1标签。h1表现的是页面的核心，H2,H3,H4可以有多个...多个H1造成的后果是搜索引擎不知道你这个页面哪个标题内容最重要,会淡化这个页面的标题和关键词，同时可能会被搜索引擎当做作弊惩罚；

如果页面有h2,h3,h4...这些标签，就要有h1标签。在代码完整角度情况下，如果有h2就要有h1;有h3就要用h2,h1;有h4就要有h3,h2,h1，......保证代码的完整性。

（2）Nofollow标签

nofollow 是一个HTML标签的属性值。这个标签的意义是告诉搜索引擎"不要追踪此网页上的链接或不要追踪此特定链接。表示的是某个链接的属性。

书写形式：<a href="链接地址" rel="nofollow">文本内容</a>，符号和字母都是英文状态，字母之间有空格。

引用nofollow标签的目的是：用于指示搜索引擎不要追踪（即抓取）网页上的带有nofollow属性的任何出站链接，以减少链接分散网站权重！

简单的说就是，如果A网页上有一个链接指向B网页，但A网页给这个链接加上了 rel="nofollow" 标注，则搜索引擎不把A网页计算入B网页的反向链接。搜索引擎看到这个标签就可能减少或完全取消链接的投票权重，从而给予其他链接更多权重。

用处：

比如一些常用的QQ出站链接，一些小而杂乱的链接，你可以为站点的内部链接添加 nofollow。比如：联系我们、关于我们、隐私保护、公司简介、网站后台等的链接可以把它们nofollow 掉，这样做，首页的PR值就不会传输给他们。因为，他们有太多的PR值（网页的重要性指数）显然没用；另外网站上的一些广告，因为这些广告只是让其带来IP和流量，而不是让其加重搜索引擎的权重，所以也可以加上这个nofollow标签，这样不会影响其本来意愿。

打开站长工具网站，在“SEO信息查询”中选择“友情链接检测”，或者查看对方网站的源码。赶快去查询下你的友情链接是否可靠吧！是否被人偷偷的添加了nofollow标签。如果友链被nofollow了，一定把自己网站对它的友链删掉，因为这严重影响了网站的优化。

nofollow还有另外一个含义：不可信任的链接。

注意：你的网站可以没有nofollow标签，但是如果使用了就要谨慎利用，以免带来不利的影响。

四、JS和CSS页面加载优化

JS（Javascript）是一种直译式脚本语言，在网页上表现是一种动态的功能效果，比如说：首页的banner图在不停切换，它的一个切换效果；全屏浏览图片效果，网页中的特效表现就是由JS代码完成，对于SEOer来说这个代码就很复杂了。

CSS是页面的样式，可以控制网站的文字、图片的颜色大小和布局。

这些属于网站的特效和样式，从优化的角度如果JS和CSS文件太多，搜索引擎访问页面话费时间会增加，页面打开速度也会变慢，此外wordpress部分插件JS会使用谷歌字体，谷歌服务器在国内经常被墙，如果实在找不到也没打开速度变慢原因，有可能就是这样JS或者CSS代码影响。对于JS和CSS优化就是可以把CSS和JS合并。

五、target=_blank标签

target=_blank，是html中锚链接中target属性的一个选择值，即点击链接的时候是否打开新页面。

是否重新打开页面看起来也许并不是特别起眼，甚至可以说是非常小的细节。但往往正是这种小细节决定了用户体验性。

1、交换来的友链

用户在浏览我们网站的时候，有可能会误点击网站内的友链链接，这些链接大多跟我们网站不属于统一站点。如果这时没有为这类链接设置target=_blank标签，这些新打开的页面就会替换掉我们自己网站的页面。

用户进入友链网站或者广告之后，极大可能是关闭页面，不设置target=_blank标签，用户想要再次进入我们的网站，只能从搜索引擎重新搜索进入，这无疑影响了用户体验，甚至是流失用户。

2、由栏目页到详情页

这是非常常见的情况，即客户从一个概述或者总结性质的页面，进入到其中某一小块的详细页面中时，就应使用target=_blank标签。

我们就拿百度或者谷歌这类搜索引擎举例子，如果客户用搜索引擎搜索内容时，他并不知道哪一个搜索结果是他想要的。当用户进入某个搜索结果时，客户仍然希望可以看到其它的搜索结果。这时使用target=_blank标签就可以方便他浏览其他的搜索结果。

3、用户在当前页面的操作成本较高时

这一点，在优化网站的注册系统时需要非常注意。

正常网站注册都需要填写姓名、邮箱、年龄生日、社交账号、手机号及验证码等等繁琐的信息，有的专业网站甚至还需上传个人照片及身份证照片。无论什么网站，在最后的时候都会有一个用户协议需要勾选同时还要可以点开。

如果用户协议没有设置使用target=_blank标签，那么用户在点击查看用户协议的时候，之前所有的操作都会被进行刷新。从用户层面来说一定会异常的懊恼，甚至可能会关闭网站。对网站而言就会损失用户或者流量。

所以，在用户进行一些操作成本较高的操作时，比如注册或者进行一些上传图片、文章的操作时，都需要进行新标签的打开。必要的情况下，用户在刷新页面的时候也要进行弹窗的提醒，警示用户该页面的输入信息将会丢失。

当前页面有正在播放的流媒体

当用户在我们网站播放一些视频或者音频时，如果误点击了其它链接，没有设置target=_blank标签的话，进入其它页面之后，就会刷新之前页面播放的视频或者音频的记录。用户再次返回播放页面也只能重新播放或者手动调整播放进度，

这些对于用户来说，都是糟糕的体验。所以在当前页面有用户正在进行播放的流媒体时，都应当在给页面的内链中设置target=_blank标签。

本文链接：http://www.cjzzc.com/article/326.html