Теперь нас можно найти в LinkedIn. Если вас интересуют новости и ресурсы Google Поиска о том, как оптимизировать показ сайта в результатах поиска,
подпишитесь на нас в LinkedIn.
让您的网站在谷歌浏览器里看起来更棒
2009年4月14日星期二
发表者:
Glenn Wilson
, Google Chrome产品经理
原文:
Helping your site look great with Google Chrome
发表于: 2009年3月26日星期四,下午5:35
自从去年9月
谷歌浏览器
发布以来,很多网站管理员和开发者纷纷向我们询问如何使自己的网站与谷歌浏览器更兼容。谷歌浏览器团队把这些问题作为很重要的借鉴和参考,这里我想向您提供一些小建议,让您的网站在谷歌浏览器里看起来更出色。
识别谷歌浏览器
大部分网站在Safari和谷歌浏览器的运行状况是一致的,因为它们都是基于
Webkit
的浏览器。如果您的网站在Safari里看起来正常,那么一般情况在在谷歌浏览器里也能正常浏览。
谷歌浏览器推出的时间还不长,许多网站会在识别上与其他浏览器相混淆。如果您的网站在谷歌浏览器里浏览不正常,但在Safari里能正常浏览,那么很有可能是因为您的网站不能正确识别谷歌浏览器的user-agent字符串。
因为大部分平台和浏览器都接受Webkit作为它们的redering engine,您的网站能够通过正确的Javascript检查自动识别和支持它们。通常情况下,网站使用JavaScript来检测 navigator.userAgent的属性究竟是"谷歌浏览器"还是"Safari",但是可能的情况下还是建议您使用更妥当的
对象识别
(英文)。实际上,Gmail网站在谷歌浏览器发布伊始就可以正确地识别Webkit。
如果您必须识别user-agent类型,您可以使用这些简单的JavaScript来识别Webkit:
var isWebkit =
navigator.userAgent.indexOf("AppleWebKit") > -1;
或者,如果您想至少检查一下Webkit的版本是否是某特定版本的话,比如,当您想使用Webkit的某个新功能的时候:
var webkitVersion =
parseFloat(navigator.userAgent.split("AppleWebKit/")[1])
undefined;
if (webkitVersion && webkitVersion > 500 ) {
// use spiffy WebKit feature here }
以下是一些浏览器的发布和相应的Webkit版本,供您参考:
Browser
|
Version of WebKit
|
Chrome 1.0
|
525.19
|
Chrome 2.0 beta
|
530.1
|
Safari 3.1
|
525.19
|
Safari 3.2
|
525.26.2
|
Safari 4.0 beta
|
528.16
|
您还可以在
webkit.org
(英文)找到关于识别Webkit的更多信息。
其他有用的小建议
-
谷歌浏览器不支持ActiveX插件,但是支持NPAPI插件。这意味着您的Flash和Java可以在谷歌浏览器里正常展示,就像在Firefox和Safari里一样。
-
如果您网站的文字看起来有些不对劲,请确保您在HTTP Response headers里,或是网页起始处,提供了正确的内容类型和字符编码信息。
-
不要将块元素放入inline元素里:
错误:
<a><div>This will look wrong.</div></a>
正确:
如未另行说明,那么本页面中的内容已根据知识共享署名 4.0 许可获得了许可,并且代码示例已根据 Apache 2.0 许可获得了许可。有关详情,请参阅 Google 开发者网站政策。Java 是 Oracle 和/或其关联公司的注册商标。
最后更新时间 (UTC):2009-04-01。
[null,null,["最后更新时间 (UTC):2009-04-01。"],[[["Google Chrome and Safari are both WebKit-based browsers and most sites should render similarly in both."],["Sites can use JavaScript to detect WebKit-based browsers for optimal rendering, ideally by using proper object detection methods instead of user-agent sniffing."],["Google Chrome supports NPAPI plug-ins like Flash and Java but does not support ActiveX."],["Ensure proper content type, character encoding, and HTML element nesting for best compatibility with Google Chrome."],["Webmasters and developers can utilize Chrome's support resources including a support center, forum, and bug reporting tools."]]],["Webmasters should ensure site compatibility with Google Chrome, a WebKit-based browser. Sites should utilize proper object detection instead of user-agent sniffing for \"Chrome\" or \"Safari\". If user-agent detection is necessary, check for \"AppleWebKit\" in the `navigator.userAgent`. Chrome supports NPAPI but not ActiveX plugins. Ensure proper HTTP content type and character encoding. Avoid placing block elements within inline elements. A support center and forum are available for developer questions, and bugs should be reported. Sites can contact Google to be used as benchmarks for internal optimization.\n"]]