DIV+CSS好处在哪里？

发表时间：2008年六月 11th ， 分类：技术与产品, 搜索引擎营销， 标签： 大连seo, 大连网页设计, 大连网站建设, 搜索引擎优化, 用户体验

DIV+CSS好处在哪里呢？我认为有三点：

1，多终端兼容显示。19寸显示器能看懂的页面，4寸的触摸屏也能看懂；
2，搜索引擎优化。同上功能，页面结构代码搜索引擎可以清晰看懂；
3，设计更替方便，执行效率高，节省资源。

作为一种新的web前端布局技术，Div+css在2004年的中国很火，以蓝色理想为主要基地，各种网站开发人员都以研究Div+css为荣，那时候Div+css还有一个很概念化的名头，叫“网站重构计划”，当时人们的注意力主要集中在div+css的两个优点上：一是执行效率和代码优化；二是多终端平台的显示兼容。2004年SEO的声势还没扩展到网站开发的各个工种，所以设计师和程序员们还很少提到适合搜索引擎。

此后沉沉浮浮，和任何一个被炒作的概念一样，Div+css被片面夸大过，也被冷落轻视过，2005年的时候我刚到大连，在跟我的部门经理介绍div+css的时候被她认为是“很简单的网页排版”，因为彼时开发工具的因素，div+css的开发效率很低，明显劣于传统table布局速度，领导者又不重视，所以很多掌握div+css技术的开发人员都不愿意浪费个人时间去重构网站，这种局面持续到2006年的时候，大连一些较大的网络公司开始逐步重视，并且在招聘的时候有意识的进行相关人才引入，到了2008年，几乎所有网页设计美工的招聘条件上，都有了这一条：熟悉div+css布局。

这样，div+css终于在大连这样的二级城市走了红运，会这种技术的美工和程序员成了抢手货，这个时候对div+css的需求已经不仅仅是上面两种原因，主要是div+css对搜索引擎的友好度，其核心精神迎合了搜索引擎的习惯，适合搜索引擎抓录和识别。

更准确一点的讲，我认为div+css应该被称作“html+css”，因为div即html的标签之一。抛却很多理论化的东西，我们可以把html看做是网页的“结构”，把css看做是网页的“形式”，html+css也就是结构和形式分离的技术。

关于结构和形式分离的问题，还需要进一步了解内容、结构和形式的关系，有时间我们再细讲。table布局的原理是利用隐形表格将页面结构规定好，再添加内容，浏览者看的清楚，搜索引擎和其它显示终端却读不懂，因为它放弃了html的标签结构，所有布局都是利用table实现的。

了解了这些概念，我们就明白为什么传统的table布局不适合搜索引擎收录，因为table在搜索引擎读来的含义是“盛装数据的表格”，而搜索蜘蛛爬行页面的时候，按照html代码一路寻找，过多的table嵌套和壅余代码会让蜘蛛迷失甚至停止爬行，html+css就避免了这个缺点，利用搜索引擎可以读懂的html标签，爬虫可以很清晰地明白页面的主标题（h1）是什么，次标题（h2）是什么，重点关键字（strong）是什么，新闻列表（li）是什么，清晰的页面结构完全适合搜索引擎的阅读习惯，搜索引擎就更乐于抓取页面，更容易提取页面的关键字，进而加大页面的权重，使页面排名靠前。

知道了html+css布局和table布局的本质区别，就能够清晰地解释一种误区：

很多人在用div+css布局的时候，没有引用html结构性的标签，而全部用的div标签，那即使你的网页是用div+css布局了，搜索引擎还是读起来稀里糊涂，代码优化和样式分离的功能是实现了，多终端显示和搜索引擎优化的功能还是不好，我们就没有真正理解div+css的核心精神。