According to ablogtophone, an iFrame is an HTML element that serves as a frame on a website. Among other things, this framework offers the possibility of embedding content from an external website. Webmasters use iFrames, for example, to display advertising banners, videos or images on one website that originate on another website. However, embedded iFrames can also display internal content and areas.
The function and use of iFrames
The term iFrame is short for inline frame. Inline frames are, as the English name suggests, frames within a website in which, for example, content from other websites is displayed. This is why many webmasters rely on iFrames to enrich the content of the website with external content.
An iFrame is basically an HTML document within another HTML document that is integrated with the help of a code. Different variables can be used with which the content can be adjusted. The code for integrating iFrames usually looks like this:
<iframe src = “http://www.domain.de/webseite.html“ name = “musterframe“ width = “500 ″ height =“ 200 ″ align = “left“ scrolling = “yes“ marginheight = “0 ″ marginwidth = “0 ″ frameborder =“ 0 ″>
</iframe>
It should be noted, however, that the CSS documents for adapting the content of your own website have no influence on iFrames with external links, as the hosting is not on your own website. The adjustment is therefore very limited in this case. Too much third-party content that is integrated via frames accordingly leads to significantly lower optical customization options within your own website. The website’s responsiveness also suffers as a result.
This is a YouTube video embedded via iFrame.
HTML 5
With the introduction of HTML5, additional elements can be added to iFrame codes. In addition, there is, for example, the “allowfullscreen” attribute, which allows content to be displayed in full-screen mode. Embedded videos can, for example, be adapted to the entire screen size. In addition, “Sandbox” attributes can be added, which regulate the extent to which the iFrame can change the content of the website on which it is implemented.
Since HTML5, the scrolling attributes and the style = border attribute are no longer used by default. “Align” and the noframe tag are also no longer used.
The advantages of iFrames
One of the advantages is that the external content of an iFrame does not take up any storage space on your own website and that the loading time of your own page is not influenced by the content of the frame, since the external content is hosted elsewhere. A fast loading time is, among other things, important for an optimal user experience. Apart from that, external content that is integrated with the help of iFrames does not have to be redesigned, which can minimize the workload.
The disadvantages of iFrames
Integrating using iFrame offers many advantages, but there are also some disadvantages that should be considered when using inline frames. For example, no links or bookmarks can be set on iFrame content. In the case of external links, there is also an increased security risk, especially with regard to the protection of user data. Furthermore, the website operator has no control over the functionality of the external link. Another problem is the inconsistent display of iFrames in the various web browsers.
Do iFrames make sense for SEO pages?
With regard to search engine optimization, it is primarily relevant that search engines such as Google recognize iFrame tags in the HTML code, but do not consider the content within the frame, but only follow the link to the original website. For important SEO-relevant content, iFrames should therefore be avoided. In general, excessive use of iFrames is not recommended, as this also affects usability. The user-friendliness suffers especially when iFrames cannot be displayed correctly by web browsers or CMS. So do iFrames make sense from a SEO point of view? Yes, but only in moderation and not with important content. That is why iFrames are only used in SEO if they generate an advantage.