User Tools

Site Tools


accessibility

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revisionPrevious revision
Next revision
Previous revision
accessibility [2023/07/31 15:58] – ↷ Page moved from playground:accessibility to accessibility jsmithaccessibility [2025/01/12 10:44] (current) – [Alt Text for Images] jsmith
Line 13: Line 13:
 Select the Accessibility Checker icon in the toolbar to run the process on your page. Select the Accessibility Checker icon in the toolbar to run the process on your page.
  
-{{:playground:a11y-checker1.png|Accessibility Checker Icon}}+{{a11y-checker1.png|Accessibility Checker Icon}}
  
 The Accessibility Checker presents issues with each item in the editor one at a time. For many issues, the Accessibility Checker gives you a Quick fix option. If a Quick fix is not available, the checker will describe what needs to be done to fix the issue. The Accessibility Checker presents issues with each item in the editor one at a time. For many issues, the Accessibility Checker gives you a Quick fix option. If a Quick fix is not available, the checker will describe what needs to be done to fix the issue.
  
-{{:playground:a11y-checker2.png|Accessibility Checker Quick FIx}}+{{a11y-checker2.png|Accessibility Checker Quick FIx}}
  
 ===== Alt Text for Images ===== ===== Alt Text for Images =====
Line 23: Line 23:
 Anywhere that the Toolbar appears, you have the option to include images in your pages. When adding images, it is important to include short, meaningful, descriptive text in the%% %%**Alternative Text**%% %%box of the **Image Properties** dialog. This helps users with screen readers better understand the content on the page. Anywhere that the Toolbar appears, you have the option to include images in your pages. When adding images, it is important to include short, meaningful, descriptive text in the%% %%**Alternative Text**%% %%box of the **Image Properties** dialog. This helps users with screen readers better understand the content on the page.
  
-{{:playground:ckeditor-image-alt-text.png|Image properties dialog example}}+{{ckeditor-image-alt-text.png|Image properties dialog example}}
  
 +:!:  New in 3.13.  It has always been possible to add Alt Text or captions to images inserted through the Toolbar, but it is now possible to do this when you add an image through an editor field, see example below;
 +{{ :image_upload_3.13.png?400 |}}
 ===== Audio Transcripts ===== ===== Audio Transcripts =====
  
Line 33: Line 35:
 Several page types have the transcript option available in the **Narration Property** as shown below. The text area below the audio file selection field allows you to enter or copy and paste a transcript of the narration content. Several page types have the transcript option available in the **Narration Property** as shown below. The text area below the audio file selection field allows you to enter or copy and paste a transcript of the narration content.
  
-{{:playground:narration-property.png|Narration Property example}}+{{narration-property.png|Narration Property example}}
  
 ==== Audio Slideshow > Transcript Property ==== ==== Audio Slideshow > Transcript Property ====
Line 39: Line 41:
 In addition to the **Narration Property** above, the **Audio Slideshow** page type also has a separate **Transcript Property**. When added to the page, the **Transcript Property **provides a text area to enter or copy and paste a transcript for the audio slideshow content. In addition to the **Narration Property** above, the **Audio Slideshow** page type also has a separate **Transcript Property**. When added to the page, the **Transcript Property **provides a text area to enter or copy and paste a transcript for the audio slideshow content.
  
-{{:playground:audio-slideshow-transcript.png|Example Audio Slideshow Transcript Property}}+{{audio-slideshow-transcript.png|Example Audio Slideshow Transcript Property}}
  
 ==== Gap Fill > Audio Feedback Property ==== ==== Gap Fill > Audio Feedback Property ====
Line 45: Line 47:
 The **Gap Fill **page type also has an **Audio Feedback **optional property, in addition to the **Narration Property **already mentioned, and you can add a transcript here. The **Gap Fill **page type also has an **Audio Feedback **optional property, in addition to the **Narration Property **already mentioned, and you can add a transcript here.
  
-{{:playground:gap-fill-audio-feedback.png|Gap fill Audio Feedback and Narration properties}}+{{gap-fill-audio-feedback.png|Gap fill Audio Feedback and Narration properties}}
  
 ===== Colour Contrast ===== ===== Colour Contrast =====
Line 55: Line 57:
 For additional guidance on the use of colour, please see the [[usingcolour|Using Colour]] page in this wiki. For additional guidance on the use of colour, please see the [[usingcolour|Using Colour]] page in this wiki.
  
 +{{tag>pagetype all_pages}}
accessibility.1690819101.txt.gz · Last modified: 2023/07/31 15:58 by jsmith