Yesterday, I have been browsing my Google Reader feeds, and I stumbled upon a post from the Chromium blog. The actual title was “Introducing Google Chrome Frame“. Since that was something I have never heard before about, I just had to read it.
Well, it turned out that “Google Chrome Frame” is a plugin for Internet Explorer (IE) browsers.
What does it do? It brings the Google Chrome’s web and javascript engine into the IE browser. Therefore you might be using IE’s user interface but under the hood you are running Google Chrome.
Google Chrome’s engine gives you all modern browser advantages, support for HTML5, full support for all Web Standards (100% on Acid3 test), exceptional javascript performance etc.
You can directly install the Google Chrome Frame plugin on Internet Explorer 6, 7, or 8.
Now, let’s see Google Chrome pwning IE in action:
The plugin is installed on an IE7, XP SP3 machine.
We are going to create a simple HTML file, which is showing the browser’s version (in Javascript terms, the User Agent string).
Here is the exact code:
<html>
<head>
<title>Google Chrome Frame test!</title>
</head>
<body>
<a href="javascript:alert(navigator.userAgent)">User Agent</a>
</body>
</html>
The HTML page is displaying a simple link, which upon click it pop-ups a Javascript window displaying the browser version.
Let’s see what it does by default in IE7:
It is the default IE7 rendering engine.
Now, we are going to add a simple string in front of the http:// part of the page’s url, i.e. the result would be cf:http://…
The “cf:” triggers the Google Chrome Frame to be enabled for any site on the Web.
And the result is:
Yeap, this is it, Google Chrome engine powering the poor old IE.
Another way to automatically trigger the Google Chrome Frame is the presence of a special “meta” tag. Of course this is something that the Web developer has to add on a page.
So let’s go and that meta tag on our previous code:
<html>
<head>
<title>Google Chrome Frame test!</title>
<meta http-equiv="X-UA-Compatible" content="chrome=1">
</head>
<body>
<a href="javascript:alert(navigator.userAgent)">User Agent</a>
</body>
</html>
And now without including the cf: url prefix, the result is:
Chrome, or Google, did it again!
Now start adding the Chrome meta tag on your Web pages 😉
Read Full Post »
You must be logged in to post a comment.