What is an iFrame?
A <iframe> tag is used to embed the contents of a particular web URL on to another page. iFrames are traditionally used to embed an advertisement, widgets or resource links.
So if you have a page A and page B and want to serve the contents of page B on to page A then you will use a tag like the one below in the body section of page A.
iFrame example content and webpage –
iFrames and SEO implications
Using frames on your site could cause search engines issues. Using frames can prevent search engines from finding pages within a Web site.
When you use an iFrame within a web page Google usually attributes the content within the frame to the page which contains the iframe.
Also, remember that not all browsers display frames appropriately. From a user point of view, too many frames can be tedious to browse.
The problem gets amplified when critical elements like navigation and title of the page are also in an iframe. Leaving the search engine very little information to get a context of the parent page.
The other problem with an iFrame is that it is not responsive. This means that iframe content doesn’t adapt itself to appear graceful in mobile and tablet devices. This means a bad user experience of the page on mobile devices. This, in turn, affects social signals and SEO ranking of your site’s page.
iFrames can cause duplicate pages. If you have pages on your site which display a single frame with very little content outside of it then you might have duplicate pages.
How to check your site pages for an iFrame
This can be done using custom extraction feature in DeepCrawl.
Step 1: Setup a universal crawl for your website. This should include subdomains and HTTPs version of your site.
Step 2: Use Advanced Setting section while setting up the crawl. Here we set up a custom extraction of <iframe> tag. This helps DeepCrawl list out all pages which have an iframe tag on it.
Step 3: Once the crawl is finished you will see a link in Extractions > “custom extraction” section in the sidebar which says “iFrame Pages”. This is the list of all pages with an iFrame tag.
Step 4: Download this list and see in which of those pages you have crucial content within a <iframe> tag.
iFrame SEO Best Practices
Although Google supports iframes doesn’t mean all search engines do. Even with Google iframes are not 100% SEO friendly.
Priority 2: If you can’t do away with an iframe then you must make sure you don’t have any crucial content wrapped in it. Crucial content could vary for different sites.
For a Blog – you don’t want your iframe wrapped around your main blog content section.
For an e-commerce site – Your product description and shipping information should be out of an iframe.
For a classified site – The listing and details should not be part of an iFrame.
Once we have this priority set it is time to optimize the page for search engines further.
One way to solve this problem is by using the noframes tag. Using noframes tag we will deliver alternative content to both search engines and users. This content should be more than just “Your browser doesn’t support iframes”. This content should give both users and search engines complete context and content of the page. Example is shown below –
<TITLE>A frameset document with NOFRAMES</TITLE>
<FRAMESET cols=”50%, 50%”>
<P>Here is the <A href=”main-noframes.html”>
non-frame based version of the document.</A>
If you are using an iframe on a page make sure there is sufficient content apart from the frame on the page to help search engines understand the page and get the right context about it. This could be an introduction to the topic the page covers or links to other relevant pages from the navigation or within the content.