DIV+CSS网页布局对SEO优化有哪些影响

2016-03-02    编辑:edit02_lz     点击(
我们学DIV+CSS网页布局时,多少都会知道DIV+CSS搜索引擎的友好,现在我们来系统总结一下,它对SEO有哪些影响同,包括不好的地方。

第一:DIV+CSS页面对于spider爬行效率

Div+Css的代码精简是table无法比拟的,即使DIV CSS的html加上对应CSS文件一般都小于table的html文件,div+css实现了样式和布局完全分离,前台垃圾代码大量减少,内容更加突出,让蜘蛛在你的网站上快速爬行,短时间内爬完你的网站。

第二:改善网页打开速度

众所周之:客户是上帝。搜索引擎也不例外,所以搜索引擎会优先抓取客户体验比较好的网站。真正的SEOer不只是为了追求收录、排名,快速的响应速度是提高用户体验度的基础网站。试问:如果你打开一个网站需要一分钟以上,你下次还会来这个网站吗?
DIV+CSS布局较Table布局减少了页面代码,加载速度得到很大的提高,这在Spider爬行时是非常有利的。过多的页面代码可能造成爬行超时,Spider就会认为这个页面无法访问,影响收录及权重。
题外:tale布局的页面打开原理:一般table布局的页面是大表格套中表格,中表格嵌套小表格,小表格再套小小表格。一般第一个表格(最外边的)要读取完才能显示出来,读取大表格的同时又要读取大表格中的小表格,大大加长了网页打开速度。
即浏览器加载table页面时候通常是加载<table>开始等加载完对于</table>及加载完table的关闭才将内容送出显示给浏览者,这样让浏览者感到网页等等时间长点从而感觉慢。

第三:对搜索引擎排名的影响

基于XHTML标准的DIV+CSS布局,一般在设计完成后会尽可能的完善到能通过W3C验证。截止目前没有搜索引擎表示排名规则会倾向于符合 W3C标准的网站或页面,但事实证明使用XHTML架构的网站排名状况一般都不错。这一点或许会有争议,但?匪际癖救吮3终庋?墓鄣悖?幸煲檎呖梢阅萌?橐陨匣?就?戎柿康耐?径员裙鄄臁?/p>

DIV+CSS对网页的整体控制性要强很多。通过简单的代码修改,即可大幅度对网站进行代码优化改版。实用性很强。
很多人感觉CSS对排名虽然很有利,但是影响排名的因素重多。这并不唯一的没有基础的同样可以利用表格 但是表格不要超过三层。建议不会css+div的朋友有时间学习一下

DIV+CSS的不好之处:

1、开发DIV+CSS页面相对于TABLE页面需要更多的开发时间
2、兼容性,因现在处于浏览器大战时期,而各个浏览器的内核不同造成了一点点对CSS属性解释不同而造成兼容问题,这点是新手比较棘手的问题。相信浏览器在遵循W3C标准下能很好的统一其解释。

网页中使用h1、h2、h3标签的好处

在制作网页的时候我们要习惯用一些标签,虽然使用这些标签我们还需要对他的CSS样式进行设置,但是为了网站的SEO方面我们尽量适应。

<h1>标签具有标题意思,一个网页唯一标题的意思,对于搜索引擎来说遇到此标签说明此标签内内容有点重要,所以有让搜索引擎知道此处具有重要性内容,这个网页也是围绕此标题内容进行或相关的内容,我们把关键字放入此标签在某种程度说我们通过浏览器看起效果没什么不同但是对于搜索引擎优化(SEO)具有好处。

<h2>和<h3>标签在一个网页中就不像<h1>标签那样唯一性,但是也说明此两个标签内内容也重要,我们在制作网页时候可以适当加入此标签。

h1标签是否可以在一个网页(html)里出现多次(以<h1>开始以</h1>闭合结束,这样算一组,算出现一次)?答案是不能因为h1在一个网页中具有唯一的意思,所以只能用一次,假如我们用多次,给搜索引擎来说不知道此页面重点是什么一样。

h2和h3比起h1来说就没有唯一意思,所以可以在一个页面中适当使用几次。
通过h1,h2,h3,b加粗等方式可以使得一个网页在搜索引擎看了有层次和重点,更符合SEO优化,有利于搜索引擎排名。

特别说明h1,h2,h3的样式(如文字大小等)可以通过CSS样式设置来设定,以便于美化网页。

为什么要使用ul li布局网站导航条 CSS+SEO优化篇

为什么要使用ul li布局网站导航条?使用ul li布局网站网页导航必要性。对于SEO优化来说显得非常重要。CSS DIV布局时考虑seo因素。

会布局的都知道网站导航条布局非常重要,可能一个导航条最终布局效果有时可以使用ul li列表标签布局,有时可以不用ul li布局,而是直接一个div盒子里直接放锚文本超链接的栏目名称,也能实现,看下图。

假如要布局出这样简单导航条效果截图

假如要布局出这样简单导航条效果

比如以下代码:

1、可以使用Ul li布局导航条

 <ul>
    <li><a href="/">网站首页</a></li>
    <li><a href="/html/">HTML教程</a></li>
    <li><a href="/htmlrumen/">HTML入门</a></li>
    <li><a href="/html5/">HTML5教程</a></li>
    <li><a href="/rumen/">CSS教程</a></li>
    <li><a href="/cssrumen/">CSS入门</a></li>
    </ul>

 

2、也可以不使用ul li布局的

<div class=”nav”>
    <a href="/">网站首页</a>
    <a href="/html/">HTML教程</a>
    <a href="/htmlrumen/">HTML入门</a>
    <a href="/html5/">HTML5教程</a>
    <a href="/rumen/">CSS教程</a>
    <a href="/cssrumen/">CSS入门</a>
    </div>

 

通过以上两种布局都能实现同样导航条布局效果,但是DIVCSS5推荐使用ul li布局,哪怕多几个ul li标签代码也无妨。

这是为什么(推荐ul li)?

在不考虑网站优化seo布局情况下,DIVCSS5是推荐不用ul li布局从而节约html代码;但一般网站要考虑搜索引擎排名因素(SEO),此时如果不用ul li而是直接在一个盒子里放锚文本超链接的栏目名称,虽然html代码量减少了,但这样搜索引擎容易认为有堆砌关键字嫌疑(故意堆砌关键字容易被搜索引擎有降权的风险)。如果使用ul li列表标签布局,这个时候搜索引擎很容易辨别为有条理的列表型内容(对搜索引擎蜘蛛更加友好)。

综合以上描述,不难看出有时在div css网页布局中考虑seo搜索引擎优化时网页布局适当使用h1、h2、h3、h4、b、strong等标签必要性,如果在html css布局中对不同html 标签灵活使用,可能会得到意想不到的效果。当然使用不同标签的使用适可而止,不要滥用后成为适得其反。