Skip to content

Job listing location and date posted text color contrast is too low #2911

@tleffler

Description

@tleffler

Describe the bug
The job listing location and date posted text color contrast is too low. With a text color of #999999 (medium gray) on a background color of #ffffff (white), the color contrast ratio is only 2.85:1, which does not meet accessibility guidelines. See WCAG 2.1/2.2 Level AA: 1.4.3 Contrast (Minimum).
This is a problem for state and federal sites like mine, which need to establish web accessibility compliance by April 2026. See https://www.ada.gov/resources/2024-03-08-web-rule/

To Reproduce
Steps to reproduce the behavior:

  1. Go to a published job posting. Also applies to the /jobs search results.
  2. Inspect the job posting location and date posted text at the top of the posting.
  3. Run an accessibility checker against the page. Something like Accessible Web or axe DevTools will work.
  4. See the accessibility results.

Expected behavior
The color contrast should be 4.5:1 or higher. Changing the text color to a darker gray of at least #767676 or darker will get to that ratio. You can use a contrast ratio tool to help: https://webaim.org/resources/contrastchecker/
Edit ./wp-job-manager/assets/dist/css/frontend.css (job listing page)

  • Entry for ".single_job_listing .meta li"

Edit ./wp-job-manager/assets/dist/css/frontend.css (job search & results page)

  • Entry for "ul.job_listings li.job_listing a div.position .company"
  • Entry for "ul.job_listings li.job_listing a div.location"
  • Entry for "ul.job_listings li.job_listing a .meta"

You might check the frontend.css file for other instances of color: #999

Isolating the problem (mark completed items with an [x]):

  • I have deactivated other plugins and confirmed this bug occurs when only WP Job Manager plugin is active.
  • This bug happens with a default WordPress theme active.
  • I can reproduce this bug consistently using the steps above.

WordPress Environment

  • WordPress Version: 6.9.1
  • WP Job Manager Version: 2.4.0
  • PHP Version: 7.4.24
  • Other important details:

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions