网站首页 - Html相关 - 正文

网站建设-DIV布局优势

这几天面试了几个网页设计的，不知道为什么，感觉质量都一般般，可能是应届生的关系，感觉对DIV的理解，都有误区。DIV+CSS是现下网页设计比较流行的说法，但其实这种说法是容易引起错误的，CSS并不是只针对DIV的，样式是针对所有的HTML标签的，DIV+CSS只是让设计师们多运用层来搭建框架，用CSS来设定样式，这2种方式的结合是未来设计网页的趋势。而并不是说你用了DIV一定能设计出比table更好看的页面，这点不存在。页面的好看程度关键关键的因素还是看美工的素质，美工PS能力高，网页就精美，一般淘宝上现在比较流行的还是用table直接做切割，原因就是方便，很多标签页和活动页面，有的只用一次的，所以用table相对比较省事，用完就扔了。而DIV做的最大优势就是修改方便，代码简洁。应届生经常走入两个误区，要不就是用惯了工具，只会用软件拉网页，根本不知道什么是标签，也根本不知道世界上还有一个叫DIV的东西；要不就是对DIV盲目崇拜，搞的好像除了DIV能做网页，其他标签完成的都是不规范的。其实这些误区大多都出现在新手阶段，多实践做几个站自然就会明白其中的道理。
我前些日子给一个来面试的举过一个很形象的例子，用table做网页就好比给你一张纸来做页面，需要撕开画好，再拼起来，非常方便，但是如果要改动，那就比较麻烦了，基本是要重新弄一张纸，重新撕开。用DIV做网页呢，就好比，给你好多张纸，大纸上面叠上小纸，一层一层的，第一次设计比较麻烦，而且会有不同的浏览器给予定义的样式不同，造成兼容性的差异，合理规避这些兼容性差异，然后精简代码，尽量较少“纸张”的浪费。这个例子显而易见，DIV做框架最大的优势就在于复用性，这是table无法比拟的，但是缺点也非常明显，table很少在浏览器中存在兼容问题，而DIV就非常常见，IE6,7,8，火狐，谷歌等，只要内核不同，浏览器都存在不同差异的兼容问题。原因不仅仅是因为DIV初始的CSS样式，在各个浏览器的表现不同，更重要的是老版本的浏览器，在定义样式时候距离的大小也不一样，甚至有的无法读取一些新的样式标签，有的无法向下兼容老的样式标签，所以造成各种兼容问题。这些了解一下就可以了。另外DIV的优势在于精简代码，有的网页复杂程度高的，用DIV的代码行数可能比用table的要少10多倍，原因有很多，主要取决于DIV的层特性，另外还有CSS可以做为外联式来给于代码最大的支持，而不占用代码空间。我们做网页设计的，用table来搭建框架（其实根本算不上是框架）只能做为入门级的设计要求，入门级主要要求是考验你的PS功力，当然入门级的如果你能用的炉火纯青，也是一种优势。高级的网页设计，必须用DIV来做框架，然后不断调整，各种浏览器之间的兼容问题，不断精简代码。html是个容错性非常强的语言，很简陋，不严谨，当然这是优势也是劣势，使得新手上手很快，也有的人会迷失在错误里，一直都没有养成好的编程习惯。比如很多人不习惯在

关门，这些其实都不会在浏览器中体现，但是这是一个非常不好的习惯，代码多了，容易造成错误，而且找错会让你很崩溃，这是小编的亲身经历，以前帮客户改代码，由于代码实在太乱了，再加上每个人的编程习惯会很有差异，改的非常崩溃，所以最后还是选择了重写代码。
做网页设计，个人感觉还是实践，基本能看懂一些优秀网站的代码，你已经成功了一半了，比如我就一直在看麦包包的网站，他们的网站是去年电子商务用户体验最好的。然后会把table做的网页高仿改为DIV框架的，你就已经是一个高级的网页设计师了。最后，多看一些优秀的站，有一些自己的想法，这样你就成功了。