iFrame is short for Inline Frame, a floating frame that allows you to insert an html document into another. It was a technique widely used already in the first web pages, in which a frame was introduced with a menu and another in which the landing pages were shown, all within a single html.
The iFrame is a very useful tool when you need to insert externally hosted content, such as an embedded video, an image or minute-by-minute content in a digital newspaper, for example. One of the most common uses of an iFrame is the insertion of a map with Google Maps that usually appears in the ‘Share’ section of Google Maps.
The iframe code consists of an opening tag, within which the url of the content to be displayed is entered.
Attributes of an iframe
Iframes support the following attributes:
- src attribute =”url”. Contains the URL of the HTML document that can be viewed in the iFrame.
- height =”length”. The height of the document within the iFrame.
- width = “length”. This attribute refers as the one before the size, but in this case to the width.
- name = “text”. The name of the iFrame.
- longdesc = “url”. It refers to the address in which an extensive description of the contents of the iFrame is located.
- scrolling = “yes / no / auto”. This attribute specifies whether the iFrame has the horizontal and vertical scroll bars, which are common for moving a document that doesn’t fit in the frame.
iFrames and web measurement
Pages made with iframes present measurement problems, as they present the complexity of having to install an additional pixel in the embedded frame, with the risk of duplicating measurements or leaving important page interactions unmodated. They are, therefore, a design practice currently under appreciated and increasingly in disuse.