How to implement Google instant page on your website

1 Flares 1 Flares ×

Today I will discuss how to implement Google instant page on your website. Recently Google has revealed about this feature in latest Chrome browser. Are you wondering what is Google Instant Page? Ok lets first have a look at what is Google Instant Page.

 

Google Instant page: It is technology by which the web pages are instantly loaded on the chrome browser (Latest chrome browser V13). This is achieved by pre rendering technology. That means Chrome renders the page before you visit that page.

According to Google:

“Instant Pages helps visitors arrive at your site faster. When we trigger Instant Pages for your site, users can start interacting with your site almost immediately, without having to wait for text and images to load. We’ll only trigger Instant Pages when we have very high confidence that your site is the exact result users are looking for.” For more detail see the Google blog

See the below YouTube video for instant page loading comparison.

 

 

 

Now as states above the instant page is triggered automatically then what to implement on website to activate instant page? Yes it is true that Google instant page is triggered automatically but at present it is only applicable to only major sites, so all the site will not be enabled with this feature. So you need to tell Google that instant page is activated on your site.

 

Why should you implement instant page on your web site? Current survey says that Google Chrome market share is increasing day by day. Almost 17-18% market share is taken by Google Chrome. As most of the people are using Google chrome, why not to take this opportunity and let your visitors access your site instantly without waiting.

 

So now lets see how you can implement instant page on your web site. Implementing instant page is very easy, just a line of code to be pasted on your web page:

 

For Normal websites:

 

STEP1: Select which page to be pre rendered by Chrome. Lets say test.html

 

STEP2: Add the below code to the template of your website just before closing head tag i.e </head>

<link rel=”prerender” href=http://mysite.com/test.html>

Replace the mysite with your domain name

You can add as many as link you want.

 

WordPress implementation:

 

STEP1: First of all you need to decide which links you want to enable for instant page. Suppose you want to enable it for the next link to post in archive.

 

STEP2: Open the header.php file with your favorite editor and add the below code just before ending head tag </head>.

<?php if (is_archive()) { ?>
<link rel=”prerender” href=”<?php echo get_next_posts_page_link(); ?>”>
<?php } ?>

That’s all you are done with installing Google instant page to your website. Now if you open your web site in chrome latest version and go to archive page you can see the difference while navigating to other page.

 

For more details about the author please visit the Google profile link.

Guru

+Ayodhyanath Guru holds a B.Tech degree in Electrical Engineering and has worked with various prestigious clients in the IT industry and presently working as a Software Engineer. He is a part time blogger and presently authors the Jafaloo.Com blog. Being a tech enthusiast Guru likes to surf the web and blogs about interesting technical topics like How-To guides, freewares, Tutorials, Software, Gadgets, web applications etc. Apart from blogging he likes coding in Java/J2EE and PHP.

You may also like...

1 Flares Twitter 0 Facebook 0 Google+ 1 LinkedIn 0 1 Flares ×