What is an iframe and why you should use it correctly on your website – Marketing 4 Ecommerce – Your online marketing magazine for e-commerce

iframes generally have a bad reputation. Instead we see them everywhere, almost without realizing it. We are going to explain what an iframe is, what it is used for in web design, and why it is so hated.

What is an Iframe?

Have you ever seen a document within a web page? A Youtube video outside Youtube, for example? That is an Iframe. Magic! It is an HTML element that allows us to embed content from another web page in a frame, within our web page, and be able to see it without any problem. Iframe is short for Inline Frame, and for a long time it was only supported by the browser that first introduced it in 1997, Microsoft Internet Explorer. Yes, it already rained. And being from Microsoft Explorer… it already gives us clues that it is not very well considered ;).

After the section of “discovering the story”, here I give you a small example with the last video of our :

If the video has been loaded and you can press Play… you are accessing YouTube, but you are not on YouTube. That’s what’s great. Now you may be wondering, but how?!

How to use an Iframe?

Well, to use an Iframe, just follow these steps:

  • First, you have to use, in the HTML code, the tags «». Within this element, all the specifications and the link of what we want to embed will go.
  • Second, put the “src=” tag. This is an abbreviation for source. Sets the origin of the content we are going to embed.
  • Third, technical specifications. We must specify the size of the Iframe frame, that is, what we want to occupy our page. For this, the following width and length tags are used, putting what we want it to occupy in pixels inside quotes or putting it in %, also including that symbol inside the quotes:
  • Finally, “allowfullscreen”, this allows us to view the videos in full screen mode, being much more pleasant.
See also  EdTech: what it is and 10 great examples of educational disruption

These are the minimum steps to be able to embed one, although of course, there are more elements that can be specified to make it more enriched, such as the title or if you want it to scroll within the frame. This is the example with the link to the previous video:

What would it mean: In this hole, it shows content collected from this url, with this width, with this height and allows it to be put on full screen.

What is an Iframe used for on a website?

Iframes are used to enrich the content of our website, we can expand content with links to our own pages or to other pages that can complement us. They are also a very interesting tool so that visitors to our page do not leave and can see all the content within the same address.

However, one must be careful with the use of this label as hate is a very harsh word. If used in excess, it can cause your website to run sloweras it would have a lot of items to load and would be doing calls to an external element (the other web) which always slows down the loading time. On the other hand, you have to be careful with the source that you link to, knowing that it comes from a secure site to avoid future problems.

In conclusion, well used, it is a correct tool to make our website more attractive, but should not be abused nor should it be the fundamental part of the content of our website.

See also  How to make sustainable ecommerce deliveries, beyond green washing!, with Ignacio López (Paack) - Marketing 4 Ecommerce - Your online marketing magazine for e-commerce

Stay informed of the most relevant news on our news channel

Loading Facebook Comments ...
Loading Disqus Comments ...