Skip to Main Content
![Banner](//d2jv02qf7xgjwx.cloudfront.net/sites/4631/banner/CUNY_Library_Services_RGB.png)
WordPress Classic Editor Accessibility Instructions
Finding accessible-ready WordPress.Org themes
- Go to https://wordpress.org/themes/
![external link.](//libapps.s3.amazonaws.com/customers/2832/images/external_link.png)
- Click "Feature Filter"
- Check the "Accessibility Ready" box in the "Features" column
- Click "Apply Features"
Page or Post Title
- Page and Post titles should be brief, clear, informative, and unique.
![Screen grab showing where to type in title that screen reader will read outloud.](//libapps.s3.amazonaws.com/customers/2832/images/Add_Title_WP_ce.png)
Use Headings
- Headings help in organizing a web page or post.
- When creating headings in WordPress classic editor make sure to use the actual heading option and don't just make them visually look different by changing font or color.
- When selecting headings, don't use <h1>. Your page or post title is already an <h1> and there should only be one <h1> per page.
![Screen grab of wordpress classic editor showing where to select headings](//libapps.s3.amazonaws.com/customers/2832/images/headings_wordpress_classic.png)
Create Alt-text for Images
- Adding alt-text to your images is an accessibility best practice.
- Making images and graphics "visible" to all users is one of the first principles of accessibility.
- The way you make your image visible to everyone is by adding "alternative text" or "alt-text".
- For people using screen readers or browsing speech-enabled websites alt-text can be read aloud or rendered as Braille.
- Alt-text gives the speech input software users the ability to put focus onto a button or linked image with a single voice command.
- Alt-text allows mobile users to turn images off to help with download speeds or limit data-roaming charges.
- In WordPress classic editor there are several ways to add alt-text to images to your site.
- You can add "default" alt-text to an image so that each time you reuse the image its default alt-text will be attached.
- This greatly increases the odds alt-text won't be overlooked (especially for images in your shared library.)
- You can edit this "default" alt-text on individual pages (option four)
Option 1: Adding Default Alt-text to Image via Media Button
- Select <Add Media> button from within a page or post
- In the "Add Media" pop-up window, select an image already uploaded (you will see a check-mark next to the image you select)
- If you need to upload an image first then, select upload files tab, upload your image and then do step 2.
- Once an image is selected you will see the "Attachment Details" box on the right hand side of your window.
- Type in the image's "Alt-text" in the Alternative Text box.
![Screen grab showing the add media button](//libapps.s3.amazonaws.com/customers/2832/images/Add_media.png)
![Screen grab showing add media window with atachment details](//libapps.s3.amazonaws.com/customers/2832/images/Screen_Shot_2019-02-28_at_10.16.39_PM.png)
Option 2: Adding Default Alt-text to Image via "Media" left side-bar option & "Add New" button
- Select "Media" on the left side-bar
- Click on the <Add New> button located in the "Media Library" window
- Drag & drop image or search computer to upload image
- Once an image is uploaded, select it (you will see a check-mark next to the image you select)
- Once an image is selected you will see the "Attachment Details" box.
- Type in the image's "Alt-text" in the Alternative Text box.
![Screen grab showing selecting Media then Add New Item button](//libapps.s3.amazonaws.com/customers/2832/images/Media_Library_Add_New_Button.png)
Option 3: Adding Default Alt-text to Image via left side-bar option "Media" - "Add New"
- Select on "Media" on the left side-bar to open up drop down menu
- Click on "Add New", located under "Media" and "Library".
- Drag & drop image or search computer to upload image.
- As your image is being uploaded you will see a progress bar saying "crunching".
- After image is uploaded, click on the work "Edit" (located on the bottom right)
- A new window will open, an "Edit Media" window.
- Type in the image's "Alt-text" in the Alternative Text box.
![Screen grab showing how to upload new media and add alt-text.](//libapps.s3.amazonaws.com/customers/2832/images/Upload_New_Media_screen_grab.png)
Option 4: Customizing Alt-text of images on individual pages or posts
- Click <Add Media> button from within a page or post
- In the "Add Media" pop-up window, select an image already uploaded (you will see a check-mark next to the image you select).
- Click on <Insert into page> button.
- Once back on the page or post, click on the image you just uploaded.
- A new editing bar will pop-up
- Click on the pencil "edit" icon
- An "Image Details" page will pop-up.
- Here you can edit the alt-text without changing the "default" alt-text of the image.
![Screen grab showing how to edit an image's default alt-text from within a page or post.](//libapps.s3.amazonaws.com/customers/2832/images/Edit__alttext.png)
How to create Lists
- Do not create lists manually, use the built in formatting.
![Screen grab showing where to select bullet or numbered lists.](//libapps.s3.amazonaws.com/customers/2832/images/listsformating.png)