Inline Frames, more commonly known as iframes, are a way to embed HTML within a webpage. If an iframe is visible on-page, any user interaction with it will occur separately from the rest of the page, including scrolling.
How to Use iFrame
Embed visible on-page elements
Iframes are an easy way to embed content from another source on a page, often as widgets. This includes external content like videos and Google maps. It is also possible to embed PDFs with iframes allowing a user to view PDF content without having to leave the page it’s embedded on.
<iframe width="420" height="315" src="//www.youtube.com/embed/qzOOy1tWBCg?rel=0" frameborder="0" allowfullscreen></iframe>
It is not always a creative choice to use iframes. Google AdSense can be implemented via iframes, although only with express permission from Google.
Effect on SEO
Iframes were previously frowned upon by SEOs since they could confuse bots, who could either not see the content, or would crawl the content in the iframe and not be able to get back to the page the iframe was on.
This isn’t so much of an issue now because Google has become a lot better at understanding iframe content. However, Google states in their Rich Media Guidelines that ‘content displayed via iframes may not be indexed’ [Google]. In addition to this, any content within an iframe will more likely be attributed to the source page than the host. For this reason, it’s important to avoid relying on iframes to deliver content to users, unless the content is something you don’t wish to be accredited to the page it is on.
Iframes can also impact page speed (a minor ranking factor on mobile) when used to pull content from an external location. This is because they’re relying on the speed of the external domain to load the content, and preventing the onload event from firing. The onload event occurs once a web page has loaded and is used by browsers to determine when to stop the loading icon in the page tab.
Blackhat practices and misconceptions
Iframes tend to be associated with blackhat practices, having been abused in the past. One such example of this abuse stems from a time when sites would use iframes for Google AdSense. They found they could hide the iframe if it was wrapped in a <div> tag whilst still receiving an impression, since Google would be unable to check whether it had been hidden. For this reason, Google banned the use of iframes for AdSense unless explicitly authorised.
Iframes have also been used for attacks on users, such as clickjacking, where hidden iframes would be used to overlay an innocent looking link. The iframe receiving the link causes the user to download malicious software. However, it is very difficult to implement clickjacking attacks without access to the source of the site hosting the iframe.
Because of this, clickjacking attacks aren’t seen often anymore. The reduction in these attacks is also thanks to search engines weeding malicious sites from their results pages. Typically these kind of clickjacking attacks are now only seen as the result of hacking legitimate websites, and are often prevented by browsers.
Even today, however, iframes are involved in malicious practices. Since iframes often pull data from an external source, they can be abused for phishing attacks, tricking users into entering valuable data without the site they’re hosted on ever being aware of it. Since the attack takes place entirely on the external site, there is little the host site can do about it.
For this reason, it is important to ensure the content in iframes is from trusted sites (such as Google maps). If this is not possible, try to have as few iframes as possible and moderate them to regularly to ensure the content is representative of your intent.
- Google SEO Ranking Factors for 2021
- How to Clean Up Your Link Profiles
- How to Create Blog Posts That Rank High in Google
- Link Building Strategies for New Websites 2021
- Introduction to Blackhat and Whitehat SEO
- How to Run an Initial SEO Audit on Your Website
- How to Deal temporarily Out of stock & seasonal products pages
- How can we better understand what local results Google are serving to visitors?
If you don’t trust the source of an iframe (and sometimes even if you do trust it) it is possible to sandbox them, using the sandbox attribute. This sets restrictions for the content in the iframe, preventing it from executing scripts, using plugins and pushing pop-ups to appear on your page. If it is preventing the functionality required of a particular iframe implementation, you can set the value of the sandbox attribute to allow specific functions, while continuing to block all others.
An example of this is shown below:
On top of the above liabilities, there are also misconceptions surrounding iframes. The SEO community has for a while held the opinion that iframes could be viewed as cloaking. However, since iframes clearly and distinctly reference the source URL of content in a way which can be read by bots, they’re not cloaking.
The overall view of iframes is damaged by these illegitimate practices and misconceptions. However, this doesn’t mean iframes themselves are illegitimate. There are a number of areas where iframes are the best solution. If used properly and within user guidelines, iframes will not result in a manual action. The real concern should be whether the content within an iframe needs to be readable by bots.
Considerations when using iframes
Iframes are considered a link to the content they show. If the iframe is pulling content from an external source, you may not have control over what you are showing your users. If the content is changed, it may result in showing users content you don’t want associated with the site. So it’s always important to secure yourself as much as possible when using iframes, due to the potential security risks they pose.
Content within iframes will likely not be accredited to the host page, however, if the content is something you don’t need to be accredited to you (such as a Google maps widget), iframes may be an appropriate choice. However, while the content will likely not be accredited to you, it may still be associated with your site since iframes are considered a link. So be careful who you’re linking to.
The questions to ask when thinking about implementing iframes are:
- Does this pose a security risk?
- Do I need this content to be accredited to my page?
- Am I using this iframe to link to something that I don’t want associated with my site?