Add accessible pictures and media to a SharePoint Online site (2024)

SharePoint in Microsoft 365 lets you easily add alternative text, also known as alt text, for all of your multimedia content. Alt text is one of the first steps toward full document accessibility. It helps users with visual impairments to learn the content of images, screenshots, charts, videos, and more. Deaf users rely on text transcripts to access the content in videos or in audio files.

In this topic

  • Add a picture with alt text

  • Add video in a media web part

  • Embed an audio file in your page

Add a picture with alt text

When using photos, images, clip art, or audio, you're responsible for respecting copyright. For images, the license filter in Bing can help.

  1. To open the Editing ribbon and to enter Edit mode, on the page you want to edit, select the Edit link.

  2. Place the focus where you want the picture to appear.

  3. To open the Upload Image dialog box, from the Insert tab, open the Picture group and select From Computer.

    Add accessible pictures and media to a SharePoint Online site (1)

    Tip:To insert a picture from the Internet by pasting in an image URL, select From Address. To insert an image from your SharePoint in Microsoft 365 site, select From SharePoint.

  4. Choose your file, select a destination folder in your SharePoint in Microsoft 365 site (the default choice is the Site Assets folder), and include any notes about the different image version.

  5. To insert your picture and activate the Image tab, select OK.

    Add accessible pictures and media to a SharePoint Online site (2)

    Tip:The Image tab is only visible when an image is selected.

  6. Move to the Alt Text box on the Image tab, and enter your alternative text for the image.

  7. When you finish, click Save.

Accessibility tips

  • Alt text should be brief but descriptive.

  • Good alt text tells the listener why the picture is important.

For more information about alt text, including examples and links to more information, visit the WebAIM Alternative Text page.

Add video in a media web part

Whenever you add a video to a page, make sure to include captions and audio descriptions of the content. Captions let hearing-impaired users learn about the content, and they provide assistance to non-native speakers who watch the video.

To make an audio recording accessible to deaf users, create a transcript and make that available along with the audio file.

  1. To open the Editing ribbon and to enter Edit mode, on the page where you want to display the video, select the Edit link.

  2. Place the focus where you want the video to appear.

  3. To open the Upload Media dialog box, from the Insert tab, open the Video and Audio group and select From Computer.

    Add accessible pictures and media to a SharePoint Online site (3)

    Tip:To insert a file from the internet, select From Address and paste in a URL. To insert an audio or video from your SharePoint in Microsoft 365site, select From SharePoint. To add embed code from sites such as YouTube or Vimeo, select Embed.

  4. Choose your file, select a destination folder in your SharePoint in Microsoft 365 site (the default choice is the Site Assets folder), and include any applicable notes about the different file version.

  5. To insert your video inside of a Media Part component and to activate the Media and Web Part tabs, select OK.

    Tip:The Media tab is only visible when a media file is selected.

  6. Open the Web Part tab, and select Web Part Properties. The Media Web Part Properties pane appears.

    Add accessible pictures and media to a SharePoint Online site (4)
  7. In the Title box, type the title.

  8. Scroll down, and open the Advanced panel.

  9. In the Description box, type a brief description of the audio or video file.

  10. To apply your changes to the media web part, scroll to the end and select Apply.

  11. When you finish, to save your changes to this page, select Save.

Embed an audio file in your page

These instructions tell you how to place a much smaller, slimmer control bar into a webpage. This control bar works best for audio files, like podcasts, in which the full media web part would be too large.

  1. Upload the audio file and transcript file into your Site assets folder.

    1. To open the Settings menu, in the upper-right corner, select the Settings icon.

    2. Select the Site Contents link.

    3. Go to the Site Assets folder.

    4. Drag the audio and transcript file into the folder.

      Add accessible pictures and media to a SharePoint Online site (5)

    5. Get the URLs for the files. To open the file action menu, next to the file name, select the ellipsis. Copy and paste the link from the action menu to another file. You will need this link later, in the audio embed code.

  2. To open the Editing ribbon and to enter Edit mode, on the page where you want to display the video, select the Edit link.

  3. Place the focus where you want the video to appear.

  4. To open the Embed dialog box, from the Insert tab, open the Video and Audio group and select Embed.

    Add accessible pictures and media to a SharePoint Online site (6)
  5. Paste the embed code into the field, with the URL of your audio file after “src=” and between the quotation marks.

    <audio src="your-audio-file-URL-here.mp3"controls="controls"></audio>

    This code places the media control bar on the page. The bar lets users start and stop the playback.

    Tip:If your embed code is not formatted correctly or if it points to a file location that does not exist, the Insert button will not be active.

  6. When you are done, select Insert to put your audio control on the page. The embedded audio control looks like this:

    Add accessible pictures and media to a SharePoint Online site (7)
  7. Place the focus at the end of the audio control snippet and to go to the next line, press Enter.

  8. Insert a link to your audio transcript file.

    1. To open the Select an Asset dialog box, from the Insert tab, select Link and From SharePoint.

    2. Select your audio transcript file, and press Insert. This inserts a hyperlink with the name of the file as the text of the link.

    3. Place the focus in the link, just before the last character of the file name. Slowly backspace to remove all but the first and last characters in the file name.

      Tip:This leaves the link intact and keeps your cursor exactly where it needs to be so that you can change the text of the link.

    4. Type the text that you want for the link. For example, for an audio transcript, type View the audio transcript.

    5. Delete the remaining characters of the file name.

  9. When you're done, to save all your changes, at the top of the page, click Save.

Related information

Resources for creating accessible sites in SharePoint Online

Keyboard shortcuts in SharePoint Online

SharePoint lets you easily add alternative text, also known as alt text, for all of your multimedia content. Alt text is one of the first steps toward full document accessibility. It helps users with visual impairments to learn the content of images, screenshots, charts, videos, and more. Deaf users rely on text transcripts to access the content in videos or in audio files.

In this topic

  • Add a picture with alt text

  • Add video in a SharePoint page

Add a picture with alt text

When using photos, images, clip art, or audio, you're responsible for respecting copyright. For images, the license filter in Bing can help.

For SharePoint Site pages, complete the following steps:

  1. To allow for adding content to the page you want to edit, select the Edit link.

  2. Select the Add a New Web Part button.

    Add accessible pictures and media to a SharePoint Online site (8)
  3. Select the Image web part from the selection menu.

    Add accessible pictures and media to a SharePoint Online site (9)
  4. Choose the location of the file from list of file locations.

    Add accessible pictures and media to a SharePoint Online site (10)
  5. Choose the file and select Open.

  6. To add alt text to the image, select the Edit Web Part link.

    Add accessible pictures and media to a SharePoint Online site (11)
  7. Enter the alt text in the Alternative Text box.

  8. Select X to save the alt text.

    Add accessible pictures and media to a SharePoint Online site (12)

Accessibility tips

  • Alt text should be brief but descriptive.

  • Good alt text tells the listener why the picture is important.

For more information about alt text, including examples and links to more information, visit the WebAIM Alternative Text page.

Add video in a SharePoint page

Whenever you add a video to a page, make sure to include captions and audio descriptions of the content. Captions let hearing-impaired users learn about the content, and they provide assistance to non-native speakers who watch the video.

  1. To allow for adding content to the page you want to edit, select the Edit link.

  2. Select the Add a New Web Part button.

    Add accessible pictures and media to a SharePoint Online site (13)
  3. Select “Embed.”

    Add accessible pictures and media to a SharePoint Online site (14)
  4. Enter the URL or embed code of the video you wish to display.

    Add accessible pictures and media to a SharePoint Online site (15)

    Note:For YouTube videos, include this line in the embed code immediately following the video address information: &cc_load_policy=1 (for example, <iframe width="560" height="315" src="https://www.youtube.com/embed/7XocqGYt4J4&cc_load_policy=1" frameborder="0" allowfullscreen></iframe>).

  5. Select X to save the embedded video.

  6. To add a video from your collection of site assets on SharePoint Modern Experience, select Office 365 Video from the Web Part menu.

    Add accessible pictures and media to a SharePoint Online site (16)
  7. Select Add Video.

    Add accessible pictures and media to a SharePoint Online site (17)
  8. Enter the URL of the Office 365 Video to display on the page.

    Add accessible pictures and media to a SharePoint Online site (18)
  9. After entering the address, select X to save the video to the page.

    Note:Only videos in your SharePoint site collection are selectable here. External items such as YouTube or Vimeo videos must be embedded.

  10. When you finish, to save your changes to this page, select Save and Close or Publish.

See also

Resources for creating accessible sites in SharePoint Online

Keyboard shortcuts in SharePoint Online

Add accessible pictures and media to a SharePoint Online site (2024)
Top Articles
'It's a cash cow': Sneaky fee catches out Kiwi living in Oz
6 Times Couples Should Combine Their Finances — and 2 Situations Where They Shouldn’t
Television Archive News Search Service
Faridpur Govt. Girls' High School, Faridpur Test Examination—2023; English : Paper II
Craigslist Mpls Mn Apartments
Free Atm For Emerald Card Near Me
South Park Season 26 Kisscartoon
DENVER Überwachungskamera IOC-221, IP, WLAN, außen | 580950
Owatc Canvas
More Apt To Complain Crossword
Heska Ulite
Best Private Elementary Schools In Virginia
Best Pawn Shops Near Me
Select Truck Greensboro
Pro Groom Prices – The Pet Centre
Cashtapp Atm Near Me
Razor Edge Gotti Pitbull Price
Canvas Nthurston
Craighead County Sheriff's Department
2020 Military Pay Charts – Officer & Enlisted Pay Scales (3.1% Raise)
Testberichte zu E-Bikes & Fahrrädern von PROPHETE.
Craigslist Pearl Ms
Rimworld Prison Break
Knock At The Cabin Showtimes Near Alamo Drafthouse Raleigh
Del Amo Fashion Center Map
Yugen Manga Jinx Cap 19
Ontdek Pearson support voor digitaal testen en scoren
eugene bicycles - craigslist
JVID Rina sauce set1
Access a Shared Resource | Computing for Arts + Sciences
WPoS's Content - Page 34
3 Ways to Format a Computer - wikiHow
*!Good Night (2024) 𝙵ull𝙼ovie Downl𝚘ad Fr𝚎e 1080𝚙, 720𝚙, 480𝚙 H𝙳 HI𝙽DI Dub𝚋ed Fil𝙼yz𝚒lla Isaidub
Die wichtigsten E-Nummern
Transformers Movie Wiki
Syracuse Jr High Home Page
Stolen Touches Neva Altaj Read Online Free
Quality Tire Denver City Texas
Breckie Hill Fapello
CARLY Thank You Notes
Craigslist Greencastle
Top 25 E-Commerce Companies Using FedEx
What Is A K 56 Pink Pill?
Actor and beloved baritone James Earl Jones dies at 93
Directions To Cvs Pharmacy
Dragon Ball Super Super Hero 123Movies
Gamestop Store Manager Pay
Goats For Sale On Craigslist
Darkglass Electronics The Exponent 500 Test
Best brow shaping and sculpting specialists near me in Toronto | Fresha
Latest Posts
Article information

Author: Neely Ledner

Last Updated:

Views: 6276

Rating: 4.1 / 5 (62 voted)

Reviews: 85% of readers found this page helpful

Author information

Name: Neely Ledner

Birthday: 1998-06-09

Address: 443 Barrows Terrace, New Jodyberg, CO 57462-5329

Phone: +2433516856029

Job: Central Legal Facilitator

Hobby: Backpacking, Jogging, Magic, Driving, Macrame, Embroidery, Foraging

Introduction: My name is Neely Ledner, I am a bright, determined, beautiful, adventurous, adventurous, spotless, calm person who loves writing and wants to share my knowledge and understanding with you.