《XHTML和CSS开发规范与命名参考》由会员分享，可在线阅读，更多相关《XHTML和CSS开发规范与命名参考（15页珍藏版）》请在金锄头文库上搜索。
1、XHTML和CSS开发规范与命名参考河南大学计算机与信息工程学院2010年7月9日星期五杜晓孔目录1Web标准31.1Web标准是什么？31.2采用web标准的好处32页面的基本构成和开发标准52.1选择合适的DOCTYPE 现阶段统一使用XHTML1.0 Transitional标准62.2定义名字空间 标准必须引用62.3定义语言编码 默认使用utf-8编码62.4下面的语句是针对老版本浏览器写的，以保证各种浏览器都能正确解释页面。62.5设置页面标题，必须设置，不准留空。必须根据页面内容进行设置，不准随便设置。62.6调用样式表，除简单的独立页面之外全部采用外部调用的方式加载样式表62.
2、7HEAD区域其它相关设置62.8CSS统一放在里，不允许放在里72.9内的模块都要加注释 标准注释格式如下：72.10各个模块合理嵌套和缩进 缩进一律用Tab，禁止用空格72.11页面中的图片，必须填写 alt属性，不允许为空。72.12尽可能少的使用target=”_blank”,不要总是让用户在新标签页中打开网页72.13每页有尽可能少的HTTP请求。72.14尽可能的使用css sprite技术，减少页面中图片请求数量82.15同一个页面中尽量避免重复包含CSS文件或JS文件。82.16绝对不允许引用其他网站的css和Javascript等文件。83(X)HTML书写规范83.1基本书
3、写规范83.2相关标签的语义83.3模块效果与标签写法94CSS编码规范104.1基本书写规范104.2CSS命名参考115其它规范146页面质量评估标准141 Web标准1.1 Web标准是什么？“WEB 标准”是一系列标准的总称，包括HTML4.0、XHTML1.1、CSS2.1、XML1.0、RSS2.0、ECMAScript1.1、DOM1.0 等等。一般的误区经常把WEB 标准说成DIV+CSS。准确的说法应该是：采用W3C 推荐的WEB 标准中的XHTML1.1 结合CSS2.0 样式表制作页面的方法，DIV 应该指的是XHTML 标签，而CSS 指的是样式表了。1.2 采用web
4、标准的好处1. 节约运营成本采用 WEB 标准制作，我们可以做到表现和形式及内容的分离，我们采用XHTML 语言来表现(数据)，用CSS 来控制(页面元素呈现的)形式。写的好的页面，XHTML 代码中基本上都是用户要看的数据，而其他修饰性的东西，全部由CSS 来控制。这样一来(XHTML)页面的体积就大大减小了，这样带宽上的费用就会大家降低了2. 用户友好性第一类：普通用户(每个访问我们网站的人)；第二类：搜索引擎；第三类：更多的设备（手机、PDA、媒体机等）采用 WEB 标准开发的页面，结构清晰，页面体积小，浏览器兼容性好。普通用户访问的时候，页面打开速度快，而且不管用户使用那种浏览器，都能
5、够正常访问(显示)页面，且页面的结构清晰，要找的数据可以很方便的浏览到。而对搜索引擎来说，一个好的采用WEB 标准开发的页面，都是做过SEO 优化的，访问起来很友好，很容易理解页面中哪里是标题(H1H6 标签)，哪里是段落(p 标签)，哪里是段落里要强调的内容(strong 标签) 等，它可以很容易的分析出来。而一个SEO 好的站点，被搜索引擎收录的机会更多，这个也意味着会被更多的普通用户访问到，搜索引擎会带来更多的用户。随着智能手机的大量普通及 Wifi 配置渐渐成为主流，手机上网需求变得越来越迫切，以使我们也不得不考虑到页面在手机上的显示，对于当前标准化形式下，基于标准，将是可行之道！3.
6、 内容跨平台的可用性通过将内容与设计进行分离的方法，可以使信息以较低的成本实现跨平台的转换。4. 加快页面解析速度通过实际测试证明，采用内容与设计分离的结构进行页面设计，可使浏览器对网页的解析速度大幅提高，相对于老式的内容与设计混编的方法，浏览器在解析中可以更好的解析结构、内容和设计。5. 更良好的用户体验采用表现与内容分离技术使我们在建设网站时，能够充分的对网站的内容、设计统一性、可用性进行思考与设计，从而提高网站的可用性，改善用户体验及印象。同时更加适用于在web 2.0 浪潮中不断变化的互联网形态。2 页面的基本构成和开发标准标题/*070817 M. 修改* start*/.(内部CS
7、S内容)./*070817 M. 修改* end*/.(header内容).( content内容).( footer内容).2.1 选择合适的DOCTYPE 现阶段统一使用XHTML1.0 Transitional标准2.2 定义名字空间 标准必须引用2.3 定义语言编码 默认使用utf-8编码2.4 下面的语句是针对老版本浏览器写的，以保证各种浏览器都能正确解释页面。2.5 设置页面标题，必须设置，不准留空。必须根据页面内容进行设置，不准随便设置。首页页面标题标准命名原则： 各级首页：开心网 - 宣传语子频首页：开心网 - 子频道名 - 宣传语内容页：内容标题 - 子频道标题 - 开心网专
8、题页：专题标题 开心网2.6 调用样式表，除简单的独立页面之外全部采用外部调用的方式加载样式表页面内部嵌入法：就是将样式表直接写在页面代码的head区。类似这样： 外部调用法：将样式表写在一个独立的.css文件中，然后在页面head区用以下代码调用。 2.7 HEAD区域其它相关设置收藏夹图标：允许搜索机器人搜索站内所有链接 设置站点版权信息站点关键词 必须添加站点的简要描述 必须添加作者信息开始：结束：修改记录注释：.(内容).作者及最后更新日期注释：其中*代表具体内容，20100708代表日期，wuhui代表作者信息2.8 CSS统一放在里，不允许放在里2.9 内的模块都要加注释 标准注释格式如下：2.10 各个模块合理嵌套和缩进 缩进一律用Tab，禁止用空格 2.11 页面中的图片，必须填写 alt属性，不允许为空。对于页面装饰性质的图片，如虚线、分隔小图等，要定义在CSS中，制作过程中，如不知道al
