[Libs-Or] Tech-Talk: WEB AUTHORING - Using Generic iFrames Responsively

Tue Feb 10 12:54:30 PST 2026

Welcome to the latest issue of Tech-Talk!

Having trouble reading this email?
You can view the tech tip<https://www.tech-talk.com/embedresponsively-com-and-iframes.html> and the communications tip<https://www.tech-talk.com/12-power-words-9-what-makes-you-ask-that.html> online instead at:
https://www.tech-talk.com/login/oregon

When prompted for a username and password, use ORLIBTECH for both.

Tech-Talk is a paid subscription service for staff of Oregon libraries and is supported in whole by the Institute of Museum and Library Services (IMLS) through the Library Services and Technology Act (LSTA), administered by the State Library of Oregon.

[https://files.constantcontact.com/ee1208b4001/c453716f-d2de-4a2b-91bf-1a983735252a.png?rdr=true]

[fireworks]<https://opiayfbab.cc.rs6.net/tn.jsp?f=001VBbDIst3ZGid1jOt_qCuMt-5vtZLUsBGzbb7uwkm5lf5TI7fXmTs3flnXgZWes2zV7k72v3ASkAYAW9LwhYleXoXfHyH2MVG6ixup94twmM3aqX_hawYM3lAip6pBFGoTybetLmP50QYNAq8EVEp24PkSZRAp_zsto3OLNQG0T0C5iamygVxTA9AgFyW5Ki1yhpicRexQ2I=&c=k0PstXDerHWX2DOSC6B08skeaGvwBhE2-W8-LYsCcquwf8pV8O_fnw==&ch=YlHvxW1X6CKa4fnN0Fdr3hGBALhGmEOkNgtCL1FDJ5S2UbDKQQZUPg==>

[https://files.constantcontact.com/ee1208b4001/e25f6bcf-26a8-4e59-91f2-cc248962042d.png?rdr=true]<https://opiayfbab.cc.rs6.net/tn.jsp?f=001VBbDIst3ZGid1jOt_qCuMt-5vtZLUsBGzbb7uwkm5lf5TI7fXmTs3eKTUvh7ptqOzeulztGCNz-1buo5swFSPTpQrnC0XdMqEJRlA5ZHAy1nVKbIA3bUdUa3gmWCwBe_rIM61LTaejvYtPxj8lhdf8uU8W6zk-_I&c=k0PstXDerHWX2DOSC6B08skeaGvwBhE2-W8-LYsCcquwf8pV8O_fnw==&ch=YlHvxW1X6CKa4fnN0Fdr3hGBALhGmEOkNgtCL1FDJ5S2UbDKQQZUPg==>

Webinars for You

NOTE: Webinars begin at 3 pm ET / 2 pm CT / 1 pm MT / 12 Noon PT and are one hour long.

February 11: [GOOGLE FORMS & AI] Let AI Reveal the Story Behind Your Google Form Responses. Why Attend? You gather data with forms and want immediate analysis of trends and summaries.

February 25: [WEB TOOLS] Discover 10 Free Web Tools We Use Continually. Why Attend? You enjoy knowing the perfect tool for things you do regularly so that you’re productive and creative.

March 11: [WEB AUTHORING] Webpage Accessibility That Actually Works for Libraries, WCAG 2.1 Explained. Why Attend? You want to know how to make your website compliant with accessibility standards.

March 25: [WORD] Using Word's Page Breaks, Tabs & Sections for Polished Documents. Why Attend? You’d like your materials to have a powerful infrastructure so they are easily edited and look great.

View Webinars and Register Here<https://opiayfbab.cc.rs6.net/tn.jsp?f=001VBbDIst3ZGid1jOt_qCuMt-5vtZLUsBGzbb7uwkm5lf5TI7fXmTs3ZXZMcbflyeZRFBIMCdAvOokG5KBHuXCtWE2H-_pr6qji1uyKDDdbXcLWxO_6ezmPcZM4lkT3pVJJOCj4Wq7QIIPCG-UaNRXB1d-rc2CxR5QURf9kPU6U8E=&c=k0PstXDerHWX2DOSC6B08skeaGvwBhE2-W8-LYsCcquwf8pV8O_fnw==&ch=YlHvxW1X6CKa4fnN0Fdr3hGBALhGmEOkNgtCL1FDJ5S2UbDKQQZUPg==>

WEB TOOL - EmbedResponsively.com and iFrames

Advanced

[Illustration of a desktop monitor, laptop, tablet, and smartphone displaying similar website layouts, representing responsive web design across multiple devices. Background is dark blue with faint gear and arrow icons.]

Have you ever pasted a video or map onto your website and had it look weird on a phone?

You end up having to scroll left and right to see everything. Wouldn’t it be great if what you put on a web page converted seamlessly for mobile screens … stacking neatly instead of stretching too wide?

You can do it using a simple, free web tool called EmbedResponsively.com<https://opiayfbab.cc.rs6.net/tn.jsp?f=001VBbDIst3ZGid1jOt_qCuMt-5vtZLUsBGzbb7uwkm5lf5TI7fXmTs3TZ6BisGBZh7Wk25ErHMcCnRy7ByyraXbQnuoZqKuOvPoZkHQfCTRnCAfgzLwiIeNdAVDMfMPENbLCcogplIULaNCXuOUVD3D_0DFmMVedX5GfsZYUpuFLo=&c=k0PstXDerHWX2DOSC6B08skeaGvwBhE2-W8-LYsCcquwf8pV8O_fnw==&ch=YlHvxW1X6CKa4fnN0Fdr3hGBALhGmEOkNgtCL1FDJ5S2UbDKQQZUPg==>. Let me explain:

·     Being responsive means the video or image automatically adjusts its size and layout to fit any screen… phone, tablet, laptop, or desktop. Nothing gets cut off, squished, or forces sideways scrolling.

·     To embed something means to place a video, map, or other content directly on your webpage so people can view it there without leaving the page. The other option is to link to the content, which sends visitors to another site instead.

Why Embed Instead of Link?

When you put a link to a video or other content on a web page, people get sent off your site when they click on it. Embedding keeps people on your page. It also loads faster, looks more professional, and lets you control the experience.

Where to Get Embed Code

OK, you’ve created a video. Now you have to put it somewhere. If you place a video directly on your webpage, it can take up a lot of space. That’s why most people host videos on services like Vimeo, YouTube, or Screencast. Each of these site types will give you embed code for you to use.

For instance, when we place a Tech-Talk video for an article or a webinar, we use Screencast.com. (By the way, there is a free version if you have under 25 videos.) In this tool, we can get our embed code for the video.

TIP: For Tech-Talk, we make the video dimensions smaller than the default to fit better on a web page. To do that, we set the width to 750px. Just put your cursor in the box and change the number. The height will automatically modify.

Example: We replace the 1728 width with 750.

·     Then click the “copy” button.
·     Go to EmbedResponsively.com
·     Choose the “Generic iFrame” tab.
·     Paste code.
·     Then copy the converted embed code that is listed below the video.

[Screenshot of a "Share Media" popup with the "EMBED" tab selected. There are fields for width (1728) and height (1080), and an embed code box. A red arrow points to the width field.]

How to Use EmbedResponsively.com

EmbedResponsively.com<https://opiayfbab.cc.rs6.net/tn.jsp?f=001VBbDIst3ZGid1jOt_qCuMt-5vtZLUsBGzbb7uwkm5lf5TI7fXmTs3TZ6BisGBZh7Wk25ErHMcCnRy7ByyraXbQnuoZqKuOvPoZkHQfCTRnCAfgzLwiIeNdAVDMfMPENbLCcogplIULaNCXuOUVD3D9adZpoId_5p3xap9wU0heI=&c=k0PstXDerHWX2DOSC6B08skeaGvwBhE2-W8-LYsCcquwf8pV8O_fnw==&ch=YlHvxW1X6CKa4fnN0Fdr3hGBALhGmEOkNgtCL1FDJ5S2UbDKQQZUPg==> is a free, easy-to-use tool that turns video, map, and media embed code into clean, mobile-friendly code that automatically resizes for any screen.

Just copy your existing embed code and paste it into the site. In seconds, it generates a responsive version for you.

Copy the new code and place it on your web page. This way, your media stays on your site and displays correctly on phones, tablets, laptops, and desktops…without awkward scrolling or cut-off content.

[A preview of a video titled "Bring Graphics to Life: GIF Animation Essentials" with a dinosaur, animated fruits, and vegetables. The Tech-Talk logo is in the top right corner. HTML embed code appears below the preview.]

Choices When Using EmbedResponsively

When you go to EmbedResponsively.com, you have choices: YouTube, Vimeo, Dailymotion, Google Maps, Getty Images, Generic iFrame, and More.

For instance, if your videos are stored on YouTube, and you want to put them on your site, you can use EmbedResponsively to make sure it fits on mobile devices.

So, select the YouTube tab! Then, instead of placing your own embed code in the tool, copy the link to your YouTube video ... and paste it into the YouTube section ... you'll get the mobile-responsive code.

Example: When you put your link into the tool and click the Embed button, you’ll get the code.

[https://files.constantcontact.com/ee1208b4001/35d54176-eca7-40a0-abd5-e71a3f02a162.png?rdr=true]

What is a Generic iFrame?

An iFrame (short for inline frame) is an HTML element that displays one webpage inside another.

Think of it like a window inside your page. The content in that window lives elsewhere on the internet, but it appears on your site.

A generic iFrame is used when you want to embed content without using a specific external platform like Vimeo, YouTube, etc. This way it displays the video consistently across websites, devices, and browsers.

[A webpage interface offering media source options, with "Generic IFrame" selected. Below, a box displays iframe embed code and an "Embed" button is highlighted on the right.]

iFrames Update Content Dynamically

Another nice thing about iFrames is that they can save time and maintain accuracy by keeping your content dynamic. This means that instead of uploading new content every time you make changes, the updates happen automatically.

What About Accessibility?

iFrames are not automatically accessible. So embedding content from accessibility-aware sources like EmbedResponsively.com can make your media easier to deliver and maintain.

What EmbedResponsively does well:

·     Generates responsive iFrames that resize properly on all devices (no horizontal scrolling).
·     Lets you add a title attribute to iFrames … essential for screen-reader users.
·     Avoids unnecessary scripts that can interfere with assistive technologies.
·     Works cleanly with modern HTML and CSS used in accessible layouts.

What it does not control:

·     The accessibility of the embedded content itself (videos, forms, maps, documents).
·     Whether videos have captions, audio descriptions, or keyboard controls.
·     Whether the embedded site meets WCAG 2.1 AA standards.

Bottom Line

EmbedResponsively supports accessibility best practices, but it does not magically make inaccessible content compliant. It gives you a clean, flexible container … you’re still responsible for what’s inside it.

MARCH WEBINAR: WEBPAGE ACCESSIBILITY<https://opiayfbab.cc.rs6.net/tn.jsp?f=001VBbDIst3ZGid1jOt_qCuMt-5vtZLUsBGzbb7uwkm5lf5TI7fXmTs3ZXZMcbflyeZRFBIMCdAvOokG5KBHuXCtWE2H-_pr6qji1uyKDDdbXcLWxO_6ezmPcZM4lkT3pVJJOCj4Wq7QIIPCG-UaNRXB42PBEbknfhNExk_T3yo02M=&c=k0PstXDerHWX2DOSC6B08skeaGvwBhE2-W8-LYsCcquwf8pV8O_fnw==&ch=YlHvxW1X6CKa4fnN0Fdr3hGBALhGmEOkNgtCL1FDJ5S2UbDKQQZUPg==>

[https://files.constantcontact.com/ee1208b4001/0a3399e5-494d-4831-84ad-e989f34b1b73.gif?rdr=true]<https://opiayfbab.cc.rs6.net/tn.jsp?f=001VBbDIst3ZGid1jOt_qCuMt-5vtZLUsBGzbb7uwkm5lf5TI7fXmTs3ZXZMcbflyeZRFBIMCdAvOokG5KBHuXCtWE2H-_pr6qji1uyKDDdbXcLWxO_6ezmPcZM4lkT3pVJJOCj4Wq7QIIPCG-UaNRXB1XoMv0Y1EiulAF-CYpge04=&c=k0PstXDerHWX2DOSC6B08skeaGvwBhE2-W8-LYsCcquwf8pV8O_fnw==&ch=YlHvxW1X6CKa4fnN0Fdr3hGBALhGmEOkNgtCL1FDJ5S2UbDKQQZUPg==>

[https://files.constantcontact.com/ee1208b4001/e565d7d1-215e-487a-8e78-f332113e7825.jpg?rdr=true]

Communications: 12 Power Words #9

“What makes you ask that?”

 People ask you questions all the time. And the natural inclination is to answer them, right?

Here’s a phrase that will help you in several ways:

“What makes you ask that?”

[Two men stand facing each other in conversation near a window; one holds a tray and listens intently while the other gestures with his hand, both appearing serious. Natural light comes through the window behind them.]

When you use these powerful words, a number of things happen.

·     You learn what angle of the question the person is thinking.
·     You buy some time to get your thoughts in order.
·     You’ll probably discover the reason behind the question … which could significantly affect your reply.

Getting to the root of the question is revealing … and can save a lot of talking around the subject.

Examples:

·     QUESTION: “How comfortable are you driving the entire trip?” What makes you ask that? Possible insightful replies: “We could go by train.” or “I could plan to drive part way”, or “I’m concerned about your hip.”
·     QUESTION: “When are you going to finish the report?” What makes you ask that? Possible insightful replies: “I want to add a section before you do.” or “I’m worried you won’t have it done in time.” or “I want to take it with me on the trip.”

TIP: Be sure to use this phrase in a light-hearted and friendly manner, so that it doesn’t make the questioner feel defensive.

[https://files.constantcontact.com/ee1208b4001/e8848d0d-4903-48da-85d0-7903dddee893.png?rdr=true]

Copyright 1996-2026 Shared Results International. Published weekly. Distribution is limited by license. For information on how to include additional recipients, contact support at tech-talk.com<mailto:support at tech-talk.com> 585-615-7795.

Cheers,
Darci Hanning, MLIS (she/her/hers)
Public Library Consultant / CE Coordinator
Continuing Education Resources: https://slo.oregon.gov/conted/
State Library of Oregon | Library Support and Development Services
971-375-3491 | darci.hanning at slo.oregon.gov<mailto:darci.hanning at slo.oregon.gov> | www.oregon.gov/library<http://www.oregon.gov/library>

[State Library of Oregon (Logo)]

-------------- next part --------------
An HTML attachment was scrubbed...
URL: <https://omls.oregon.gov/pipermail/libs-or/attachments/20260210/ecd4d1ef/attachment.html>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: image001.png
Type: image/png
Size: 15548 bytes
Desc: image001.png
URL: <https://omls.oregon.gov/pipermail/libs-or/attachments/20260210/ecd4d1ef/attachment.png>