带来一篇网站重构:叙述XHTML2.0和HTML5.0
对相应的代码做一些简单的修改，就可以改变同一页面的不同部分，或者页数不同的网页的外观和格式。网页制造poluoluo文章简介：继团队的CSS3.0中文手册在国际首发今后，比来风风火火的各处吹起HTML5.0和CSS3.0的东风；仿佛在这扫瞄器相互奚弄的年月，成绩了一年夜堆业界茶余饭后的话题。
继团队的CSS3.0中文手册在国际首发今后，比来风风火火的各处吹起HTML5.0和CSS3.0的东风；仿佛在这扫瞄器相互奚弄的年月，成绩了一年夜堆业界茶余饭后的话题。
年前，google的chrome团队离开公司做相干的交换，公司请求我做个后期会商计划。因而想了一下，内里提到了三点：
[*]chrome关于12px以上字体巨细撑持的成绩
[*]chrome的开辟者工具虽有整合，但不及Firebug一样的天真好用。
[*]关于网页的注释衬着是不是应该装备两种注释其内核。
后面的两点关于chrome自己加倍较为有针对性，而第三点；我想更多的是针关于我们新时期的扫瞄器编写程序员，和我们那些制定W3C尺度的外洋朋友。
回忆XHTML2.0与HTML5.0之间的和平工夫超过了快要4年的工夫(2002/8/5--2006/7/26)，而争斗的了局当下而见是XHTML2.0溃退而走。
这场和平我们在XHTML2.0下面起首值得一说的是他头脑傍边留上去给我们的深思：（如看过NicholasChase大家的《TheWebsfuture:XHTML2.0》可点击跳过前戏。）
1、将如b、i等地道关于体现性子的标签而接纳带有语义化取而代之。（布局、举动、体现三者分别）
<i>夸大</i>,<b>更夸大</b>和
<em>夸大</em>,<strong>更夸大</strong>2、将img等外容图片接纳src属性取而代之，并利用srctype举行范例界说。（使得内部资本未能加载时展现笔墨申明，排除alt的限定性）
<object>利用工具引进苹果的先容音频</object>
<spansrc="apple.png"srctype="image/png">这是一张苹果的图片</span>
这是一段苹果这类生果的申明笔墨。
</p>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><ahref="index.html">首页</a></li>
<li>
<h6><ahref="#">音乐库</a></h6>
<ul>
<li><ahref="cn.html">华语</a></li>
<li><ahref="jk.html">日韩</a></li>
<li><ahref="eu.html">西欧</a></li>
</ul>
</li>
<li><ahref="bbs.html">论坛</a></li>
</ul>和
<nl>
<label>导航菜单</label>
<lihref="index.html">首页</li>
<nl>
<label>音乐库</label>
<lihref="cn.html">华语</li>
<lihref="jk.html">日韩</li>
<lihref="eu.html">西欧</li>
</nl>
<lihref="bbs.html">论坛</li>
</nl>5、有上例傍边的“无处不在的链接”。（将过剩的不用要的标签往除）
固然，明眼人一看就可以看出来是来自NicholasChase大家的《TheWebsfuture:XHTML2.0》内里谈及的内容（针对最初一份，HTML5.0的草案有所更新）。他的文章内里有逐一的注释优点在于那里，我这里就不做逐一的注释了。
OK，大概这个后期展垫过于太长了；我们速率回回一下主题。诸如上述我们提到的XHTML2.0的几年夜长处都可以在新的HTML5.0的草案傍边找到一样的配同。不外，Twinsen一向以为XHTML是HTML与XML的交集（固然也能够看做业界常说的是一个过渡产物）；XHTML应该是一种之内容和信息架构为中心的类数据库框架（即XHTML可作为纯真体现，而其润色表面在于CSS；另外一方面又能够像XML一样作为数据被援用；）。随后在JeremyKeith的《MisunderstandingMarkup》、《标志言语之乱》（翻译）一文傍边我们能够看到了一个新的思绪。Jeremy用牛奶比方HTML4.0，而用奶酪比方XHTML1.0，再用豆奶比方XHTML2.0；这里Twinsen再放胆的将HTML5.0比方成酸奶。这里人人就能够设想，奶酪和酸奶是来自于牛奶提炼与乳酸菌发酵感化（XHTML1.0与HTML5.0来自于HTML4.0的提炼与发酵），而豆奶却有实质上的不同（XHTML2.0从成份而言与三者都毫有关系），固然这里分歧滋味的酸奶也是到场了味料（canvas）等新的元素；如许就能够很明晰的将几种言语尺度作一个从头的梳理。而Twinsen要夸大Jeremy的文章傍边也有提到的HTML与XHTML的区分：
[*]一切标签必需举行闭合（或自闭合）
[*]属性必需利用引号括起来
[*]严禁标签举行错位嵌套
[*]标签属性一致接纳小写
大概Jeremy走了一种对照坦率的手艺引诱体例；但大概他没有离开中国，意想到中国网站重构的汗青和开展。中国有一句古代俗话：“一其中国人是一条龙，一群中国人是一条虫。”而这句从中国最有宏愿的鲁迅师长教师入手下手，一向头脑传播至今。我们能够回忆拨号上彀的年月，Twinsen从当时走过去；看到的是一堆混同着CGI的HTML3.0，然后是混同着Table和ASP或PHP的HTML4.0。时期一向持续到了阿捷的呈现，网站重构一书配同谁人让有数中国互联网Boss都看过的PPT；这完全倾覆了过往的头脑，引诱了一个新的潮水。在他们的率领下，人们以经由过程尺度考证为荣；每个网站的下方都要呈现“ValidXHTML1.0Strict”。而这段标志的真正意义又是几人可以分明呢？好像佛洛伊德说的：“人们的恋母情结最初会演化成为一种偶像崇敬。”。也就同等于毛爷爷，另有前面的春哥的呈现，阿捷成了一代的偶像；但可悲的是阿捷急流勇退的走出了重构的天下。在这个时分良多新进的重构工程师到场，他们入手下手诘责；另有一部分老的重构工程师入手下手渺茫。中国入手下手传播了一个不要为了过尺度考证而做页面的说法，接着就入手下手故弄玄虚（标志庞杂还是用XHTML1.0严厉型的doctype）。从偶像崇敬，演化为跟风，到前面的故弄玄虚。这固然存在它的汗青偶然性和必然性。
此时我们也无妨援用Twinsen的第一偶像的一些话来看看我们本身：
援用内容
茅于轼谈中国房价
我们如今人人的群情就是房价高，这个也是现实，房价为何高？我以为有它是需求拉动，不是本钱推进；不是由于本钱高。甚么是需求拉动呢？就是良多人乐意买，你代价贵他也买，这就是需求拉高。人人晓得经济学外头，不问你买不买房，是问你嫌不嫌贵。社会学用问卷的举措，经济学用市场的举动的审核，你只管说贵你又掏钱买了，就申明你不嫌贵，你嫌贵就不买了。
人人能够算算，IE6多年夜，FF多年夜，CH多年夜，OP多年夜，SA多年夜……；全都清分明楚地，基本不必要质疑。我们每天的厌恶IE6，可是我们还在做IE6的兼容。那是否是能够申明你基本没有厌恶IE6。从手艺头脑，这是完全冲突的；由于这里没有微观调控，是需求拉动IE6的存活，而并不是本钱拉动IE6的存活。
援用内容
茅于轼谈谁妨害了我们致富？
——你跑步追上一辆大众汽车，但是刚要迈步上车时售票员把车门打开，按铃启动，拂袖而去；
——你写信时忘了写上对方的邮政编码，固然你晓得这个编码；
——你不晓得邮政编码，因此没有写，了局信被邮局退了返来；
——马路上有人打骂，人人立足张望，抱着无量的乐趣，必欲穷其以是才肯走；
——红灯抢行，十字路口乱作一团，相互挤得转动不得；
——差人把乱设摊位的小贩的货品掀翻在地，乃至把小贩的三轮板车扔上卡车拉走；
——闭会工夫或人未到，人人等上十几分钟。
……
这些征象是我们天天能见到的，已习以为常，谁也没有想到它们之间有甚么干系。可是从经济学家的目光看来，这些征象是倒霉于中国开展的主要缘故原由。
从经济学的基础概念来剖析，穷是由于很多临盆潜力不克不及发扬，由于人们的休息没有效在临盆上，乃至用在了抵消他人休息功效的勉力上；更由于形形色色的华侈广泛存在，耗失落了社会伟大财产，但是每一个人对此又力所不及。
另有别的的总结性的很典范的一段。
援用内容
茅于轼谈谁妨害了我们致富？
它其实不属于功令统领的局限，人们如许做其实不犯罪，乃至也谈不上是品德成绩，但是大批这类事务的终极了局是倒霉于社会开展的。这类事变的原因，义务在于我们每一个老公民，不管你是一位售货员、司机、教员、德律风接线员、当局做事员，改动一下你做事的准绳都大概使社会的财产有所增添，当每一个人都如许想时，国度就富起来了，你所付出的一样的休息就会失掉更高的待遇。
你们如许的做WEB，其实不会堕落，乃至谈不上读取不了，可是大批这类事务的终极了局是扫瞄器就要为了你的标签没有封口，属性没有写双引号；而往编写加倍包袱的代码，泯灭更大批的CPU运算。综上三段援用所述，人人是不是分明你所每天厌恶的IE6为何会这么年夜？为何会至今还存在？都是我们——这些网站重构职员一手一脚酿成的！！
回过火来看，文章的题目叫《走有中国特征的网站重构路途》。RMB贬值，中国的综合国力提拔，全球都在往中国挨近。而HTML5.0的出生，他又回回到了HTML4.0击败HTML3.0的年月，一个新手艺出生的年月，一个宣传自在使用的年月；在中国有数刚出道的“页面仔”又会在如许的年月息事宁人（200块钱建站、间接fireworks切图天生页面……）；而此时，我们一向崇敬的FF、CH、OP、SA……是不是又要像IE6一样走回老门路呢？然后我们是不是也是要一样的入手下手厌恶和仇恨他们呢？而此历程我们作为一个综合国力的强国事否在这个时分应该不再是“一条虫”？
固然Twinsen不是单单的提出质疑和批评，更不是要否决HTML5.0；我们能够想一个较为符合常理的办理计划：
[*]本身利用XHTML的请求（后面说的4点）来编写HTML5.0。
[*]保举扫瞄器利用双剖析内核，一个给尺度页面的，一个给非尺度的。（当非尺度的页面利用尺度的doctype时，剖析给他错位大概间接封闭或不剖析；同时这个也是我给chrome团队的倡议。）
[*]教训你身旁每个人，保持尺度的目标和主要性。
[*]时候铭刻你不是一个“页面仔”，是一个重构工程师；大概更进一层，你在影响人类信息化社会的开展。
也给人人带来一个疑问，没有经由“ISO9002”考证的产物你敢用么？那末没有经由“W3C”考证的网页呢？那考证又是为了甚么呢？（感激一向以来教训我ISO9000系统主要性的卿姐）大概我们再假想一下你出差的时分，旅店的网线接口不是RJ45，然后你插不出来上不了网（每一个扫瞄器都有对CSS3的公有属性）；再大概旅店的网线接口是一排，分离对应RJ42、RJ43、RJ44、RJ45、RJ46……从门口一向布线到窗台（扫瞄器为了兼容多种混乱页面带来的代码痴肥）。
最后，我援用Jeremy文章的一些话：“只需你乐意，HTML5.0即刻能够酿成XHTML5.0”；“XHTML2.0翘辫子了，XHTML和HTML5才是霸道。”。
</p>
所有的设计第一步就是构思，构思好了。 俗话说：兴趣是最好的老师。做每一件事都离不开兴趣的驱动。兴趣是自学技术需要迈出的第一步。在学习的过程中，我们难免会遇到各种各样的问题。 Dreamweaver是唯一提供Roundtrip HTML、视觉化编辑与原始码编辑同步的设计工具。它包含HomeSite和BBEdit等主流文字编辑器。 只要我们努力，无论是怎样的艰难险阻，成功依然会迎面直击。在刚开始时我觉得dreamweaver mx XX很难理解。 技术的学习如同长跑。只要越过极限，就会越跑越轻松。技术的学习其实并不像想象中那么可怕，任何技术都并不高深莫测。 由CS4 版本开始，则转用WebKit 排版引擎（亦即Google Chrome和Apple Safari浏览器所用的排版引擎）作为网页预览。 运动)时间轴面板--拖动关键帧--单击整条--将鼠标移至中间一点--右击选择增加关键帧--移动中间关键帧的图层--勾选自动播放,循环 所见则所得网页编辑器的优点就是直观性，使用方便，容易上手. Adobe Dreamweaver(前称Macromedia Dreamweaver)是Adobe公司的著名网站开发工具。
页:
[1]