You Are Here: Home » Articles » Tips & Tricks » Web » Web Design

5 useful Tips to optimise and make your website compatible with Google Chrome browser

By Debjit on September 7th, 2009 

google chrome logoGoogle Chrome is relatively new in the browser market but it is gradually taking up the market share too. So it  is very important for website developers to optimize the code of their website so that the websites look great and impressive even on the Google Chrome browser. After receiving many insightful questions from users, the Chrome team has released some important tips with which developers can optimize their website to look great even on Google Chrome.

Here they are:

  • User-agent detection: You can detect the User agent for Google Chrome, which is based on WebKit, using a simple javascript code as shown below
    var isWebkit = navigator.userAgent.indexOf("AppleWebKit") > -1;
    Read this and this for more on Chrome's Useragent detection
  • You can show / render plug-in content like Flash and Java in Google Chrome using NPAPI (Netscape Plug-in Application Programming Interface ) plug-ins as Google Chrome doesn't support ActiveX plug-ins. You can check these good resources for more information about NPAPI. You should also look at web app examples and samples which make use of plugin capabilities of Chrome.
  • You must use proper content type and character encoding information in the HTTP response headers, or at the beginning of your pages. Placing this information near the top of the <head> section is highly preferable.debug javascript using Google Chrome's built-int JS debugger
  • Should you face any problems with running you javascript code on Google Chrome, you can use the built-in Javascript Debugger tool of Chrome located under the "page", menu -> 'Developer' -> 'Debug JavaScript' (ctrl+shift+L – Keyboard Shortcut) menu option to debug you JS codes.
  • Block elements like <div> should NOT be placed inside inline elements like <a>. For eg., <div><a>Some Text</a></div> will defenitely have a better output on the Browser than<a><div>Some Text</div></a>.

If you want to optimize a cached version of your website for the Chrome browser, then you could send an email to [email protected].


5 useful Tips to optimise and make your website compatible with Google Chrome browser was originally published on on April 1, 2009 - 3:42 am (Indian Standard Time)