- 浏览: 55450 次
-
最新评论
-
deng.zz：
Nginx，听朋友介绍过，不错。请问一下在有没有必要在IIS7 ...
全球10%的Web站点使用高性能服务器新秀Nginx
作者简介：
Rey Bango，作为Microsoft的一个技术传播者，一直致力于推进客户端Web开发的实践经验，并帮助Microsoft满足社区需求。他对于 HTML5可能带来的丰富的交互的Web应用有着极大的热情。同时，Rey也是jQuery JavaScript项目小组的成员之一，以及.net杂志的作者。
文档兼容性定义了一个浏览器是如何展现你的网站的。你把你的期待对浏览器告知得越详细，你的用户就能有越好的体验。当使用如HTML5这样的Web标准的时候，要显式声明 HTML5的文档类型：
<!DOCTYPE html>
这个标记将触发IE9和IE10中的标准模式（ standards mode ）。它在Chrome和Firefox中也工作得非常好。以下四步将带领你让你的站点能在各种浏览器以及设备上展现：
Step 1:确认你的站点使用的是标准模式
检查你的站点现在是否使用的是标准模式：
1.在 IE10 platform preview 打开网站。
注意 : 你可以使用同样的步骤来更新IE9中的docmode，而不用下载IE10的尝鲜版。
2.按F12来启动IE Developer Tools或者如下所示在工具栏菜单中找到它：
注意 : 如果你对使用IE F12 Developer Tools来调试你的网页还不熟悉，请读下面的指南 。
检查你的站点是否显示Browser Mode: IE10 和 Document Mode: IE10 Standards ，如下面的工具栏所示：
如果你的站点是处于Browser Mode: IE10 和 Document Mode: IE10 Standards 的状态，那么，你已经完成了。注意你的站点的Browser Mode 和Document Mode和上述不同情况。一种常见的例子是Browser Mode = IE8 和 Document Mode = Quirks ，这意味着你的站点是为老版本的IE设计的，并且可能不符合Web标准。
Step 2:实现Web标准下的docmode
强制使用IE10 standards mode来测试你的网站：
- 在你的站点的HTML页面中插入 <!DOCTYPE html>。你可以在这里 学到如何更新你的doctypes。
- 在浏览器中重新加载你的页面并再一次使用F12 Developer Tools来检查Browser Mode 和 Document Mode。如果正确显示出Browser Mode: IE10 和 Document Mode: IE10 Standards ，那么，继续下面的步骤。
Step 3:确认为什么你的站点不是在标准模式下
很多问题都是和支持老版本的IE相关的。要确保你的基于标准的代码是IE9和IE10提供的。然后保留你的非标准的代码支持老版本的IE即可。
1. 我的页面不是Browser Mode: IE10
可能的原因
:
你的页面是处于兼容性视图（Compatibility View
）中，并未了确保站点功能而处于一个老的浏览器模式中。
解决方案
:
检查一下你的站点是否在这个
单子上。你可以在这里
学到更多关于兼容性视图清单的内容并请求移除。
2. 我的页面不是Document Mode = IE10
可能的原因
:
你的网站的 doctype 是无效的或者缺失的。
Resolution:
检查一下你是否有有效的、格式正确的doctye
，如下所示：
<!DOCTYPE html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
你可以在这里 学到如何更新你的 doctypes 。
可能的原因
:
Docmode 中有X-UA-Compatible meta tag
.
解决方案
:
检查页面中是否有这样的代码。去掉它并重新加载页面。继续测试。你可以在这里
了解到更多关于指定文档兼容性模式（Specifying Document Compatibility Modes）的内容。
Step 4:当更新docmode的时候解决常见的一些IE问题
很多问题都是和支持老版本的IE相关的。要确保你的基于标准的代码是IE9和IE10提供的。然后保留你的非标准的代码支持老版本的IE即可。
可能的原因 : Conditional comments 支持不同版本浏览器相关的特性。
（译者注：如果你的web站点或应用程序是供给不同的浏览器用户使用的，那么你可能就需要使用到CSS Hack和CSS Conditional Comments，CSS Conditional Comments是给不同的浏览器加载不同的CSS文件。）
解决方案
:
检查运行非标准代码的 conditional comments
。这些通常是用来支持老版本的IE的某些特性，以便让页面可以适应老版本的IE。检查是否有类似于下面的代码：
<!--[if IE 8]>
<p>Welcome to Internet Explorer 8.</p>
< ![endif]-->
去掉它并重新加载页面。继续测试。你可以在这里 了解到更多关于Conditional Comments的内容。
可能的原因
:
用户代理嗅探（User agent sniffing）支持浏览器版本相关的特性。
解决方案
:
检查user agent sniffing
。这通常是使用user agent string来定位一个浏览器的。
（译者注：User Agent (UA) 字符串，是客户端浏览器等应用程序使用的一种特殊的网络协议，在每次浏览器（邮件客户端/搜索引擎蜘蛛）进行 HTTP 请求时发送到服务器，服务器就知道了用户是使用什么浏览器（邮件客户端/搜索引擎蜘蛛）来访问的。）
检查是否有类似于下面的代码：
if (version = /MSIE (\d+\.\d+)/.exec(navigator.userAgent)) {
isIE = true;
browserVersion = parseFloat(version[1]);
}
你可以使用Web标准来实现特征检测（ feature detection ）。你可以在这里 了解到更多关于User-Agent Strings的内容。IE10 的User-Agent String是在这里 。
其他一些页面不能正常显示的原因
可能的原因
:
你的站点可能使用了特定浏览器相关的特性。请尽可能使用Web标准。
解决方案
:
运行兼容性检测工具（Compatibility Inspector tool
）。
可能的原因 : 第的站点可能使用了第三方插件，比如Flash, Quicktime和Silverlight，而这些是不被IE10 metro支持的。请使用Web标准。
解决方案 : 学习如何创建不使用插件的应用。一个完整的新手教程将很快出现。
可能的原因
:
你的站点可能加载了与特点浏览器相关的CSS文件。
解决方案
:
请确保你的布局尽可能避免使用CSS hacks。你可以在这里
了解到更多关于CSS是议题。
你可以在IE Compatibility Cookbook 看到常见问题清单。
如果你通过以上解决方案还不能够更新你的docmode，tweet us @IE或者查阅MSDN的论坛。
想要了解更多细节，可以阅读以下文章：
Defining Document Capability
@ MSDN
Investigating Document Mode Issues
@ MSDN
Interoperable Quirks Mode
in IE10 @ IE Blog
Compatibility Inspector tool
@ IETestDrive.com
Don’t Forget to Add a Doctype
@ W3C.org
原文链接：Update Your docmode for Web Standards
发表评论
-
响应式Web设计资源整理
2012-03-02 22:50 856这篇文章是对以往发表在Smashing Magazine上关于 ... -
投身移动开发必须知道的20件事
2012-03-01 23:42 773移动开发需要具体的设计考虑。这个所指的范围非常广，可以从“ ... -
聘用NodeJS开发者的六个建议
2012-03-01 23:41 868假设你正想聘用一名Node ... -
[摘要]Vision Mobile发布2012跨平台开发工具报告 PhoneGap最受欢迎
2012-03-01 23:41 924国外知名调查分析机构V ... -
Facebook发力Mobile Web 推出支付和测试工具
2012-02-28 23:49 831Facebook入场了，在MWC大 ... -
【数据】《移动优先》作者：为什么移动如此重要？
2012-02-28 23:48 954三 年前，前雅虎用户体验总监Luke Wrobl ... -
重新审视Mobile Web
2012-02-28 23:48 712作者简介：Byron是一个 ... -
WebAppTrend周刊：Google Chrome工程师推出Web App开发指南
2012-02-26 00:52 1231从本周起，WebAppTrend将精选一周内（2月20日~2月 ... -
Google Web App开发指南第四章：构建优秀的Web Apps
2012-02-24 23:13 1288构建漂亮的应用 一个web app 的视觉设计不仅 ... -
零基础学习Sencha Touch（资料和教程集合）
2012-02-23 00:41 1294译者注：本篇文章为开发者提供了零基础使用Sencha To ... -
Google Web Apps开发指南之项目样例（上）
2012-02-23 00:41 950如果缺少项目案例部 ... -
如何一步一步制作出高品质Infographic？
2012-02-20 21:23 990译者注：Infographic就 ... -
海豚浏览器CTO刘铁锋：Mobile Web App发展现状及展望
2012-02-18 00:10 892在计算机的发展过程中 ... -
海豚浏览器CTO刘铁锋：Mobile Web App发展现状及展望
2012-02-18 00:09 0在计算机的发展过程中 ... -
新手必读：PhoneGap入门六大问题
2012-02-18 00:08 1038很多PhoneGap新手总是需要一些基础问题的解答，Ado ... -
Google Web App开发指南第一章：什么是Web Apps？
2012-02-18 00:07 936很多人向我问起学习HTML5技术的权威入门资料，我总是毫不 ... -
Lanyrd是如何应用HTML5创建出优秀的移动Web应用的
2012-02-15 00:28 660当很多人都在等待观望 ... -
Appcelerator收购Cocoafish，旨在为Titanium平台提供即时移动云服务
2012-02-15 00:17 928译者注：Appcelerator是 ... -
Android官方文档之Web Apps最佳实践
2012-02-15 00:14 700为移动设备开发web页面或者web应用与为桌面浏览器开发web ... -
Android官方文档之Web Apps调试
2012-02-15 00:13 924概览 你可以使用控制台的Javascript方法调试你的w ...
相关推荐
《基于Web标准的网页设计》教学课件02Web标准及其构成.pdf《基于Web标准的网页设计》教学课件02Web标准及其构成.pdf《基于Web标准的网页设计》教学课件02Web标准及其构成.pdf《基于Web标准的网页设计》教学课件02Web...
1+X”Web前端人才标准 Web前端开发职业技能分为初、中、高三个等级，其中高级证书持有者具有复杂网页设计开发能力和网站架构设计规划能力；中级证书持有者具有动态网页设计开发能力；初级证书持有者具有静态网页...
Web2.0标准是互联网发展的一个重要里程碑，它标志着从静态的、单向信息传递的Web1.0时代向动态的、交互式的Web2.0时代的转变。遵循Web2.0标准，不仅有助于提升网站的设计质量和用户体验，还能促进网站的可访问性、可...
web标准（css+div）学习参考，让您从原来的表格布局跨入到web标准（div+css）布局，会使用web标准制作出常见的页面
本书将最有用的CSS技术汇总在一起，在介绍基本的CSS概念和最佳实践之后，讨论了核心的CSS技术，例如图像、链接、列表操纵、表单设计、数据表格设计以及纯CSS布局。每一章内容由浅入深，直到建立比较复杂的示例。...
高级web标准解决方案_扫描版
《基于Web标准的网页设计与制作》中的浮动并清除浮动代码，加批注的。
总结起来，"WebApi和访问WebApi两个项目（更新过）"涉及到的知识点包括WebApi的基本架构、控制器设计、路由配置、模型绑定、过滤器、HttpClient的使用、异步编程、JSON数据交互以及错误处理。通过这些技术，开发者...
精通CSS(高级Web标准解决方案).pdf
本书是关于搜索引擎优化和易发现性的技术指南。
这些框架各有特色，比如IntraWEB以其实时更新和高度定制性闻名，uniGUI则以其广泛的组件库和易于学习的特性吸引用户，而TMS WEB Core则以其高效、跨平台的能力和丰富的组件集脱颖而出。 **TMS WEB Core入门与配置**...
同时，由于浏览器的不断更新和插件支持的变化，开发者需要关注兼容性问题，确保WebPlugin能在多种浏览器环境下稳定运行。 六、实战案例 例如，你可以使用WebPlugin开发一个智能监控系统，通过分析视频流自动识别...
phpweb成品网站升级包免费送给爱好phpweb成品网站朋友，已经更新到最新的v2.0.5/20120412 免责声明：此升级包仅供学习交流使用，切勿用于商业用途，正式使用请购买商业授权。凡在升级过程中出现任何的问题与本站无关...
例如，一个`ValuesController`可能包含`Get`、`Post`、`Put`和`Delete`方法，分别用于获取、创建、更新和删除值。WebApi通过路由规则来确定哪个控制器和方法应处理特定的HTTP请求。此外，WebApi支持模型绑定和验证，...
随着时间的推移，IEWebControl的兼容性问题日益凸显，特别是与现代Web标准和浏览器不兼容。微软在较新的操作系统和开发框架中推荐使用更现代的解决方案，例如Edge WebView2，它基于Chromium，支持最新的Web标准，...
Linux下11的Cgic-Web标准库开发指导.docx
Linux下11的Cgic-Web标准库开发指导.pdf
接下来，你需要配置项目设置，比如Web服务器的URL、端口等信息，这些可以在`Config`目录下的项目设置文件中进行。 在UE5的蓝图系统中，你可以创建一个事件驱动的逻辑，当特定的游戏事件发生时，通过WEBUI插件发送...
Web前端开发面试笔试题涉及到的核心知识点广泛，涵盖了Web标准、编程语言、样式表以及文档对象模型等多个领域。首先，Web标准是由W3C制定的一系列规范，旨在促进Web的有序发展，确保内容的结构、表现和行为分离。这...