超越起点 追随自由

连接
上一篇：重构之美－走在Web标准化设计的路上[复杂表单]
下一篇：重构之美－走在Web标准化设计的路上[深入结构：理解h系列的不合理。]

一个[复杂表单]热了热身，嗯，好，现在开始逐渐进入状态中……

这个副标题让我琢磨了很久，和之前的“随想随说”不一样，重新命名为《重构之美》后就给了我压力，让我认真对待仔细斟酌，这样其实也好。

2006 2 25 Create

Web标准在概念描述上涵盖了三个部分，结构[xhtml]、表现[css]、交互[DOM、ECMAScript]，准确的定义我就不摘抄凑字数了，百度上google一下，遍地都是。这三个部分我认为并非处于同一个等级，xhtml是最重要的部分是第一级，而css和script则并列处于第二级，简单如下图例：

我认为不要小看了这个认识，我觉得这个目前很多人都没有意识到的问题，即便意识到了，行为上也没有跟上。怎么说呢？script不是我所擅长的，所以我基本上不会涉及到Web标准中交互这部分，即便涉及也只是很浅，个人能力有限。css部分会有针对性的涉及到，但不会很多，因为我不想在css上做太多的文章，因为我感觉现在国内Web标准界对css的追捧有点过了，大小介绍Web标准的网站和书籍主要都是在介绍css的各种技巧，而对于xhtml部分的介绍很少，也就泛泛的提及用div代替table进行布局和书写规则，多一点的会提到语义。

有没有深入的理解过？为什么要严格书写？我想大部分的答案是通过认证。再问，为什么要通过认证？答不出来了？好，再来，那又为什么要严格书写？又是认证？这不扯蛋嘛！鬼大爷管你认证与否。那么严格书写需要吗？不需要吗？靠！再来说语义，说起来估计还有很多“Web标准”者连语义这两个字都不知道。我认为语义是xhtml的两个核心之一，另外一个核心就是今天要谈到的结构。比如对表格table的使用，都是这么说的：表状数据还是要用table标记。那么有没有想过什么样的数据是属于表状数据？我说把一个三栏式布局的页面视为一行三列表状数据行不行？我是在扯蛋，那么什么是表状数据？什么时候用table？现在网上关于xhtml语义理解的文章真的很少，为什么？css啊，从上到下都追捧css去了，以至于那天我在蓝色理想上见回帖：学div+css，但不准备遵守xhtml……。类似的还有很多，什么花样都有。无语中，我想每个真正理解了Web标准的人都会很无奈的摇头，近2年Web标准的推广演变为Css的推广。Css很重要吗？不重要吗？靠！我说不要Css行不行？你找一大堆完全合理的理由……“行不行？”“行！”那就对了，我说不要你的Css，我要他的Css，又行不行？那么和xhtml相比，Css重要在哪里？

最后我们来说说关于“用div代替table进行布局”这种说法，这么说吧，如果你是抱着这种思路使用div，我认为是错误的，布局这个概念其实是table带来的，如果你又把布局加到对div的理解中去，那么对不起，你还是一个“table者”。最典型的，有位朋友针对我上一篇[复杂表单]评论到：你这个表单看似复杂，其实很简单，不过左右两列式布局，左二右六，……。他还提到了“拼装”两个字，然后说我的代码不过是用div代替table，说我是table思路。看看看看他对页面的分析，“左右两列”，“左二右六”，“拼装”，多么熟悉啊，即便他用div实现了这样的布局，你认为他抛开了table吗？所以我说他完全没看懂我的代码。我只听说过“不要使用table布局”，没有在很官方的地方看见过“用div代替table进行布局”这种说法，都是人为造出来的，或许是为了更好的推广Web标准，但是现在我们要知道，这种说法是错误的！div从来不是布局元素，也没有哪个标记是布局元素。

像上面的图示，xhtml是根基，表现和交互虽然也很重要，但毕竟可以不要表现，也可以不要交互，但是不能不要xhtml，所以在现在，在现在狂热的追捧Css，几乎达到忽略xhtml这个根基的环境下（比如上面我说的那个回帖），我要站出来，振臂一呼：Css，Stop!（不知道有多少人响应我，鄙视我也欢迎，当我是疯子一笑而过也可以。^_^）

本来打算简单说说Web标准的概念和对现状的不满，然后专心写[深入结构：理解h系列的不合理。]，结果扯谈了这么多，也好，换个标题发布，[深入结构：理解h系列的不合理。]放到下篇来写。

2006 2 27 Update

连接
上一篇：重构之美－走在Web标准化设计的路上[复杂表单]
下一篇：重构之美－走在Web标准化设计的路上[深入结构：理解h系列的不合理。]

---------------------垃圾部分－－－－－－－－－－－－－－－－－－

..
            <div class="personinfo">
                <h2><span>个人信息</span></h2>
                <div>
                    <h3><span>购房人</span></h3>
                    <table>
                        <tr>
                            <td><span>选择</span></td>
                            <td>姓名</td>
                            <td>性别</td>
                            <td>年龄</td>
                            <td>关系</td>
                            <td>户籍所在地</td>
                        </tr>
                        <tr>
                            <td><input type="checkbox" /></td>
                            <td><select /></td>
                            <td><input /></td>
                            <td><input /></td>
                            <td><select /></td>
                            <td><input /></td>
                        </tr>
                    </table>
                </div>            
                <div>
                    <h3><span>家庭成员</span></h3>
                    <table>
                        <tr>
                            <td><span>选择</span></td>
                            <td>姓名</td>
                            <td>性别</td>
                            <td>年龄</td>
                            <td>关系</td>
                            <td>户籍所在地</td>
                            <td>工作单位</td>
                            <td>编辑</td>
                            <td>删除</td>
                        </tr>
                        <tr>
                            <td><input type="checkbox" /></td>
                            <td><select /></td>
                            <td><input /></td>
                            <td><input /></td>
                            <td><input /></td>
                            <td><input /></td>
                            <td><input /></td>
                            <td><button /></td>
                            <td><button /></td>
                        </tr>
                    </table>
                    <p>
                        <button />
                    </p>
                </div>
            </div>