Why do iframes have a bad reputation and an exciting future?
What are iframes?
A good way of thinking about iframe is to compare it to a physical frame. There’s an outer shape, artwork inside, and a frame dividing both entities. The outer world is a website or an app – parent environment. The artwork inside and the frame are elements of an inline frame – child environment.
The purpose of iframes is to embed a HTML application into another. Let’s leave acronyms to one side. Think about Google Maps on contact pages of businesses around the world, Vimeo or YouTube videos embedded within thousands of websites, and the dreaded CAPTCHA verification. Believe it or not, these are all iframes! Without them, websites would not be as interactive, engaging or even secure as they are today.
When to use iframes?
You can go ahead and develop your own secure payment processing gateway, online booking system, chat tool, CRM, map, social media platform, and video streaming service for your website. If you’re in the position to build all of this, you’re probably not looking for iframes. However, if you would like to embed a Facebook Like button, YouTube video, Paypal payment form, and tons of other useful tools on to your website, it’ll be hard to escape the lure of using inline frames as they let users interact with other sites without being redirected.
Appointedd’s customers use booking widgets to take online bookings straight from their websites, mobile apps, or client portals. Our booking widgets are optimised to be quick to load. They have little impact on the loading of other areas of your website. Appointedd widgets can also be loaded in “popover” mode, which means they are only loaded when the user clicks a button, and appear overlaid on the page. Additionally they dynamically resize to fit the content within. They are also fully responsive and stretch to fit the size of any container they are placed in.
We’re using iframes at Appointedd, so I was able to get some insights straight from the source of the stellar security of our widgets – the engineering team.
“We feel that hosting the booking flow on our infrastructure, and displaying it on customer websites increases security of the booking flow. Our infrastructure and software is regularly penetration tested by accredited external parties and is included in the scope of our ISO27001 certifications. Additionally, it means any patches or feature updates are automatically rolled out to all our booking flows.” – Greg Dickson, CTO, Appointedd
Let’s have a look at some examples (if you would like to chat to our team about Appointedd’s functionality, feel free to use one of widgets below to book a call with us)…
Appointedd widget in the popover mode:
Appointedd widget in the embedded mode:
Appointedd enterprise widget:
How did ads become synonymous with iframes?
Iframe critics have a long list of accusations towards embeddable cross-domain components. Some of the charges in this virtual trial are lack of responsiveness and time to load.
A lot of this really comes down to web ads and their reception. Iframes were originally introduced with HTML 4.01 in Internet Explorer in the late 90’s. The combination of IE, HTML 4 and late 90’s Internet technology will set alarm bells off in the minds of modern web technologists.
In the early Internet era, advertisers faced two main issues – slow bandwidth and ads management. Back in time, the user was greeted with a huge banner on the top of a webpage and often paired with gifs creeping out of each corner. If you were lucky enough to be born in the 21st century, you’ll be happy that you didn’t have to go through this. If you’re like me, you might still have distant memories of the modem struggling with loading these unwanted elements.
That’s not a good problem to have, but the alternative is not any better. Before iframes came on the scene, advertisers who wanted to update their ad campaigns needed to get in touch with the webmasters of each website. New visuals had to be provided and then there was waiting to have this approved and actioned. From the perspective of advertisers and websites that wanted to earn on ads, it wasn’t efficient at all.
Enter iframes and ads management portals. Advertisers and webmasters found out that it’s better to embed a number of iframes and manage their content from an external affiliate platform. Because of that, inline frames quickly got associated with ads and it escalated quickly as the main reason for their reputation.
In terms of the mobile devices, in the early 2000s Nokia and Blackberry were in our pockets, while the iPhone was only in Steve Jobs’ mind. With the full keyboard phones without browsers, responsiveness wasn’t as urgent as is now. Mobile phones not only revolutionized the way we look at displays, but also what we use them for.
While mobile apps are here for us to process our payments, book holidays and buy groceries, mobile pages still rely on cross-domain embedding. With the current smartphone presence it’s important for both for users and developers to address any remaining concerns.
In the early days of web browsing, Internet Explorer didn’t have much competition. It’s hard to argue that Internet security was a problem back then. In fact, it never ceased to be a concern. What changed though is the approach to resolving this problem as well as its priority.
Iframes are here to stay
It’s great to see so much discussion on the use of iframes. All technology used on a daily basis requires an open discussion, which also applies to inline frames and cross-domain embedding.
Small and medium business owners are more tech-savvy than ever. They’re provided with a range of web builders and marketing tools to mark their digital presence. On the other side, web technologies are multiplying quickly and becoming more approachable even to users without an engineering background.
This results in the web being built by tons of different tools and shared by multiple environments. Iframes are great middle parties between these entities and the more web technologies we use, the more iframes will be needed to enable users to take advantage of the latest and greatest web technologies.