走中国特色的网站重构道路(2)

作者:Twinsen Liang 来源:twinsenliang.net 时间:2010-04-08 16:10:00 

3、将“没层级性”的文章采用<h>、<p>与<section>的组合取而代之。(使用模块化的大局观思维进行编码)

<html>
<head>
  <title>网页模块化</title>
</head>
<body>
  <h1>网页模块化思维</h1>
  <p>2010年v2.0版本</p>
  <h2>什么是模块化?</h2>
  <p>模块化是指解决一个复杂问题时自顶向下逐层把软件系统划分成若干模块的过程。每个模块完成一个特定的子功能,所有的模块按某种方法组装起来,成为一个整 体,完成整个系统所要求的功能。</p>
  <h3>什么是前端的当中的模块?</h3>
  <p>页面当中的每一个有独立内容并且能赋予标题命名的片段。</p>
  <h2>为什么要做模块化?</h2>
  <p>多人协同开发的同时能有一部分总体把控,但是每个人又可以独立的处理自己部分的代码,同时不会干扰到其他的成员的代码,高度提升效率。修改时只需要处理独立的需要修改的模块,对其余模块不会影响;出错时定位到具体模块,直接对于这一块进行版本回滚。高度降低风险。</p>
  <h2>怎么做模块化?</h2>
  <p>先按照主内容再细化内容两种方式分离出区块,由PM进行命名规则约定,分派至各人手中进行代码编写。最后由PM进行代码片段合并。</p>
  <h2>模块化需要注意什么?</h2>
  <p>公共部分的代码权限需要回归至PM手上管理;允许代码阶段性的臃肿,定期进行公共部分的版本整合。</p>
</body>
</html>

<html>
<head>
  <title>网页模块化</title>
</head>
<body>
  <section>
    <h>网页模块化思维</h>
    <p>2010年v2.0版本</p>
    <section>
      <h>什么是模块化?</h>
      <p>模块化是指解决一个复杂问题时自顶向下逐层把软件系统划分成若干模块的过程。每个模块完成一个特定的子功能,所有的模块按某种方法组装起来,成为一个整 体,完成整个系统所要求的功能。</p>
      <section>
        <h>什么是前端的当中的模块?</h>
        <p>页面当中的每一个有独立内容并且能赋予标题命名的片段。</p>
      </section>
    </section>
    <section>
      <h>为什么要做模块化?</h>
      <p>多人协同开发的同时能有一部分总体把控,但是每个人又可以独立的处理自己部分的代码,同时不会干扰到其他的成员的代码,高度提升效率。修改时只需要处理独立的需要修改的模块,对其余模块不会影响;出错时定位到具体模块,直接对于这一块进行版本回滚。高度降低风险。</p>
    </section>
    <section>
      <h>怎么做模块化?</h>
      <p>先按照主内容再细化内容两种方式分离出区块,由PM进行命名规则约定,分派至各人手中进行代码编写。最后由PM进行代码片段合并。</p>
    </section>
    <section>
      <h>模块化需要注意什么?</h>
      <p>公共部分的代码权限需要回归至PM手上管理;允许代码阶段性的臃肿,定期进行公共部分的版本整合。</p>
    </section>
  </section>
</body>
</html>

4、将原有的<ul>或者<ol>滥用的导航列表菜单使用<nl>取而代之。(这里前提是列表都最好都有个说明的原则)

<h5>导航菜单</h5>
<ul>
  <li><a href="index.html">首页</a></li>
  <li>
    <h6><a href="#">音乐库</a></h6>
    <ul>
      <li><a href="cn.html">华语</a></li>
      <li><a href="jk.html">日韩</a></li>
      <li><a href="eu.html">欧美</a></li>
    </ul>
  </li>
  <li><a href="bbs.html">论坛</a></li>
</ul>

<nl>
  <label>导航菜单</label>
  <li href="index.html">首页</li>
  <nl>
    <label>音乐库</label>
    <li href="cn.html">华语</li>
    <li href="jk.html">日韩</li>
    <li href="eu.html">欧美</li>
  </nl>
  <li href="bbs.html">论坛</li>
</nl>

5、有上例当中的“无处不在的链接”。(将多余的不必要的标签去除)

标签:xhtml,重构,网页设计
0
投稿

猜你喜欢

  • jQuery入门之–属性(一)

    2009-07-12 15:29:00
  • ASP实现文件直接下载

    2008-11-19 15:39:00
  • sqlserver 临时表 Vs 表变量 详细介绍

    2011-11-03 17:34:10
  • 如何获取机器的网络配置属性?

    2009-11-23 20:44:00
  • MYSQL教程:表达式操作符和数据类型转换

    2009-02-27 15:51:00
  • 我的栅格系统实现

    2008-09-21 13:50:00
  • 用javascript实现页面无刷新更新数据

    2011-08-14 07:54:08
  • 使用FCKeditor添加文章时,在文章最后多了逗号

    2007-10-11 13:38:00
  • asp如何使用MsChart制图工具?

    2010-06-05 12:40:00
  • asp error对象基础

    2008-08-04 13:25:00
  • 技术性击倒与抬杠

    2009-02-12 12:28:00
  • 用Dreamweaver MX轻松操作表格

    2009-05-29 18:41:00
  • 从xml中获取城市,省份名称

    2008-09-05 15:07:00
  • Doctype之谜

    2009-07-22 20:48:00
  • 一些关于asp 购物车的想法

    2011-04-10 11:10:00
  • ACCESS模糊查询出现"内存溢出"

    2009-08-13 14:25:00
  • ASP:Cookie使用指南

    2007-09-28 12:48:00
  • ASP中利用ADODB.Stream对象将字节流转换为字符流

    2008-06-07 08:56:00
  • 让ASP搭配MYSQL

    2009-10-04 20:30:00
  • 一个拖动层和Onmouse自动下拉效果

    2007-10-08 21:25:00
  • asp之家 网络编程 m.aspxhome.com