All Collections
Accessibility Help
Basics
Providing titles for iframes and frames
Providing titles for iframes and frames
Updated over a week ago

iframes and frames are often utilized as a way to embed content within a page from another source. iframes and frames are often useful means for embedding maps and video hosted by a 3rd party, like YouTube.

It is important that web editors provide a title for iframes and frames that are embedded in webpage content as this will allow web visitors know whether they want to dive into this content.

The title attribute should typically be the same as the title element from the item being embedded. This is often very similar to the heading 1 provided on the embedded content. It is okay if these are not exactly the same.

It is important to make sure that the title attribute on iframes and frames are unique when included on the same webpage. 

An example of this could be providing maps for directions to your location. For instance, if we were embedding two sets of directions on our website for getting to our location, it is important to include two different descriptive titles on these embeds. If one was for driving from the airport and the other was for walking from the train station, we would not want to just provide the title "directions" for both of these maps even though they are both indeed directions. 

We should title one "Driving directions from the airport provided via Google maps" and the other "Walking directions from the Lenox MARTA station provided via Google maps".

<iframe title="Driving directions from the airport provided via Google maps" src="https://www.google.com/maps/embed?pb=!2x28" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>
<iframe title="Walking directions from the Lenox MARTA station provided via Google maps" src="https://www.google.com/maps/embed?pb=!1m18" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>
Did this answer your question?