What are iFrames?
iFrames are elements of the HTML markup language which one uses to embed a piece of content from one web page into another web page. iFrames are also referred to as inline frames.
Examples of iFrames:
- a video from YouTube
- a “like” button from Facebook
- a weather widget
- another web page
- a document in a PDF format
Simply put, iFrames are micro-domain that have been inserted into your domain to be viewed there. If it’s an inserted web page, it typically has a scrollbar attached by default, to easily navigate the embedded site. Take a look at this example of an iFrame below:
Avoiding iFrames is Important for SEO
iFrames are not considered SEO-friendly and are likely to hurt your rankings, especially if the keywords, that you want to rank for, are used within the iFrame. Therefore, if you are putting valuable content in the iFrame tag, that you wish to be indexed for, it’s recommended to not use the tag at all.
This is because search engine robots from Google and other engines do not crawl iFrames and frames since they do not fully understand them. Even Google states that it “supports frames and iFrames to the extent that it can;” therefore, your iFrame tag cannot be guaranteed to be indexed.
The reason for that is because a model of a web page with iFrames is different from the idea of a traditional web page. It’s hard for search engines to associate embedded text with the page that it’s on. Several URLs are very misleading for crawlers.
If you wish for the crawlers to see and index the content within an iFrame tag, you can try doing that with a Robots.txt. or by adding your main URL within <iframe> tag. However, t is still not guaranteed to be indexed.
The Proper Way to Create an iFrame for Your Site
If you decide to incorporate an iFrame on your site, it is important to do so correctly.
iFrames are displayed within an <iframe> opening tag and should be closed with the </iframe> closing tag. You should provide the URL of the embedded resource using a source attribute, <src>.
The basic code will look like that:
<iframe src=”the source of the embedded website”></iframe>
Hint: Ensure that the content being embedded is not the same as existing content on your site, because then it may be considered as duplicate content by Google crawlers, which can harm your rankings.
Usage of Frames on Sites in the Past
It was only a few years ago that internet loading speed was significantly slower. Therefore, website's used to use frames to split a web page into parts, each part would show a different view (eg. navigation, advertisement, main page etc.). By using frames, websites were able to give viewers a better experience by reducing the load time was reduced.
You may remember, but here is how a frame looks like on a webpage:
Due to the frame, the crawlers will view that single page as three separate pages like this:
Each frame on a website are are micro-domains which the crawlers will crawl individually.
Frames in the present day
Nowadays, with internet being much more speedy, the frames now provide a website visitor with a negative User Experience (UX).
Frames will also have a negative effect on SEO due to the micro-domains (shown the image above). Tthe search engine must crawl each one of those domains and they will index as different pages. This gets the crawlers confused by not being able to index it properly, and your page will not rank well.
Lastly, The <frame> tag is also not supported in HTML5.
To have a site that is easy to crawl, it is not recommended to use frames.
The only way to get around that is by creating a <noframes> tag with a description full of actionable keywords. This tag will appear if your image fails to load. It is also the information that the crawler will see when scanning your website. Just remember to put it outside the <frameset> tag. Otherwise, the robots may not find it. This still does not guarantee your web page to be indexed properly.
Frames are obsolete and are not considered friendly to both users and search engine crawlers, it’s not recommended to use them. However, if you have to or really want to use them, just make sure you’re doing it correctly.