The chart above represents the approximate market share of different web browsers worldwide as determined by Statcounter, the web analytics service. Google Chrome continues to grow at an impressive rate and in some regions, the UK for example, Google’s browser has overtaken Firefox to take the second spot.
The reason why I shared that chart is simple – a significant portion of visitors could now be coming to your website using Google Chrome so even if there’s a feature that’s very specific to Chrome, like Instant Pages, it still makes lot of sense to incorporate it into your website /blog.
Add Google Instant Pages to your Website
Google Instant Pages, in simple English, is a way of telling Chrome about any one link on your page that visitors are most likely to click and Chrome, running on the visitor’s computer, could then try to prefetch that page in the background.
To give you an example, visitors to this blog’s archive pages are most likely to click the “Next Page” link that’s down at the bottom. I can pass this information to Google Chrome, using the Instant Pages syntax, and the “next page” will then load in a nanosecond if someone decides to click it.
Here’s a video recording to help you understand how Instant Pages increase the page loading speed – visitors can navigate pages as if they are stored on the local machine.
Adding support for Instant Pages to your website is extremely simple. Open your website template and, before the closing </head> tag, include the following code:
<link rel="prerender" href="http://example.com/page2.html">
The URL (example.com) should point to the next “logical” page. For instance, if you have a photo gallery or a long article that spans multiple pages, the URLs could point to different parts of the page. The prerender tag on Page 1 could point to Page 2 while the prerender tag on Page 2 could point to Page 3 and so on.
A small business website may link to their “about” page or the “products” pages from the “home” page using the Instant Pages tag as that’s where potential customers are likely to go once they land on the home page.
Google Instant Pages for WordPress
If you have a static website, it take some effort to enable Instant Pages on every single page but WordPress users can consider themselves lucky.
Open your header.php file, copy-paste the following code inside the closing <head> tag and you’re done. This is already live on Digital Inspiration (check the source code).
<?php if (is_archive()) { ?>
<!-- Instant Pages for Google Chrome -->
<link rel="prerender" href="<?php echo get_next_posts_page_link(); ?>">
<?php } ?>
No comments:
Post a Comment