页面模块化实现的很大的受制于页面的结构和表现；一个统一的页面结构和表现能很好的实现页面的模块话。

    比如一个“网友评论”模块这个会在很多地方使用到，比如日志，照片，等等，如果这个“网友评论”模块结果和表现是统一的那么我们就不用重复劳动去重新设计制作页面甚至是行为等等，包括后台的数据存贮。

    《页面模块化（设想）》上面总结了页面模块化的优点，《前端模块化设计思路》也提到要做到模块化的前提条件：

    为了做到这一点，我们需要有一个设计规则，所有的模块都在这个规则下进 行设计。良好的设计规则，会把耦合密集的设计参数进行归类作为一个模块，并以此划分工作任务。而模块之间彼此通过一个固定的接口（所谓的可见参数）进行交互，除此之外的内部实现（所谓的隐参数）则由模块的开发团队进行自由发挥。

    我们应给怎么样建立一套设计规则呢？

    首先我们要从页面的表现开始，视觉上我们要采用统一的视觉设计规则，比如：

应用网页栅格化来确定网页布局；页面标题栏，字体大小，文本间距统一；表单类的表现统一，比如按钮，文本框等；图片规格统一；行为类的弹窗，浮层等表现统一；等等…

    其次为模块编写统一的html结构，

要合理使用语言化的标签；可以保存成代码片段或者单独的html文件等，如果需要可以加上适当的注释；考虑扩张性和维护性；

    再次编写为模块编写统一的css，比如：

要有统一的命名规则（查看鬼哥的命名规则），当然建议加上模块的命名规则，不过我的建议是在模块的命名规则前加上mode_前缀，例如：弹出 mode_pop公共 mode_global,mode_gb标题 mode_title,mode_tit提示 mode_hint菜单 mode_menu信息 mode_info预览 mode_pvwTips mode_tips导航 mode_nav

    当然你也可以根据你们团队重新命名一套规则；合适的才是最好的做好基类和拓展类的设计,做好在不同页面模块变化的差异性；比如同一模块在A页面标题的字体是粗体，在B页面标题的字体是细体等等；将每个模块的css保存成独立的独立的css文件；如果需要可以加上适当的注释；考虑扩张性和维护性

    接下了为该模块添加行为（js），编写层面向对象的js，提高代码的复用率等等；

    最后审视模块间的耦合问题，比如，留言模块和发日志，填表单都会使用到表单元素，按钮，文本框等，那么我认为我们应该把表单样式作为一个独立的css模块，html和js模块还是在原来的模块中。这需要我们对这些模块归类，从而更好，跟方便的的拼装我们的页面，

    html模块可以布局模块和功能模块等；

    css模块比较复杂大致的

按类别分的公共模块：重置模块（css reset），表单模块，字体模块，文字、图片、图文列表模块，弹窗模块，标题模块，提示模块,应用小图标模块等等；这里模块绝大多数作为功能模块的部件，融入在各个模块中；按功能分的模块：日志模块，评论模块，相册模块，工具条模块等等；按布局分的布局模块：比如栅格化中的一堆布局组合；

    行为js模块可能就相对简单一点,库模块，功能模块等；

    这样我们就有了网页模块化的基本实现思路，当然这是建立在设计规则上的，如果我们没有完备的设计规则，那么网页模块化就会变成网页魔鬼化，呵呵。

    参考文章：

    前端模块化设计思路

    http://www.cssforest.org/blog/index.php?id=167

    http://www.cssforest.org/blog/index.php?id=143

建议继续学习：

1. 了解模块化开发    (阅读：2853)
2. 基于 SeaJS 模块化开发的一个实例    (阅读：2594)
3. 页面模块化（设想）    (阅读：2232)
4. 样式的作用域──页面重构中的模块化设计（一）    (阅读：2245)
5. 浅谈 C 语言中模块化设计的范式    (阅读：2075)
6. C 语言对模块化支持的欠缺    (阅读：1954)