网站前端SEO代码及标签的优化

网站优化结构布局要求尽量往简单优化，提倡扁平化结构。所以代码优化是SEO内部优化一个重要部分，不然发个外链、写个文章，是个人基本都能够做到的，为了跟上SEO的步伐，学代码懂前端，甚至独立搭建网站是SEOER必需经过的一段路程！网站建设★网站设计★网站制作★网页设计-800元全包;企业网络推广☆网站优化☆seo☆关键词排名☆百度快照-2200元全年展示;做网站优化排名-网站建设公司

成都创新互联公司专业为企业提供眉县网站建设、眉县做网站、眉县网站设计、眉县网站制作等企业网站建设、网页设计与制作、眉县企业网站模板建站服务，10多年眉县做网站经验，不只是建网站，更提供有价值的思路和整体网络服务。

这也是为什么我把seoer分为三个阶段原因，我一直认为seoer有三个阶段这里简单的说下：

第一个阶段

就是目前seo行业内最多的一部分人，他们只有一些seo基础，甚至专业知识都不是太会，而seo学了足够的专业知识也没能突破第一个阶段。他们只有seo的相关知识。

第二个阶段

是目前业内存在很少的一部分人，这部分人会seo知识同时也具备了一定的代码知识，也就是html。

第三个阶段

可以说业内所存在的更少，这部分人已经不止与seo，代码知识，他们还需要懂编程。只有这部分人才能真正的把seo做好。

做网站优化最开始部分就是要做好我们网站的前端seo。做SEO优化的基础也是做好前端的SEO优化。

所以说前端代码优化尤为重要，通过网站的结构布局设计和网页代码优化，使前端页面既能让浏览器用户能够看懂，也能让“蜘蛛”看懂。

一、DIV+CSS

DIV+CSS的网站结构对SEO优化起到的作用越来越明显。

其只要原因有一下几个方面

1、采用这种结构后，html页面里基本只有文字或图片信息，而样式则放在css里，这样搜索引擎蜘蛛就不会管css，只采集html里的内容就可以大大提高搜索引擎蜘蛛的效率。

2、采用这种结构往往关键词更集中，密度更高。

3、div+css 行对于table来说比较精简，基本不存在表格嵌套的问题。

4、符合W3C标准的网页在SEO优化方面本身就是优势，更得到搜索引擎蜘蛛的喜爱。

二、Meta标签

Meta标签：如果要做的非常简单，meta标签只需要设置一个字符编码就可以了，咱们在任意地方购买的模版都会写上字符编码，另外Title标题、关键词、Description描述这里也列为meta标签去优化，这三个地方，一般在模版中会直接调用到后台，可以直接在后台设置，所以代码上需要基本是不需要操作。

三、css/js引用

搜索引擎蜘蛛处理的是文本文件，对页面源代码中没有出现的内容则看不到，用户的行为或者其他事件之后才获取并嵌入页面上的动态内容和连接不能被搜索引擎看到，网页中大量的javascript 将影响蜘蛛对页面的抓取和增加网页体积，会延迟网页的打开速度，直接影响用户体验。

在优化的过程中要尽量减少javascript代码的运用，对必须要使用的javascript，也要尽量放到网站的底部先加载正文，或外部js调用(封装)。

为什么要放在底部呢?

可能你不懂代码就不知道了，这里来解释一下，因为浏览器在渲染页面时(也就是展现页面)会从上到下渲染。

我们的模版，JS绝对都是放在头部，但在优化的过程中，而JS文件通常是效果文件，我们可以让网站先加载主题内容，其次加载效果内容，所以有必要把JS文件从头部移动到底部，这样用户看起来你的网站会访问的更快，当然如果CSS有必要，一样可以这样做，常规的CSS是不建议放到底部，会影响加载效果。另外JS及CSS不建议在html模版中写入，最好是新建一个JS或CSS文件，然后把JS或CSS内容放入，在调用这个CSS或JS文件即可。

四、清理垃圾代码

清理垃圾代码是精简代码其中一个非常重要的环节。垃圾代码是删除后不会影响页面显示的非必要的代码，一个页面在清理了垃圾代码后，可以删除近80%的冗余代码。从而达到降低页面体积，提高页面的用户体验和搜索引擎友好性的目的。常见的垃圾代码有 空格字符、默认属性、注释语句、和空语句等。

1、空格字符

空格字符实在编辑代码时敲击键盘上的空格键而产生的符号，网页中每一个空格都算作一个字符，通常出现在每行代码的开始处、结尾处以及空行中。

2、默认属性

我们在使用网页制作软件时，都会产生一些默认属性的代码，比如我们在网页中不添加左对齐的属性，但是页面中的内容也是左对齐的，所以代码中的左对齐属性代码就可以删除。

3、注释语句

在制作网页的时候，我们会添加一些注释语句来增强代码的可读性，但是过多的注释语句会占用大量的网页空间，而且如果注释语句中存在大量的关键词，还会被搜索引擎认为是堆砌关键词，从而对该站进行处罚。所以我们在添加注释语句时，就尽量避免添加那些即使删除后也不会影响网页源代码可读性的注释语句。

4、空语句

空语句是指标签之间不存在任何内容的空句子。

五、LOGO：

LOGO部分需要优化的主要有两个方面，第一个方面在LOGO处加H1标签，其次是在LOGO的A标签处添加一个title属性，title属性中写上你优化的主关键词，之所以建议写主关键词而不写品牌词原因有两个，第一个增加优化主关键词的密度，其次是title属性用户很难得看得到。

六、导航：

导航上的优化，通常就是一个A标签，这个A标签不建议设置新窗口打开，另外一个是A标签中的title属性，如果条件允许，可以直接设置成行业词，而A标签中可显示的文字可以设置成品牌词，这样在不影响体验的同时一样达到了优化关键词的效果。

这里需要提醒一点的是，当一篇文章出现两个一样的A标签指向的时候，我们需要用nofollow标签屏蔽其中一个链接，这里描述和标题都出现了同一个链接，这里建议使用nofollow标签屏蔽描述上的链接，加上去是为了让用户方便点击，屏蔽是为了不让搜索引擎重复抓取。

七、搜索：

站内搜索页面本不建议做SEO优化，因为大多站内搜索都是动态页面，而这些动态页面均直接用robots屏蔽百度蜘蛛。

八、图片优化

1、名称

由于搜索引擎无法读取图片内容，但是可以读取图片名称的相关文本信息，所以我们在保存图片名称时，要确保图片文件名或字符串包含主要关键词。例如一张熊猫的图片，我们可以随意命名，但是我们最好将其命名为xiongmao.jpg 或者 panda.jpg 这样URL字符串就包含了这张图的关键信息。

2、ALT标签

图片中的信息要想让搜索引擎更好的理解，必须利用alt属性，图片的alt属性是对图片信息进行简要阐述。alt属性非常重要，必须做到与图片相关，与内容相关，且需要避免为了关键词堆砌而堆砌，该属性不仅能够让搜索引擎更好的理解，同时若图片出现错误时，也能够让用户了解图片想要展示的主题。

网站优化从根本上来说，是为了用户更好的获取信息，而不是搜索引擎中获得良好的排名，取得好的搜索结果排名只是正常网站优化结果的自然体现。所以在设置描述 alt这些属性时，应该本着遵循用户导向的原则，简明扼要地描述图片内容。

3、大小

如果网站不是专业的图片展示，网站只要满足普通视觉效果就可以了，图片越小加载起来就越快。

九、版权：

版权是可以留下的，使用别人的程序不留版权是不道德的行为，所以有必要在底部留下对于的版权信息，但是版权、备案、站外链接都应该加nofollow标签，当然这是站外的链接，站内也有部分链接需要加入nofollow标签，比如网站底部的广告合作、联系方式等页面。

十、体验：

其实在用户体验上的优化本问说的并不少很多，但代码可以决定用户体验，比如增加百度统计的返回顶部功能，文章页面增加快速评论功能、一个网站最多只能显示3屏、左右可以翻页等功能，看起来功能非常少，但综合的细节决定一个网站的成败!

十一、网站地图：

网站地图是搜索引擎最容易抓取的一个页面，这个页面里面有所有应该被抓取的内容，所以很多时候，搜索引擎为了偷懒，他自然会抓取网站地图文件，通常情况下网站地图的代码如下所示：

http://www.xxxxx.com/

1.0

2018-05-08T07:01:31+00:00

Always

代码非常简单LOC为链接、priority为权重，比如首页为1，栏目为0.8，changefreq为更新时间。

12、Robots：

搜索引擎在抓取一个网站的时候，第一时间看robots 文件，这里可以识别到哪些文件可以抓取，哪些文件不可以，robots文件最主要一点就是把网站地图写上去，如下所示：

Sitemap:http://www.xxxxx.com/sitemap.xml

最后题外话，虽然我不完全相信二八定律，但二八定律绝对是真实存在的。

大的不讲，放在SEO这行里，可以总结为以下几条：

1、80%的人从来没自己实战过网上的说法!

2、80%的网络公司都没有自己核心的技术!

3、80%的SEO从业人员水平都很一般!

其实跳出SEO这个圈子，放到其他行业，也是一样的，其他行业里的一些道理，放在SEO里，也同样适用。