分享
 
 
 

Web标准?你需要吗?

王朝other·作者佚名  2006-01-09
窄屏简体版  字體: |||超大  

这篇文章纯粹是由CSDN的这个讨论而发起的:

http://community.csdn.net/Expert/TopicView.asp?id=3265752

在此帖中,我竭力游说大家放弃表格布局,而采用XHTML+CSS的方法。可是有很多人不理解,因为表格布局相当简单,前期开发相当快捷,大家乐此不疲。

为了让大家更加体会到Web标准开发的好处,我特意将我的一个私活用XHTML+CSS来布局,而与此比较的是我在本科期间开发过的另一个站点。

各位在观看实例时候请一定注意仔细观察每一个细节,并且实际的打开源码看看,到底是哪个更复杂?

利用表格排版的站点页面(这都该马上被淘汰,不包庇自己):

http://www.swjtu.net/index.htm

http://www.swjtu.net/tw/index.asp

利用XHTML+CSS排版的页面:

http://www.ceocio.net/test/index.html

http://www.ceocio.net/test/main.html

这两个实例都包含一个欢迎页和一个内页。

如果你的网速比较慢,你可以发现两个内页下载时候明显的差别,利用表格排版的页面需要等待表格中所有内容加载完成后才显示,而利用XHTML+CSS排版的页面则一边下载一边显示出来。

而从代码的复杂度,由于利用XHTML+CSS,将所有的页面布局全部集中到CSS文件中,所以html页面的代码非常简洁。

在CSDN的讨论中,很多人都说:“利用XHTML+CSS只能做简单的页面,稍微复杂美观的页面还是得靠表格布局”,实际不然,可以参看我的第二个内页,用表格能实现的几乎都实现了。

总结:

使用XHTML、CSS的好处:

后期维护方便,几乎只需要更改站点的CSS文件就可以对站点进行改版。

如果你要创建一个打印页面,只需要不连接到CSS或者使用其他CSS文件。同样,这样的文档可以被各种需求的人所阅读到。

节约站点所占空间和站点流量。

在ASP.Net基于模板的开发中。最好的例子就是.TEXT系统。

....

实际上XHTML、CSS布局是相当简单的,但是也有一些需要改变的地方:

使用div而不使用表格布局,当然如果你有一个数据列表之类的东东,必须得画个表格框起来,那是例外,除此之外千万不要使用table标签。

使用li标签格式化数据,可以参看:http://www.ceocio.net/test/main.html中的新闻列表,就是用li实现,其中的图片和下面的线条都通过CSS内置属性植入了li中。

把所有的公共图片都利用CSS中标签的背景属性写入CSS文件,而不在html页面中出现,这样的话,可以大大方便日后改版。比如:http://www.ceocio.net/test/main.html的html页面中除了第一条新闻后面根的一个new图标,其他所有图片都定义在CSS中,并没有在html中出现。

....

可能有人会觉得这样做是不是很麻烦?开发周期很长?

答案是否,我仅仅用了两个多小时就完成了从切图(当然,图片是预先设计好的啦)到html页面设计,css设计的全部工作。而且这仅仅是两个页面,如果是一个实际的项目,当我的主体css文件写好后,我后面的工作简直就是....爽!相比之下,如果还是用传统的表格布局,那么重复工作简直太多,累!

关于这个页面的标准性可以点击:http://validator.w3.org/check?uri=http://www.ceocio.net/test/main.html (XHTML)和http://jigsaw.w3.org/css-validator/validator?uri=http://www.ceocio.net/test/main.html (CSS2.0)查看,你也可对自己站点进行测试,看看是否符合标准。

为了体验XHTML、CSS,你可下载这两个文件进行参考:

http://www.ceocio.net/test/main.html

http://www.ceocio.net/test/main.css

 
 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
2023年上半年GDP全球前十五强
 百态   2023-10-24
美众议院议长启动对拜登的弹劾调查
 百态   2023-09-13
上海、济南、武汉等多地出现不明坠落物
 探索   2023-09-06
印度或要将国名改为“巴拉特”
 百态   2023-09-06
男子为女友送行,买票不登机被捕
 百态   2023-08-20
手机地震预警功能怎么开?
 干货   2023-08-06
女子4年卖2套房花700多万做美容:不但没变美脸,面部还出现变形
 百态   2023-08-04
住户一楼被水淹 还冲来8头猪
 百态   2023-07-31
女子体内爬出大量瓜子状活虫
 百态   2023-07-25
地球连续35年收到神秘规律性信号,网友:不要回答!
 探索   2023-07-21
全球镓价格本周大涨27%
 探索   2023-07-09
钱都流向了那些不缺钱的人,苦都留给了能吃苦的人
 探索   2023-07-02
倩女手游刀客魅者强控制(强混乱强眩晕强睡眠)和对应控制抗性的关系
 百态   2020-08-20
美国5月9日最新疫情:美国确诊人数突破131万
 百态   2020-05-09
荷兰政府宣布将集体辞职
 干货   2020-04-30
倩女幽魂手游师徒任务情义春秋猜成语答案逍遥观:鹏程万里
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案神机营:射石饮羽
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案昆仑山:拔刀相助
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案天工阁:鬼斧神工
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案丝路古道:单枪匹马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:与虎谋皮
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:李代桃僵
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:指鹿为马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:小鸟依人
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:千金买邻
 干货   2019-11-12
 
推荐阅读
 
 
 
>>返回首頁<<
 
靜靜地坐在廢墟上,四周的荒凉一望無際,忽然覺得,淒涼也很美
© 2005- 王朝網路 版權所有