Saturday, June 13, 2009
Friday, June 12, 2009
Helping your site look great with Google Chrome
Helping your site look great with Google Chrome
Saturady,Jun14, 2009 at 10:10 AM Webmaster Level: Intermediate to AdvancedSince launching Google Chrome last September, we received a number of questions from webmasters and web developers about how to make their sites look great in Google Chrome. The questions were very insightful and illuminating for the Chrome team, and I want to respond with a few helpful tips for making your site look stellar in Google Chrome.Detecting Google ChromeMost sites will render the same in both Safari and Google Chrome, because they're both WebKit-based browsers. If your site looks right in Safari, then it should look right in Google Chrome, too.Since Chrome is relatively new, many sites have confused Google Chrome with another browser. If your site doesn't look quite right in Chrome but works fine in Safari, it's possible your site may just not recognize Chrome's user-agent string.As platforms and browsers adopt WebKit as their rendering engine, your site can detect and support them automatically with the right JavaScript checks. Commonly, sites use JavaScript to 'sniff' the navigator.userAgent property for "Chrome" or "Safari", but you should use proper object detection if possible. In fact, Gmail has been detecting WebKit properly in Chrome since day one!If you must detect the user-agent type, you can use this simple JavaScript to detect WebKit:var isWebkit = navigator.userAgent.indexOf("AppleWebKit") > -1;Or, if you want to check that the version of WebKit is at least a certain version—say, if you want to use a spiffy new WebKit feature:var webkitVersion = parseFloat(navigator.userAgent.split("AppleWebKit/")[1]) undefined;if (webkitVersion && webkitVersion > 500 ) { // use spiffy WebKit feature here}For reference, here are a few browser releases and the version of WebKit they shipped:
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.16We do not recommend adding "Google" or "Apple" to your navigator.vendor checks to detect WebKit or Google Chrome, because this will not detect other WebKit or Chromium-based browsers!
Saturady,Jun14, 2009 at 10:10 AM Webmaster Level: Intermediate to AdvancedSince launching Google Chrome last September, we received a number of questions from webmasters and web developers about how to make their sites look great in Google Chrome. The questions were very insightful and illuminating for the Chrome team, and I want to respond with a few helpful tips for making your site look stellar in Google Chrome.Detecting Google ChromeMost sites will render the same in both Safari and Google Chrome, because they're both WebKit-based browsers. If your site looks right in Safari, then it should look right in Google Chrome, too.Since Chrome is relatively new, many sites have confused Google Chrome with another browser. If your site doesn't look quite right in Chrome but works fine in Safari, it's possible your site may just not recognize Chrome's user-agent string.As platforms and browsers adopt WebKit as their rendering engine, your site can detect and support them automatically with the right JavaScript checks. Commonly, sites use JavaScript to 'sniff' the navigator.userAgent property for "Chrome" or "Safari", but you should use proper object detection if possible. In fact, Gmail has been detecting WebKit properly in Chrome since day one!If you must detect the user-agent type, you can use this simple JavaScript to detect WebKit:var isWebkit = navigator.userAgent.indexOf("AppleWebKit") > -1;Or, if you want to check that the version of WebKit is at least a certain version—say, if you want to use a spiffy new WebKit feature:var webkitVersion = parseFloat(navigator.userAgent.split("AppleWebKit/")[1]) undefined;if (webkitVersion && webkitVersion > 500 ) { // use spiffy WebKit feature here}For reference, here are a few browser releases and the version of WebKit they shipped:
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.16We do not recommend adding "Google" or "Apple" to your navigator.vendor checks to detect WebKit or Google Chrome, because this will not detect other WebKit or Chromium-based browsers!
Subscribe to:
Posts (Atom)