Find the right digital tools for your nonprofit. Download our free guide today!

Since 1986, Prism Health North Texas (PHNTX) has been advancing the health of the North Texas communities by providing access for care and services to people living with HIV. Our custom WordPress website solution utilizes accessibility best practices, ensuring that users with disabilities can access essential information.

Prism Health North Texas Forms

Intentional Form Design

At the onset of this project, we worked with the PHNTX team to identify the web forms that would capture important information from their constituents and subscribers. In the design and development stages, we thought strategically about the areas tied to the field labels, highlights, and set appropriate color contrast to support the core constructs of each form.

The email field in the simple sign-up form includes a ‘YOUR EMAIL’ label. This feature increases accessibility because there is no ambiguity about what needs to be typed into the box. Screen readers can also interpret this text for users who have vision impairments. Another feature is a highlight box that rotates among the different fields to note which one is currently active or in use. The easier it is to see which field is being typed in, the more accessible the site will be to an array of users.

Prism Health North Texas Color Contrast

Check the Contrast

As we discussed in this blog post about smart web design choices, color contrast is another important component of website accessibility. People with specific sensitivities or color blindness should be considered when choosing colors for text and backgrounds. Sticking within the brand while prioritizing contrast and white space between sections is the critical balance to strike.

During the design process, it’s also a good idea to use a color checker to make sure that your design syncs with accessibility needs on all devices. With a rainbow of colors to choose from, we designed the PHNTX site to have appropriate color contrast while sticking to the organization’s brand guidelines.

Say Yes to Alt Text

Alt-text refers to image descriptions that are added in the backend of the website. The site has been built in a way that makes it easy for the PHNTX team to update because the Alt-text field is available whenever they upload an image to their WordPress website. Alt-text is important for two reasons. First, users who have vision limitations use screen readers that dictate the content of your site. The devices are equipped with the ability to scan images and read aloud the alt text. Without it, there would be no way to translate the content of images. Second, sometimes images do not load due to slower internet speeds.

One way to counteract this is to optimize your images and upload smaller ones. Still, it’s important that image content is available to everyone, regardless of their access to high-speed internet.

Tri Truong, Marketing Manager:

It was great working with Firefly Partners on our new website. They really listened to our needs and developed a back end that’s easy to update and maintain.

quote icon
Prism Health North Texas Responsive Site

Text and Images: Keep 'Em Separated

Another accessibility practice relates to the trend of uploading images to a website where text sits over the image. The main accessibility issue here is that screen readers are unable to read this text, which means some individuals may be missing out on key pieces of content across the site.

For Prism’s homepage sliders, we created a simple process for them to upload an image and then type in the desired text into a custom field. Not only is this text readable by screen readers, but it’s also designed for mobile responsiveness with a different layout, ensuring that the text is legible on small devices.

Visit The Site >
Prism Health North Texas Content Types

Get Your Headings Right

You may think of the heading styles that are built into your site (i.e., H1, H2, H3, etc.) as being a cosmetic feature. While they do provide larger and bolded text options, they also give helpful structure to the content across your site and pages. As we explain in this blog post about Content Strategy proper heading format helps accessibility because it is recognizable by screen readers.

Section headings also allow your users to scan articles and find exactly what they need. Assigning the right heading formats within the overall content give additional context and is simple for the Prism team as it requires no knowledge of HTML.

Prism Health North Texas Skip to Content Button

No Mouse in the House

There are a variety of reasons why a person may be unable to use a mouse to navigate a website, from physical limitations to injuries to vision impairment. A feature we added to the Prism website that enables these individuals to have full access to your site’s content is keyboard navigation. Users can hit the tab key to move between different links on the website and a blue rectangle appears to indicate which link is being activated.

A skip-to-content button appears initially when a user hits the tab key, meaning visitors don’t have to tab through the entire navigation on each page. They can quickly hit tab and then enter to go directly into the content they want.

Patrick DiGiulian

Patrick DiGiulian, Senior Project Manager:

The best thing about building with accessibility in mind is creating a website that can reach a wider audience and reduces friction by individual who may be visiting you site through alternative ways. Additionally, as you prioritize these measures, you will also improve your website’s ranking in search engine results. This means that accessibility benefits your users and your organization’s online presence at the same time.

Accessibility Experts

If you’re ready for a website redesign, let us be your partner in building a site that’s more accessible. From forms, to contrast, to behind-the-scenes tool, we can make it easy for you to maintain a site that can serve a wider audience. Reach out to us today.

Stay Connected