Learn More About Web Accessibility

Monday, August 8, 2022

The University of Pennsylvania is committed to providing equal access to information, programs, and activities by making our web pages accessible to everyone, including people with disabilities.

Web Content

When creating web content is such an important role for maintaining accessibility on the web.  Below are some accessibility web tips:

Use proper heading structure

When you’re creating a web page full of content, think of it as a typical Word document.  You would want to title your document, this would be the <h1> in HTML, or Heading 1 in WordPress, as your primary heading.  Then within the document, you would have sub-sections, this would be sub headings in HTML like <h2>, <h3>.  It is important not to lead off a page with a sub heading, like an <h2> and always lead off with <h1>.

When using WordPress to manage your website, within the format box in the page editor toolbar, <h1> will be Heading 1, <h2> will be Heading 2, etc. 

An image highlighting the format section within WordPress to change your paragraph to a heading

When you create or manage a page in WordPress, the title of your page will automatically give your page an <h1>.  After you give your page a title, you can use sub headings to section and grouping your content.  Avoid using headings for styling.  It is also important not to skip a heading level, Heading 3 should follow a Heading 2, and never directly after a Heading 1.

Keep hyperlinks in context

It is important to describe a hyperlink to your audience.  When creating a link to another page, try to keep context like “learn more about us” instead of “click here.”

Describe your images with alternative text

Alternative text provides a textual alternative to non-text content in web pages.  This will be read by screen readers, allowing the content of the image to be accessible to visitors with visual or cognitive disabilities.  Every image must have an ALT attribute.  If the image is purely decorative, an empty ALT attribute can be provided (e.g. ALT=””).

When using WordPress to manage your web page, when you upload an image, there is a section to provide alternative text.  Use this to provide a description of your image.  You only need to set it once and then whenever you insert this image going forward, it’ll automatically bring over that alternative text.

An image highlighting the Alternative Text field when uploading an image in WordPress

Additional resources

Additional information and guidance on accessibility can be found on the following Penn websites