您的位置: 首页 N搜咨询 文章阅读 怎么改善现有网站
打印本页 放大字体 关闭本页
怎么改善现有网站

作者: 编辑:N搜网 录入:N搜网 来源:
录入时间:2006-8-23 更新时间:2006-8-25 点击次数:564
主标题:怎么改善现有网站
副标题:怎么改善现有网站
短标题:怎么改善现有网站
 

怎么改善现有网站
    我们大部分的设计师依旧在采用传统的表格布局、表现与结构混杂在一起的方式来建立网站。学习使用XHTML+CSS的方法需要一个过程,使现有网站符合网站标准也不可能一步到位。最好的方法是循序渐进,分阶段来逐步达到完全符合网站标准的目标。如果你是新手,或者对代码不是很熟悉,也可以采用遵循标准的编辑工具,例如Dreamweaver MX 2004,它是目前支持CSS标准最完善的工具。1.初级改善§ 为页面添加正确的DOCTYPE 很多设计师和开发者都不知道什么是DOCTYPE,DOCTYPE有什么用。DOCTYPE是document type的简写。主要用来说明你用的XHTML或者HTML是什么版本。浏览器根据你DOCTYPE定义的DTD(文档类型定义)来解释页面代码。所以,如果你不注意设置了错误的DOCTYPE,结果会让你大吃一惊。XHTML1.0提供了三种DOCTYPE可选择:(1)过渡型(Transitional )(2’>http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">(2)严格型(Strict )(3’>http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">(3)框架型(Frameset )http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">对于我们初级改善来说,只要选用过渡型的声明就可以了。它依然可以兼容你的表格布局、表现标识等,不至于让你觉得变化太大,难以掌握。Tip:你懒得输入上面过渡型代码的话,可以访问http://www.macromedia.com/网站的首页,然后查看源代码,把head区同样的代码拷贝粘贴就可以了。§ 设定一个名字空间(Namespace) 直接在DOCTYPE声明后面添加如下代码:http://www.w3.org/1999/xhtml" >一个namespace是收集元素类型和属性名字的一个详细的DTD,namespace声明允许你通过一个在线地址指向来识别你的namespace。只要照样输入代码就可以。§ 声明你的编码语言 为了被浏览器正确解释和通过标识校验,所有的XHTML文档都必须声明它们所使用的编码语言。代码如下:这里声明的编码语言是简体中文GB2312,你如果需要制作繁体内容,可以定义为BIG5。§ 用小写字母书写所有的标签 XML对大小写是敏感的,所以,XHTML也是大小写有区别的。所有的XHTML元素和属性的名字都必须使用小写。否则你的文档将被W3C校验认为是无效的。例如下面的代码是不正确的:正确的写法是:同样的, 

改成 

,改成等等。这步转换很简单。 § 为图片添加 alt 属性 为所有图片添加alt属性。alt属性指定了当图片不能显示的时候就显示供替换文本,这样做对正常用户可有可无,但对纯文本浏览器和使用屏幕阅读机的用户来说是至关重要的。只有添加了alt属性,代码才会被W3C正确性校验通过。注意的是我们要添加有意义的alt属性,象下面这样的写法毫无意义:正确的写法:§ 给所有属性值加引号 在HTML中,你可以不需要给属性值加引号,但是在XHTML中,它们必须被加引号。例:height="100",而不能是height=100。§ 关闭所有的标签 在XHTML中,每一个打开的标签都必须关闭。就象这样: 

每一个打开的标签都必须关闭。

HTML可以接受不关闭的标,XHTML就不可以。这个规则可以避免HTML的混乱和麻烦。举例来说:如果你不关闭图像标签,在一些浏览器中就可能出现CSS显示问题。用这种方法能确保页面和你设计的一样显示。需要说明的是:空标签也要关闭,在标签尾部使用一个正斜杠"/"来关闭它们自己。例如:
经过上述七个规则处理后,页面就基本符合XHTML1.0的要求。但我们还需要校验一下是否真的符合标准了。我们可以利用W3C提供免费校验服务(http://validator.w3.org/)。发现错误后逐个修改。在后面的资源列表中我们也提供了其他校验服务和对校验进行指导的网址,可以作为W3C校验的补充。当最后通过了XHTML验证,恭喜你已经向网站标准迈出了一大步。不是想象中的那么难吧!2.中级改善接下来我们的改善主要在结构和表现相分离上,这一步不象第一步那么容易实现,我们需要观念上的转变,以及对CSS2技术的学习和运用。但学习任何新知识都需要花点时间的,不是吗?诀窍在于边做边学。假如你一直采用表格布局,根本没用过 CSS,也不必急于跟表格布局说再见,你可以先用样式表代替 font 标签。随着你学到的越多,你能做的就越多。好,一起来看看我们需要做哪些事:§ 用CSS定义元素外观 我们在写标识时已经养成习惯,当希望字体大点就用 
,希望在前面加个点符号就用 
。我们总是想 
的意思是大的, 
的意思是圆点,的意思是“加粗文本”。而实际上, 
能变成你想要的任何样子,通过CSS, 
能变成小的字体, 
文本能够变成巨大的、粗体的,

能够变成一张图片等等。我们不能强迫用结构元素实现表现效果,我们应该使用CSS来确定那些元素的外观。例如,我们可以使原来默认的6级标题可以看起来大小一样:h1, h2, h3, h4, h5, h6{ font-family: 宋体, serif; font-size: 12px; }§ 用结构化元素代替无意义的垃圾 许多人可能从来都不知道HTML和XHTML元素设计本意是用来表达结构的。我们很多人已经习惯用元素来控制表现,而不是结构。例如,一段列表内容可能会使用下面这样的标识:句子一
句子二
句子三
如果我们采用一个无序列表代替会更好: 
句子一 
句子二 
句子三 
你或许会说“但是 
显示的是一个圆点,我不想用圆点”。事实上,CSS没有设定元素看起来是什么样子,你完全可以用CSS关掉圆点。§ 给每个表格和表单加上id 给表格或表单赋予一个唯一的、结构的标记,例如 接下来,在书写样式表的时候,你就可以创建一个“menu”的选择器,并且关联一个CSS规则,用来告诉表格单元、文本标签和所有其他元素怎么去显示。这样,不需要对每个  标签附带一些多余的、占用带宽的表现层的高、宽、对齐和背景颜色等等属性。只需要一个附着的标记(标记“menu”的id标记),你就可以在一个分离的样式表内为干净的、紧凑的代码标记进行特别的表现层处理。中级改善我们这里先列主要的三点,但其中包含的内容和知识点非常多,需要我们逐步学习和掌握,直到最后实现完全采用CSS而不才用任何表格实现布局。  

N搜网-中国网上商店商品服务搜索门户]:[本文章由N搜网于2006-8-23录入系统,网址:www.nsall.com

打印本页 放大字体 关闭本页
 
 
相关主题文章
网站设计必须知道的65条原则 网站web2.0时代的门户网站
站长常用广告代码的表达大全(3) 站长常用广告代码的表达大全(2)
站长常用广告代码的表达大全(1) 怎么改变超级连接的颜色和去掉其下划线
怎么改善现有网站 [组图] 怎么给网页添加网页特效
怎么解决网页页中出现乱码问题 著名网页设计师Marc Klein访谈
著名网页设计师Marc Klein访谈 JPEG2000制作软件集锦
AutoCAD输出图像文件技巧 CorelDraw 技海拾贝
CorelDraw 技海拾贝 freehand基础教程
ATUOCAD中实体的选择方式 Web设计理念
Web设计理念 Web 上图形设计的最佳实践
标准网页广告规格 搭配的艺术--谈主页用色
创建一个Flash站点的注意事项 构图要讲规律1
关于色彩的构成和辅助1 创建一个Flash站点的注意事项
搭配的艺术--谈主页用色 下面概要介绍各页面布局的网页设计技巧
学习一点有关主页制作中色彩搭配的知识 判断Cookies是否处于开启状态
判断MS SQL Server是否启动 判断shift,ctrl,alt键是否按下
判断鼠标双击 判断文件是否正在使用
判断一个被Shell的程序进程是否结束 全面了解Google网页目录
深度了解RSS历史及发展历程 什么是ASP?ASP有什么特点?
学习一点有关主页制作中色彩搭配的知识 什么是CPA、CPC、CPM、CPO、PPC、PPL、CPTM?
什么是JAVA? 什么是JSP?JSP有哪些优点?
制作网站的基本原则 你也可以YAI--VB5中Winsock控件的使用
制作主页的五十个秘诀 判断Cookies是否处于开启状态
重构、标准、布局 重构、标准、布局
电子商务站点设计技巧 网站改版十个理由九个错!
网站结构与美女身材的相似性? 网站设计成功要素
营销商如何制定网站改版解决方案 中搜网络猪近期将推出新版
企业网站不能成为摆设 如何匹配特定的节点
如何设计一个成功的网站 软件界面设计要素
完整VI项目设计书 网络世界“惊天大创意”
利用网站拓展出口三策略 设计网站要绞尽脑汁
走出误区!对网站建设的反思 商业网站竞争优势研究
电子商务站点设计技巧 网站设计:从形式到内容,再到服务
网站建设之互动栏目的重要性 闲谈中国网站的名字
网站页面信息和表现原则 网站的各个栏目策划
版面设计的介绍 网页版面的布局
用户可以在浏览器中将已经制作好的 Scaal 主页打… 网页版面设计
网站LOGO设计规范的思考 营销商如何制定新一年的网站改版计划
网站CI形象设计 网站规划的流程
网页设计注意事项 一份好的商业计划书提纲
网站的各个栏目策划 企业如何准备建网资料?
商业网站的制作规范 商业网站规划设计
网页设计的注意事项 会计类个人网站的现状和思考
中国个人网站的现状 WEB站点设计中基于价值的方法
制作网站使用的相关软件 使用DIV之后,什么时候使用TABLE?
WEB站点设计中基于价值的方法 成功网站背后的故事
对个人主页制作者的一些建议 会计类个人网站的现状和思考
建个人网站有哪些方式 ? Web网站的设计、管理与维护
Efly.Wang对中国网站设计的感想 高手进阶:网页设计中的文字运用
个人网站制作及博客建站技巧 搜索引擎营销的目标层次及网站优化设计
 
 
 
本站关键字:网上商店商品服务大全 网上购物导航 在线购物搜索引擎 网店比较购物 网络商城 特色网上超市商店 网上网络开店购物