Found accessibility errors and suggestions for "Post a job Form".

[viralsampat]

Hello Team,

While checking the "Post a job form" on this ​https://jobs.wordpress.net/post-a-job/ page I found accessibility errors and suggestions.

I have checked this using the google chrome "WAVE" extension.

So, I think that as an enhancement change, it should be fixed.

For better understanding, I have attached its video.

​https://share.cleanshot.com/DB7m7p4SlnyFc8Q14Yfs

Thanks,

[dd32]

To sumarise the video:

• The form <label> elements aren't linked to their <input> elements. This is because the for attribute of the <label> points to the ID of the <input> but they don't have an ID attribute. Eg:

  <label for="first_name">First Name*</label>
  -<input type="text" name="first_name" class="required" required="">
  +<input type="text" name="first_name" id="first_name" class="required" required="">
  

• div.job-help-text, div.post-field-section-subheader, and .post-job label span contrast ratio's are too low for readability. Currently it's 2.8/1.6 contrast, should be >5. Changing these from #999/#BBB to #666 for the colour resolves it, but that then removes the differentiation of the form text to the "help" text.

[coffee2code]

In 12821:

Jobs theme: Add missing 'id' attribute to input fields to associate them with their labels.

Props viralsampat, dd32, coffee2code.
See #6695.

[coffee2code]

In 12822:

Jobs theme: Improve font color contrast ratio.

The reduction of differentiation in font colors is fine since a redesign is in the works.

Props viralsampat, dd32, coffee2code.
See #6695.

[coffee2code]

In 12823:

Jobs plugin: Add missing 'id' attribute to input fields to associate them with their labels.

Also change to late-escape attributes and improve markup construction.

Props viralsampat, dd32, coffee2code.
Fixes #6695.