关注前端开发
关注用户体验

DIV+CSS忽悠前端小白

在大约两年前,DIV+CSS是一对很诱人的组合,会用DIV+CSS制作网页的人,常常会被人赞以大拇指的,记得06年初的时候,我用 div+css布局的一个纯静态网站还拿了学校网页设计比赛的一个奖。

今天,尽管提到DIV+CSS,还会有很多人热情高涨,但是我会对他 摇头了:DIV+CSS不是一切,更不是某些人所谓的“神话”!创造神话的是CSS,不是DIV+CSS。我想,是时候纠正这个问题了。

CSS 的要义,是各个标签要各尽所用。

盲目推崇DIV+CSS只会让小白误入歧途的。

1、DIV只是HTML最常用的标签之一

显 然HTML并不只是一个DIV标签有用,每个标签都有它的用途,只是DIV是其中最有用的一个罢了。如果DIV可以实现所有其它标签的功能,那么W3C早 就把HTML精简了!

Table也不是一无是处,只是用table比较简单、容易上手才在早期被人错误的广泛推广。但是table在处理网 页数据的表现上,是其他标签无法替代的,只是,它不适合用来做整个页面的布局。

2、代码的可读性

纯DIV+CSS的网站 的代码的可读性无疑是非常差的,甚至table还可以通过tr和td来区分行和列,一堆DIV堆砌在一起,如果没有注释,你根本不知道某个部分是做什么用 的。

3、语义化与结构化

现在,在开发CSS的时候,提的越来越多的是语义化,语义化归根到底其实还是代码的可读性问题。 语义化就是让代码更易读,更加易懂,比如,.text_01{color:red} 就没有.text_red{color:red} 容易理解。

HTML 同样如此,比如我们看到<ol>就知道这是个有序列表;看到<p>标签就知道这是一个段落,内容为文字;看 到<span>就知道这个是比<p>还小的文字单位;看到<h1>、<h2>之类的就知道他们是标题。

显 然,全部是div的页面,是看不出来这些的。

页面的结构化亦是如此,比 如<div><div><div><div>…..</div>< /div></div></div>这样的代码,显然是很难理解其DOM结构的,但 是<div><p><h2><span>…..</span>< /h2></p></div>就比上面的那个结构要清晰很多。

相信做开发的人对代码的语义化和结构化的理解 会更加深刻。

4、团队合作

可读性低、结构化和语义化差,团队的其他成员的学习和维护难度就会提高,这对于一个团队来说, 是很浪费时间和精力的。

其实,DIV+CSS的说法,已经把我们从table带到了另外的一个极端,正确的网页设计不是一 个标签雄霸天下,而是每个元素都使用合适的标签。

所以说,DIV+CSS要换一种说法了,(X)HTML+CSS不更合 适吗?

请不要再特意提DIV了。小白们真的会把它当作宝贝的!

其实回头看看国内普及标准化的过程,已然走错路了,就在国外同 行研究CSS Sprites和网格(Grid)等技术时,我们在做什么?就在国外CSS框架遍地开花的时候,我们在做什么?到现在我们还是只能去国外的东西,依然跟在 别人后面。

两年了,我们依然纠缠于DIV+CSS……

赞(1)
未经允许不得转载:大前端 » DIV+CSS忽悠前端小白
分享到: 更多 (0)

评论 8

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
  1. #8

    You are my inhalation , I own few blogs and rarely run out from to post : (.

    Ida Palmios2周前 (05-16)回复
  2. #7

    hey all, I was simply checkin’ out this blog and I actually admire the premise of the article, and don’t have anything to do, so if anybody wish to to have an engrossing convo about it, please contact me on AIM, my name is heather smith

    Nonton Anime2周前 (05-11)回复
  3. #6

    What would be your next topic next week on your blog..`,’`

    cat products3周前 (05-09)回复
  4. #5

    Perfectly written subject material , thanks for selective information .

    my singing monsters2个月前 (03-28)回复
  5. #4

    My brother suggested I would possibly like this blog. He was once entirely right. This submit actually made my day. You can’t believe just how so much time I had spent for this information! Thank you!

    Claudio Spurzem3个月前 (03-11)回复
  6. #3
  7. #2

    网站做得不错 :mrgreen:

  8. #1

    这个写的不错,不过好像谁发过了。

    海良9年前 (2010-12-29)回复

themebetter 国内更好的WordPress主题服务商

立即前往