iframes & whether or not they are "bad"

[GarbCat]

Hiii, I'd like to talk about iframe content on personal sites, though more specifically sites hosted on Neocities 

I'm very new to both webcrafting *and* html, before I made my site in 2022-ish I knew nothing about neither skills and since I make up my personal site wholly as a hobby and for fun, I don't really go out of my way to perfect my craft or use the most advanced or elaborate code. So that being said... the iframe tag really appeals to me as a webcrafter. Or at least it did! Now I find myself getting cold feet with using more of them on my website.
I guess I could best explain this with the pros and cons. I used and planned on using iframe to embed webcontent for a multitude of reasons. For one, being able to incorporate content on my site with minimal coding, for a while I had a chatbox on my site and baking it into my site only required a little bit of code. And secondly when it comes to Neocities in particular, using it to implement music on my site. Since mp3 is a file-type only paid supporters can use on their Neocities sites, this is the only way it seems for a free user to have music playing on their webpages.

However, as my webpage ages I've seriously been ramming my head into its serious downsides ORZ. Embedded content in general is not very conducive to having web content that lasts a very long time, since it means part of your site's content is now content hosted on some other site, it just requires that other website to play ball. I've ran into it a few times already with the music on my webpages- videos get taken down or deleted or otherwise rendered unavailable to me, which in turn breaks the link and renders my site silent. I've already had to go in and change the YT link a few times on pages where the music broke. It seems to be especially a problem with music owned by particularly litigious people, I have a Hyrule Warriors shrine in still in progress and its music broke in record time seemingly due to being music owned by Nintendo and reuploaded onto Youtube without their authorization. And in regards to the chatbox I mentioned earlier, I eventually was forced to take it down as it seemed to have broken over time after the site it originated from kept getting updated, and eventually just was left indefinitely loaded and unable to be interacted with.

I've been planning on incorporating a blog onto my personal site, a very no-frills and simple one at that, and my original plan was to just make a blog on another site and embed it. However with so much experience with iframe content eventually failing or breaking it's given me cold feet and I've started considering other methods, especially since an entire blog would be much more substantial than just some music I slapped onto my site, or a little chat-window on the homepage. Moving forward it's had me consider trying not to use the iframe tag on my website when applicable. I think what I'm looking for in my site is something that will last a very long time without turning to mush, and while I'm fine with music breaking on my webpages (as much as I complain about it, it's really just a 30 second fix LOL) the idea of an entire blog and years worth of posts and images going down because the host site went down makes me think otherwise. Like maybe I'll just build one myself in HTML, it'd be a lot less pretty and way more simple but it'd at least be *my* content hosted on *my* site and not subject to the whims of other parts of the internet, you know?

I'd love to hear what other people have to say on this though. Do you rely on embedded content on your site, do you have issues with it as well or is it just a totally smooth experience for you? Considering the sorts of goals you see a lot of webmasters on the indie web have, the use and reliance on embedded content on personal sites seem to go against that due to just naturally being more volatile, but maybe I'm just really overthinking it all.

[Dan Q]

iframe issues

Iframes definitely have some downsides:

1. They're challenging for accessibility (e.g. keyboard users can struggle with them) and responsivity (making the site work at a variety of screen widths).

2. They can result in navigational surprises: e.g. a search engine or other link source could drop a visitor right onto the "embedded" page, and they'll never see the "full" page.

3. As you observe, they can be fragile if the embedded content is at risk of being modified or deleted independently of the rest of the site, or has different access requirements. But I'd argue that this is a risk for any content hosted "elsewhere" that your site depends upon! For instance, if you use Imgur as a third-party image host and embed those images on your site, visitors in the UK won't see them (where Imgur is is blocked); if you use a CDN for your JS libraries or fonts, these might not load if the CDN is down or blocked. And so on.

4. They're marginally less-performant than same-site content, because the user's web browser has to make an additional request to get the embedded page. If that page is on a different domain, the effect is multiplied because it may also require a fresh DNS lookup, TCP handshake, TLS negotiation etc.

5. Messaging between the parent document and the embedded content and vice-versa is hard, or in some cases impossible. So you can't easily e.g. have a "play/pause" button in one part of your page that toggles the playing state of audio that comes from an iframe.

They're not all bad, and there are some things iframes are great for. E.g. if you want to re-load a part of a page then the use of an <a href="..." target="..."> can make that super easy! So don't think I'm just slating iframes: they have some real selling points too (alongside their problems).

Personally... I don't use them...

Personally, reasons 1 & 2 above are in themselves sufficient to justify me not using iframes on my site. I generally try to avoid any kind of third-party dependencies at all! I selfhost my fonts and any JS dependencies, avoid embedding my own YouTube videos (instead I host them, too, and provide a link to YouTube for people who'd prefer to see it there for some reason!), etc. My thinking is: if a page on my site loads, it should reliably work regardless of what any other site on the Internet is doing!

But I'm in the luxurious position of not having restrictions on the kinds of files I can upload, which I appreciate not everybody has. Plus, as I've discussed before, I'm lucky enough to not have any reason to use iframes for e.g. shared navigation menus or anything either.

But if you wanna use them, that's cool! I don't object to others using them! (It's not like I'm immune from making plenty of other unconventional/controversial choices with my tech stack that others could criticise, too!)

I wonder if you could use a downtime checker or similar tool to warn you if an "embedded" page that you depend upon went down?

[grubbyfox]

i'm a noob with html and website building and all that, but my stance is that i use iframe for funny little bits and bobs on my website, and should they end up dead/non functional etc due to reasons beyond my control - i'll just remove them. they're just there as little treats on my own web page, they're not load bearing walls. i think of them as little stickers. if it starts to peel and fall off, i'll find something else.

[nvalk1]

iframes are bloat in my opinion. If there's a feature that you're really looking for on your site, it's easy enough to find someone who has already made that feature and gives you permission to use their code for your own site so that you can modify it to your needs. Really, iframes are just a shortcut. On top of that, they significantly reduce a website's performance efficiency and can make your site load very slowly, especially for someone with sub-standard internet speeds.

If you want to start a blog, I personally recommend a static site generator (SSG). These are very nice because once you get your templates set up, you can write all of your blog posts in markdown and publishing new posts onto your site is as simple as typing in a single command.

On my site, I used Zola as my SSG because it's written in Rust so it builds the pages super fast, which has been helpful now that blog has grown to over 100 pages. The most popular ones are Eleventy (Javascript), Hugo (Golang), and Astro (Javascript). There's tons of options for SSGs, so I recommend shopping around a bit.

Good luck1 

[ZoranaDragon]

I think the only instances of iframes I have on my own site is one page where I use youtube's embeds to share flipnotes I've posted to my own channel. Otherwise I just avoid them entirely, since I've seen issues with loading other pages unintentionally in an iframe. There are people who have their webrings in iframes, which can make checking for breaks in the OCverse ring a tad annoying. ^^'

I have seen some nice uses of them though by people using the iframes with bits of their own site. There's an apartments webring I'm a part of that uses one for looking at various apartments people have made for example. At least I'm pretty sure it's an iframe. I haven't dug into the page's code tbh.

[Adam]

I don't think there's any issue with using iframes (there's essentially zero impact on performance), the issues arise with how you're using them.
My sites are all static, so I had been using an iframe to embed some interactive content (a guestbook). I blended the CSS and visually, it looked like it was just part of the rest of the page. Unfortunately, the person who created the content I linked to had their account shutdown for violating M$'s TOS, so suddenly my blog had this random square in it with a message about an Azure account being disabled. It wasn't a problem with the iframe itself (it worked perfectly), it was just a problem of relying on a service I didn't control.

[Cele]

I always display my navigation through an iframe because there is NO WAY I'd edit like 20 pages' navigations every time I add something into the navigation bar (which is often). Maybe there's a "better" way but this is the one I learned 15+ years ago and it's the only one I've ever used.

[Skykristal]

I think iframes are completely fine and it's up to everyone whenever they wanna uterlize them or not. I often heard people shit-talking others for having a bad website or using bad practice on their personal site which low-key pisses me off. Just let people have their fun.

Anyway I personally don't use iframes for anything other than embedding small content pieces. For example webgardes, my updates or my big book entries . Anything that feels best in an iframe format for me. Menus/Navigation is not something I embeed. Primarily because of its limitations and because my website is designed a bit differently than most who uterlize iframes like this. I actually make my menu manually for every page and while it's mildly tedious, I'm okay with it. It's not happening often.

I like the iframe-type-of-websites when I see one. Those with a side menu and the content going on the other side of the page. It's super simple, old concept and does the job. Especially for a small hobby site.

The only thing that bothers me a little is the fact that iframes are stuck inside themselves if they weren't set up well and they aren't responsive most of the time.
I set my blog up using zonelets , which is js based instead. It's super simple to use if you're looking for an alternative.