web标准及浏览器兼容性解决方案

《web标准及浏览器兼容性解决方案》由会员分享，可在线阅读，更多相关《web标准及浏览器兼容性解决方案（5页珍藏版）》请在金锄头文库上搜索。

1、Web 标准及浏览器兼容性解决方案一：优秀的网页设计师经常有人会问做为一个优秀网页设计师要具备哪些方面的知识以及技能？ 1.掌握一款良好的图形图形处理软件（例如：Photoshop，Fireworks ，AI.） 2.掌握可视化编辑工具或者编辑器（例如：TopStyle ，Dreamweaver ，EditPlus.） 3.掌握最基本的实质性知识，也就是网页的三层结构 Xhtml,CSS,Javascript(结构，表现，行为) 4.掌握网站据有分析策划的能力 5.掌握具有美术的一些基础配色知识最起码不要让网页的颜色太难看 6.掌握一款网络动画软件（例如 Flash） 如果你可以达到以上的要求

2、，可以说的上你算一个网页设计师，不要认为一个网页设计师只会用 PS 做出一张图片然后用 PS 直接分割另存为 html 页面的就是网页设计师，一个会用 Dreamweaver 可视化软件做出一个垃圾网站（传统的 table+gif 技术实现的网站）的就叫网页设计师。二：浏览器内核浏览器内核 通常所谓的浏览器内核也就是浏览器所采用的渲染引擎，渲染引擎决定了浏览器如何显示网页的内容以及页面的格式信息。不同的浏览器内核对网页编写语法的解释也有不同，因此同一网页在不同的内核的浏览器里的渲染（显示）效果也可能不同，这也是网页编写者需要在不同内核的浏览器中测试网页显示效果的原因。 主流浏览器内核 Trid

3、ent：IE 浏览器使用的内核,该内核程序在 1997 年的 IE4 中首次被采用，是微软在 Mosaic 代码的基础之上修改而来的，并沿用到目前的 IE7。Trident 实际上是一款开放的内核，其接口内核设计的相当成熟，因此才有许多采用 IE 内核而非 IE 的浏览器涌现（如 Maxthon、TheWorld 、TT、GreenBrowser、AvantBrowser 等） 。 Geckos： Netcape6 开始采用的内核，后来的 Mozilla FireFox 也采用了该内核，Geckos 的特点是代码完全公开，因此，其可开发程度很高，全世界的程序员都可以为其编写代码，增加功能。 P

4、resto： 目前 Opera 采用的内核，该内核在 2003 年的 Opera7 中首次被使用，该款引擎的特点就是渲染速度的优化达到了极致，也是目前公认网页浏览速度最快的浏览器内核，然而代价是牺牲了网页的兼容性。 Webkit：Safari 浏览器使用的内核。Webkit 引擎包含 WebCore 排版引擎及 JavaScriptCore 解析引擎，均是从 KDE 的 KHTML及 KJS 引擎衍生而来，它们都是自由软件，在 GPL 条约下授权，同时支持 BSD 系统的开发。所以 Webkit 也是自由软件，同时开放源代码。在安全方面不受 IE、Firefox 的制约，所以 Safari 浏

5、览器还是比较安全的浏览器。(Google 的 Chrome 浏览器也是采用Webkit) 注意，牺牲了网页的兼容性是说牺牲不好的网页兼容，因为 Opera 浏览器以开始就对标准支持的非常良好，所以对写法要求比较严格，那些不符合标准的网站在 Opera 下自然也就不能运行。三：Web 标准WEB 标准不是某一个标准，而是一系列标准的集合。网页主要由三部分组成：结构（Structure ） 、表现（Presentation）和行为（Behavior） 。对应的标准也分三方面。1结构标准语言（1）XML XML 是 The Extensible Markup Language(可扩展标识语言) 的简

6、写。目前推荐遵循的是 W3C 于 2000 年 10 月 6 日发布的XML1.0，参考（ www.w3.org/TR/2000/REC-XML-20001006） 。和 HTML 一样，XML 同样来源于 SGML，但 XML 是一种能定义其他语言的语。XML 最初设计的目的是弥补 HTML 的不足，以强大的扩展性满足网络信息发布的需要，后来逐渐用于网络数据的转换和描述。（2）XHTML XHTML 是 The Extensible HyperText Markup Language 可扩展标识语言的缩写。目前推荐遵循的是 W3C 于 2000 年 1 月26 日推荐 XML1.0（参考 h

7、ttp:/www.w3.org/TR/xhtml1） 。XML 虽然数据转换能力强大，完全可以替代 HTML，但面对成千上万已有的站点，直接采用 XML 还为时过早。因此，我们在 HTML4.0 的基础上，用 XML 的规则对其进行扩展，得到了 XHTML。简单的说，建立 XHTML 的目的就是实现 HTML 向 XML 的过渡。2. 表现标准语言CSS 是 Cascading Style Sheets 层叠样式表的缩写。目前推荐遵循的是 W3C 于 1998 年 5 月 12 日推荐 CSS2（参考http:/www.w3.org/TR/CSS2/） 。W3C 创建 CSS 标准的目的是以

8、CSS 取代 HTML 表格式布局、帧和其他表现的语言。纯 CSS 布局与结构式 XHTML 相结合能帮助设计师分离外观与结构，使站点的访问及维护更加容易。3.行为标准（1）DOMDOM 是 Document Object Model 文档对象模型的缩写。根据 W3C DOM 规范（http:/www.w3.org/DOM/） ，DOM 是一种与浏览器，平台，语言的接口，使得你可以访问页面其他的标准组件。简单理解，DOM 解决了 Netscaped 的 Javascript 和Microsoft 的 Jscript 之间的冲突，给予 web 设计师和开发者一个标准的方法，让他们来访问他们站点中

9、的数据、脚本和表现层对像。(2) ECMAScriptECMAScript 是 ECMA(European Computer Manufacturers Association)制定的标准脚本语言（JAVAScript ） 。目前推荐遵循的是 ECMAScript 262四：采用 Web 标准的好处对于访问者： 文件下载与页面显示速度更快。 内容能被更多的用户所访问（包括失明、视弱、色盲等残障人士） 。 内容能被更广泛的设备所访问（包括屏幕阅读机、手持设备、搜索机器人、打印机、电冰箱等等） 。 用户能够通过样式选择定制自己的表现界面。 所有页面都能提供适于打印的版本。对于网站所有者： 更少的代

10、码和组件，容易维护。 带宽要求降低（代码更简洁） ，成本降低。举个例子：当 ESPN.com 使用 CSS 改版后，每天节约超过两兆字节（terabytes）的带宽。 更容易被搜寻引擎搜索到。 改版方便，不需要变动页面内容。 提供打印版本而不需要复制内容。 提高网站易用性。在美国，有严格的法律条款（Section 508）来约束政府网站必须达到一定的易用性，其他国家也有类似的要求。五：如何学 DIV+CSS 技术有好多人也看了，但是没有什么进步，我分析主要有以下几个原因：原因一：压力不够，因为有不少人比如美工学 CSS，因为是看别人学，所以学之，不学就没优势！这样的压力是很小的。原因二：只是业

11、余学习，这样学还只是玩一玩，因为你不一定非要以这门技术吃饭。原因三：方法不对，有的人只是在看教程，但他不动手去做，看的太多，做的太少，所以有了实践你才能把理论的东西揉进去。六：掌握 CSS 的四个学习阶段有一次我问一个网友，学 CSS 难吗？她说：“不难”我说你学多久了？她说：“刚学” 。其实她说的也没错！如果有人问我学 CSS 难吗？我会说：“难！”为什么我会说难呢？ 学 CSS 可以分成以下几个阶段： 阶段一：不去想浏览器的兼容性问题的情况下能做出页面，但页面里到处用 TABLE 的 模式 DIV 写出的页面。 阶段二：想到了兼容性问题，但无法提前预防，只会修补问题，大量使用 HACK 技

12、术（我对 HACK 技术只是知道，但用的很少） 阶段三：可提前预防 BUG，但样式表中大量应用了 ID,CLASS，CSS 译过来是重叠样式表，比如“DIV P SPAN”。这句代码是标明DIV 子元素中 P 的子元素 SPAN，这样写就可以定义 SPAN 的样式了，不用在 SPAN 中加入 CLASS 了。这也就是 CSS 的优点所在，为什么不好好利用而一定要定义一个 CLASS 呢！ 阶段四：这一阶段是最难的，良好的 HTML 语义结构、合理的 CSS、可重复利用的样式。良好的语义有这方面的文章,合理的 CSS，这两方面以后一定会写专题来研究。七：用什么软件编辑 CSS 代码这个问题好象是

13、问过频率最高的！先说我自己吧，刚开始是用 DreamWeaver 写代码，由于 DreamWeaver 软件本身是一个很耗CPU 和内存的软件，运行时编辑的速度就可想而知了。走了好长一段时间之后我才过度到了“半手写”状态， “半手写”就是利用DW 提供的代码提示功能，当你写“F” 时有关“F”的样式就会立刻在后面提示出来，方便你选取。如果再写上几个字母，你要的那个样式就很快找到了，这样可以加快你的写样式的速度，但有一个坏处就是如果你脱离了代提示的编辑软件你就不会写样式了，比如你在程序员那里修改微调样式时，他用的可不一定是你用的那个软件，不一定有代码提示功能，所以你只能回到自己的机器上编辑好了然

14、后发给程序员！这样做显然是不专业的！所以如果想成为优秀的人就要做到够专业！ 八：结构和表现分离一定要做到从思想上分离，书写代码的时候九：web 标准有关 XHTML 代码规范1.所有的标记都必须要有一个相应的结束标记 :以前在 HTML 中，你可以打开许多标签，例如和而不一定写对应的和来关闭它们。但在 XHTML 中这是不合法的。XHTML 要求有严谨的结构，所有标签必须关闭。如果是单独不成对的标签，在标签最后加一个/来关闭它。例如:2.所有标签的元素和属性的名字都必须使用小写 :与 HTML 不一样，XHTML 对大小写是敏感的，和是不同的标签。XHTML 要求所有的标签和属性的名字都必须使

15、用小写。例如：必须写成 。大小写夹杂也是不被认可的，通常 dreamweaver自动生成的属性名字onMouseOver 也必须修改成onmouseover 。3.所有的 XML 标记都必须合理嵌套 :同样因为 XHTML 要求有严谨的结构，因此所有的嵌套都必须按顺序，以前我们这样写的代码：/b 必须修改为：就是说，一层一层的嵌套必须是严格对称。4.所有的属性必须用引号括起来: 在 HTML 中，你可以不需要给属性值加引号，但是在 XHTML 中，它们必须被加引号。例如:必须修改为：特殊情况，你需要在属性值里使用双引号，你可以用，单引号可以使用，例如：5.把所有） ，不是标签的一部分，都必须被

16、编码为任何与号（注：以上字符之间无空格。6.给所有属性赋一个值 :XHTML 规定所有属性都必须有一个值，没有值的就重复本身。例如：必须修改为：7.不要在注释内容中使“-” :“-” 只能发生在 XHTML 注释的开头和结束，也就是说，在内容中它们不再有效。例如下面的代码是无效的:8.elseXHTML 1.0 文件类别宣告的正确写法 (不可小写)过度标准（Transitional）框架标准（Frameset ）严格标准（Strict） 包含以上须注意的问题,还有其他更严格的标准头文件问题所有的网页头文件都一律都改为标准形式，写法如下：.不允许使用 target=_blank同一个 id 选择器不可重复使用JavaScript 写法Javascript 我们通常会写为 错误 W3C 标准必须为程式指定类型 type=text/javascript,所以要写为 正确 或者 载入外部.js 独立档案的写法正确 图片标签加上文字说明 alt=说明背景音乐不允许使用 bgsound 标签不允许使