Accessibility statement - jobs portal

The University of Sheffield is committed to making its job page website accessible, in accordance with the Public Sector Bodies (Websites and Mobile Applications) (No. 2) Accessibility Regulations 2018.

This accessibility statement applies to the jobs portal pages, which are hosted at https://jobs.shef.ac.uk, are public and part of the University website.

Compliance status

This website is partially compliant with the Web Content Accessibility Guidelines version 2.1 AA standard, due to the non-compliances listed in the report (read the report PDF).

Non-accessible content

The content listed below is non-accessible for the following reason(s):

Non-compliance with the accessibility regulations

We know some parts of this website are not fully accessible and have summarised the report below. You can also view the summary as a spreadsheet here.

The pages referred to are:

• Page 1 - Job Search
• Page 2 - Notes on Search
• Page 3 - Job Search Result
• Page 4 - Application Wizard
• Page 5 - Log on

Screen reader issues

Interactive element cannot be activated with screen reader (iOS)

This can also be found on page 3 (Search results) on iOS, with all the links within the "Search Result: xx Hints" table.

Screen reader cursor not restricted to modal dialog

This can be seen on page 2 (Notes on Search modal) on desktop and iOS, with the modal dialog. Focus is sent to the modal when it is triggered, but the screen reader cursor is not restricted to the modal. The visually greyed out background content can still be accessed.

Screen reader cursor not set onto modal dialog

This can be seen on page 2 (Notes on Search modal) on desktop, with the modal dialog. Keyboard focus is sent to the modal when it is triggered, but the screen reader cursor remains in the visually greyed out background contents.

Screen reader cursor not returned to triggering element

This can be seen on page 2 (Notes on Search modal) on iOS, with the modal dialogue. When closing the modal, the screen reader cursor does not return to the triggering "Notes on Search" link. Instead, the cursor is sent to the "University of Sheffield Jobs" image at the top of the page.

Interactive elements cannot be activated with screen reader

This can be found on page 3 (Search Results) on a desktop, with the expandable "Search Criteria" button that can be expanded to show the selected search criteria. Note, that this is expanded by default, and the search criteria are visible.

However, using a keyboard with NVDA screen reader running, this expandable element cannot be collapsed.

Checkbox elements do not receive screen reader cursor (iOS)

This can be seen on page 3 (Search Results) on iOS with VoiceOver running, with checkboxes within the "Search Result: xx Hits" data table.

Users can tap on a checkbox (they are visually hidden in the first column) next to the job description. This action automatically highlights the entire row, including the checkbox. Following the selection, users can proceed to apply for the chosen job by activating the "Apply" button located below the table.

However, when navigating this table using iOS VoiceOver, the checkboxes (in the first column) do not receive the screen reader cursor.

Images and icons

Informative images have no alt attribute

This can be found on pages 1 and 3 on desktop and iOS, with the "University of Sheffield Jobs" logo on top of the page. The informative logo does not have an `alt` attribute.

Decorative images have no alt attribute

This can be found on pages 1, 3 and 4 on desktop and iOS, with the decorative background image in the header area. This image has no `alt` attribute.

Informative image inappropriately hidden from assistive technology

This can be found on page 5 (Application Wizard log on) on desktop and iOS, with the "University of Sheffield Jobs" informative logo image.

Informative non-text content fails contrast

This can be seen on page 2 (Notes on Search modal) on desktop and iOS, with the "i" icon image. The top half of the icon is a light blue against a white background which has insufficient contrast ratio of 2.8:1.

Note that the bottom half of the icon does pass contrast requirements, but is not enough to fully perceive what the image is.

Non-interactive elements receive keyboard focus

This can be seen on page 2 (Notes on Search modal) on desktop, with the static "i" icon image. This has been implemented with a `tabindex="0"` which places it within the focus order. This is a static image with no functionality, and should therefore not receive keyboard focus.

This can also be seen on page 4 (Application Wizard) on desktop, with all of the static elements on the page, including the headings, paragraphs, images, and so on. These are non-interactive but have been implemented with `tabindex="0"` which places them within the focus order. They are static elements with no functionality, and should therefore not receive keyboard focus.

This can also be seen on page 5 (Application Wizard log on) on desktop, with the "Copyright 2009 University of Sheffield All Rights Reserved " text, and the decorative spacer image at the bottom of the page. These are non-interactive but have been implemented with `tabindex="0"` which places them within the focus order. They are static elements with no functionality, and should therefore not receive keyboard focus.

Informative advisory icon does not have an alternative

This can be found on page 2 (Notes on Search modal) on desktop and iOS, with the informative "i" icon image. This has been implemented as a CSS background element, which is hidden from assistive technology and has no alternative text.

Decorative icon not hidden from assistive technology

This can be found on page 3 (Search Results) on desktop and iOS, with the decorative icon as part of the "Search Criteria" disclosure trigger element.

We have classed this icon as decorative because the information it currently uniquely communicates (the expanded/collapsed state of the disclosure item) should be programmatically defined separately. However, this icon has not been hidden from assistive technology.

This can also be seen on page 5 (Application Wizard log on) on desktop, with the decorative spacer image at the bottom of the page. This spacer image has not been hidden from assistive technology.

Informative error icon does not have an alt attribute

This can be seen on page 5 (Application Wizard log on). The text "error Client, name, or password is not correct; log on again" is preceded by a "!" red cross. The icon visually communicates that the text is an error. This meaning is not explicitly communicated in the text or through a text alternative.

Checkbox elements

Checkbox element cannot be activated with keyboard

This can be seen on page 3 (Search Results) on desktop, with checkboxes within the "Search Result: xx Hits" data table.

Checkbox elements do not receive keyboard focus

This can be found on page 5 (Application Wizard log on) with the "Accessibility" checkbox. This checkbox does not receive keyboard focus.

Content inappropriately hidden which breaks reading order

This can be seen on page 4 (Application Wizard) on desktop and iOS, with the "Yes, I have read the data privacy statement" checkbox. This has been programmatically hidden using the CSS `display: none` attribute.

Custom interactive element boundary has insufficient contrast

This can be seen on page 4 (Application Wizard) on desktop and iOS, with each of the input fields, such as "First Name", "Second Name" and so on. The light grey border against the white input field has an insufficient contrast ratio of 1.8:1.

This can also be seen on page 4 (Application Wizard) on desktop and iOS, with the "Yes, I have read the data privacy statement. ..." checkbox. The light grey border against the off-white background has an insufficient contrast ratio of 1.4:1.

Checkbox element with no accessible name

This can be seen on page 3 (Search Results) on desktop and iOS, with the checkboxes within the "Search Result: xx Hits" data table.

The checkboxes in the first table column within each row have no accessible name.

Checkbox element with no interactive role

This can be seen on page 3 (Search Results) on desktop and iOS, with the checkboxes within the "Search Result: xx Hits" data table.

The checkboxes in the first table column within each row have no interactive role.

Checked element is not programmatically identified

This can be seen on page 3 (Search Results) on desktop and iOS, with selected checkboxes within the "Search Result: xx Hits" data table.

When clicking on any table cell, the row and the checkbox (in the first column) get highlighted using a blue background colour. Users can apply for this job by activating the "Apply" button below the table.

The selected state of the checkbox is not programmatically identified.

Checked element is not programmatically updated when toggled

This can be seen on page 4 (Application Wizard) on desktop and iOS, with the "Yes, I have read the data privacy statement" checkbox. The `checked` value does not update to `true` or `false`, it stays permanently empty.

Lists, dropdowns

Interactive element has the wrong role

This can be found on all pages on desktop, with the "More field help ..." menu item within the application menu that appears when right clicking (or pressing Shift + F10).

Unordered list not marked up semantically

This can be found on all pages on desktop, with the menu that appears when right clicking (or pressing Shift + F10).

Description list not semantically declared

This can be seen on page 2 (Notes on Search modal) on desktop and iOS, with the content under the "General Notes" heading. These are visual term and value pairs, but this description list relationship is not programmatically determined.

This can also be seen on page 3 (Search Results) on desktop and iOS, with the search criteria under the "Full Text Search" and "Search Criteria for Employment Opportunities" headings. These are visual term and value pairs, but this description list relationship is not programmatically determined. Instead, this content uses table semantics inappropriately.

Unordered list not marked up semantically

This can be seen on page 5 (Application Wizard log on), with the "Change Password", "Password Forgotten", and "Contact" links.

These links are visually communicated as being interrelated, unordered list items. However, this structure has not been programmatically determined.

Combobox

Missing or malformed ARIA on select-only combobox

This can be seen on page 1 on desktop and iOS, with the "Search Method" select only combobox. The combobox is not correctly programmatically determined using ARIA, for example:

* `role="combobox"` is not identified on the element that identifies as the input .

* `aria-expanded` is missing to differentiate when the listbox is expanded and collapsed.

* `aria-controls` is missing to identify the element that serves as the popup.

* `aria-activedescendant` is missing to programmatically determine the active option

* The listbox container is missing `role="listbox"`.

* Listbox elements have no `role="option"`.

* `aria-selected` is not defined to differentiate the selected from the unselected options.

* The combobox has no accessible name.

Missing or malformed ARIA on combobox (multi-select)

This can be found on page 1 on desktop and iOS, with the "Job Type:" and "Working Commitments" multi-select comboboxes. The comboboxes are not correctly programmatically determined using ARIA, for example:

 

* `role="combobox"` is not identified on the element that identifies as the input.

* `aria-expanded` is missing to differentiate when the listbox is expanded and collapsed.

* `aria-controls` is missing to identify the element that serves as the popup.

* `aria-activedescendant` is missing to programmatically determine the active option

* The listbox container is missing `role="listbox"` and `aria-multiselectable="true"`.

* Listbox elements have no `role="option"`.

* `aria-selected` is not defined to differentiate the selected from the unselected options.

* The combobox has no accessible name.

Form fields and visual labels are not associated (Combobox)

This can be seen on page 1 on desktop and iOS, with the "Search Method" select only combobox, and "Job Type:" and "Working Commitments" multi-select comboboxes.

Tables

Presentational table exposed to assistive technology (Pages 1 - 5)

This can be found on pages 1, 2, 3 and 4 on desktop, with the menu that appears when right clicking (or pressing Shift + F10). The contents of this menu are contained within a presentational table that is exposed to assistive technology.

Malformed table semantics

This can be seen on page 3 (Search Results) on desktop and iOS, with the "Search Result: xx Hits" table.

* The table headers are contained within the `<tbody>` element, instead of `<thead>` element.

* The table headers start with the` <th>` tag, as expected. However, each table header contains a nested table. For example, the assorted "Job" column header is nested within a table with one row and two columns.

* The "Search Result: 13 Hits" element has been marked up as a table header inappropriately.

Table header tags used inappropriately

This can be seen on page 3 (Search Results) on desktop and iOS, with the "Search Result: xx Hits" data table.

The "Search Result: xx Hints" heading is inappropriately marked up as a table heading. This element does not title any data cells.

Sortable table headers cannot be activated with keyboard

This can be seen on page 3 (Search Results) on desktop and iOS, with the "Search Result: xx Hits" table. All table headers are sortable, for example, the "Job", "Job Type", "Department" and so on.

Each table header, for example the "Job", is inappropriately nested within another table with one row and two columns.

Non-interactive elements receive keyboard focus (table)

This can be seen on page 3 (Search Results) on desktop and iOS, with the first `<th>` table header cell in the header row of the "Search Result: xx Hits" table.

Sortable table headers are not programmatically defined

This can be seen on page 3 (Search Results) on desktop and iOS, with the "Search Result: xx Hits" table. All table headers are sortable, for example, the "Job", "Job Type", "Department" and so on.

Sortable table headers have no role

This can be seen on page 3 (Search Results) on desktop and iOS, with the "Search Result: xx Hits" table. All table headers are sortable, for example, the "Job", "Job Type", "Department" and so on.

Links

Links indicated using colour alone (links with contrast ratio of at least 3:1)

This can be found on page 1 (Job Search Homepage) on desktop and iOS, with the "Supported browsers" and "Notes on Search" default and visited links. The links can be visually identified only by dark blue or dark purple (visited) text on a light grey background, while the surrounding text is black text on a light grey background.

Meaningful visual structure is not represented by reading order

This can be seen on page 4 (Application Wizard) on desktop, with the 'Display Job Advert "Departmental Administrator"' and "Supported browsers" links. They each receive separate focus when tabbing with a keyboard, but are grouped together in the reading order. This presents the two links as a single link, which may be confusing for assistive technology users.

Links indicated using colour alone (links with contrast ratio less than 3:1)

This can be found on page 5 (Application Wizard log on) with the "Register here", "Change Password", "Password Forgotten" and "Contact" links.

These links can be visually identified only by dark blue text on a white background, while the surrounding text is black text on a white background. The dark blue link has an insufficient contrast ratio of 2.6:1 with the black surrounding text.

Regular link text does not have sufficient contrast

This can be seen on page 4 (Application Wizard) on desktop and iOS, with the "Supported browsers" link when it has been visited. The light purple visited link text against the grey background has an insufficient contrast ratio of 4.1:1.

Regular text does not have sufficient contrast on hover

This can be found on page 5 (Application Wizard log on) with the "Register here", "Change Password", "Password Forgotten" and "Contact" links.

When hovering over a link, the orange link on a white background has an insufficient colour contrast ratio of 2.6:1.

Link presented as raw URL

This can be seen on page 3 (Search Results) with "https://www.sheffield.ac.uk/jobs/erecbrowsers (opens in a new window)" link. The link does not have clear and concise link text.

Anchor tag with no href has no role

This can be found on page 1 (Job Search Homepage) on desktop and iOS, with the "Supported browsers" and "Notes on Search" links. These links receive keyboard focus and can be activated, however, links have no `href` attribute, so they have no role.

This can also be found on page 3 (Search results) on desktop and iOS, with all the links within the "Search Result: xx Hints" table. These links open job details in a new window. They can receive keyboard focus and be activated (on desktop), however, links have no `href` attribute, so they have no role.

Plain text reflowing

Reflow requires users to scroll in multiple directions (no exceptions)

This can be found on page 1 (Job Search Homepage) where reflow requires the user to scroll in multiple directions at a screen size of 1280 x 1024px and 400% zoom.

This can also be found on page 2 (Notes on Search modal) where reflow requires the user to scroll in multiple directions at a screen size of 1280 x 1024px and 400% zoom.

This can also be found on page 4 (Application Wizard) where reflow requires the user to scroll in multiple directions at a screen size of 1280 x 1024px and 400% zoom.

Reflow requires users scroll in multiple directions (with exceptions)

This can be found on page 3 (Search results) on desktop and iOS. When the viewport is adjusted, users are required to scroll up, down, left and right, to access everything. There are search results in a data table on the page which is an exception to the reflow requirement.

However, despite not meeting the exception criteria, the logo image and plain text above the table do not reflow correctly.

Input fields

Form fields and visual labels are not associated (Input fields)

This can be found on page 1 (Job Search Homepage) on desktop and iOS, with the "Keywords" and "Job reference number: " input fields. The visual labels are not associated with their relevant input fields.

This can also be found on page 4 (Application Wizard) on desktop and iOS, with each of the input fields, such as "First Name", "Second Name" and so on. The visual labels are not associated with their relevant input fields.

This can also be found on page 5 (Application Wizard log on) on desktop and iOS, with the "User" and "Password" input fields. The visual labels are not associated with their relevant input fields.

Error message not associated with input fields

This can be seen on page 5 (Application Wizard log on) with the error message pinned to the "User" and "Password" input fields. The error message is not programmatically associated with the input fields.

Autocomplete value inappropriately set to off

This can be seen on page 4 (Application Wizard) on desktop and iOS, with the "First Name", "Second Name", "Last Name", "E-Mail address" and "Repeat E-Mail" input fields that capture personal information.

Colour relied upon to communicate errors

This can be seen on page 4 (Application Wizard) on desktop and iOS, with the "Last Name", "E-Mail address", and "Repeat E-Mail" input fields. Colour is relied on to communicate when these fields are in an error state.

Error messages are not adequately described

This can be seen on page 4 (Application Wizard) on iOS, with the "Last Name", "E-Mail address", and "Repeat E-Mail" input fields. When they are in an error state, the top of page error messages read "Fill all required entry fields". These are too vague as they do not indicate which input field they refer to.

Asterisk indicating required fields is not explained

This can be seen on page 5 (Application Wizard log on), with the asterisk symbol that precedes the "User" and "Password" input field visual labels. These elements are identified as required with an asterisk symbol but the meaning of the symbol is not explained anywhere on the page.

Drag and drop

Drag and drop cannot be adjusted with keyboard

This can be seen on page 2 (Notes on Search modal) with the entire modal dialogue. The modal can be moved around the page with a mouse by selecting the top bar containing the "Notes on Search" heading. However, while this input to use the functionality can be accessed with the keyboard, the modal cannot be moved or adjusted with a keyboard.

Label insufficiently descriptive

This can be found on page 2 (Notes on Search modal) on desktop and iOS, with the drag and drop bar that moves the modal dialog. The only label is the modal heading "Notes on Search", which does not indicate the functionality of the drag and drop element.

Dragging movement does not have a single pointer mode of operation

This can be seen on page 2 (Notes on Search modal) with the entire modal dialogue. The modal can be moved around the page with a mouse or finger by selecting the top bar containing the "Notes on Search" heading. However, this relies on a dragging movement. There are no alternative means of accessing this same dragging functionality.

Headings

Heading not marked up semantically (Pages 1 - 5)

This can be found on page 1 (Job Search Homepage) on desktop and iOS, with the following elements:

* The "Job Search" text is visually the main heading on the page.

* The "Full Text Search" and "Search Criteria for Employment Opportunities" elements categorise content below them.

This can also be seen on page 2 (Notes on Search modal) on desktop and iOS, with the "Notes on Search" and "General notes" text elements.

This can also be seen on page 3 (Search Results) on desktop and iOS, with the following elements:

* The "Job Search Result" is visually the main heading on the page.

* The "Search Criteria" expandable element missing heading semantics.

* The "Full Text Search" and "Search Criteria for Employment Opportunities" under the "Search Criteria" expandable heading are not marked up.

* The "Search Result: 36 Hits" element categorises the table content below. It has been inappropriately marked up as a table heading.

This can also be seen on page 4 (Application Wizard) on desktop and iOS, with the "Have you already registered with us?" and "Is this your first visit to our career pages?" text elements.

Heading not marked up semantically (Disclosure)

This can be found on page 3 (Search Results) on desktop and iOS, with the "Search Criteria" disclosure. This disclosure title is not declared semantically as a heading level 2.

Buttons

Button element has no role (Pages 1 - 5)

This can be found on page 1 (Job Search Homepage) on desktop and iOS, with the "Search" and "Clear Selection" buttons. These elements receive keyboard focus and can be activated, however, the button role is not programmatically defined for the interactive elements.

This can also be found on page 2 (Notes on Search modal) on desktop and iOS, with the "Close" button. This element receives keyboard focus and can be activated, however, the button role is not programmatically defined for the interactive element.

This can also be found on page 2 (Notes on Search modal) on desktop, with the drag and drop button. This element receives keyboard focus, however, the button role is not programmatically defined for the interactive element.

This can also be found on page 3 (Search Results) on desktop and iOS, with the below elements. These elements receive keyboard focus and can be activated, however, the button role is not programmatically defined for the interactive elements.

* The "Return to Search" buttons on the top and bottom of the page.

* The "Search Criteria" expandable button.

* The "Apply" button

This can also be found on page 4 (Application Wizard) on desktop and iOS, with the "Register and Apply" button. This element receives keyboard focus and can be activated - however, the button role is not programmatically defined for the interactive element.

Interactive elements with no accessible name

This can be found on all pages on desktop, with the "More field help ..." menu item within the application menu that appears when right clicking (or pressing Shift + F10).

Expandable element is not programmatically identified

This can be found on page 3 (Seach Results) on desktop and iOS, with the expandable "Search Criteria" button. The button can be activated to expand and collapse the search criteria. The expanded and collapsed states are not programmatically identified.

Note, that:

* The expandable element uses a `title` attribute to communicate the expandable state. However, this state is not communicated to all assistive technologies, for example, VoiceOver.

* The expandable element has no interactive button role.

* The expandable heading is not marked up as a heading.

Disabled element is not programmatically identified

This can be found on page 3 (Search Results) on desktop and iOS, with the "Apply" button at the bottom of the table. This button is disabled until users select a job in the table. The disabled state is not programmatically identified.

This can also be found on page 4 (Application Wizard) on desktop and iOS, with the "Register and Apply" button at the bottom of the form. This button is disabled until users select the "Yes, I have read the data privacy statement. ..." checkbox. The disabled state is not programmatically identified.

Other interactive elements

Focus order includes off-screen interactive elements

This can be seen on page 4 (Application Wizard) on desktop, with an off-screen element above the "Register and Apply" button.

Interactive element has the wrong role

This can be found on all pages on desktop, with the "More field help ..." menu item within the application menu that appears when right clicking (or pressing Shift + F10).

Page code and structure

Page has no lang attribute

This can be found on page 5 (Application Wizard log on). The page has no `lang` attribute declared.

Elements have invalid nesting (Pages 1 - 5)

This can be found on page 1 (Job Search homepage), where there are instances of invalid nesting.

This can also be found on page 2 (Notes on Search modal), where there is an instance of invalid nesting.

This can also be found on page 3 (Search results), where there are instances of invalid nesting.

This can also be found on page 4 (Application Wizard), where there are instances of invalid nesting.

Elements have missing start or end tags

This can be found on page 5 (Application Wizard log on). The page is missing the `doctype` element.

iFrame has no title

This can be found on page 2 (Notes on Search modal) on desktop and iOS. The entire modal is contained within an `<iframe>`, which has no `title` attribute and therefore no accessible name.

Disproportionate burden

The non accessible content pages (read the report PDF) for which the disproportionate burden exemption, within the meaning of the accessibility regulation is being temporarily invoked.  

Due to the scale of the work, the need for external support and staff from across the University to address the non-compliant job web page content it is not feasible to make the current system WCAG 2.1 AA compliant, whilst undertaking a full implementation of a replacement eRecruitment system (including job web pages) and doing so would be a disproportionate burden.

The replacement eRecruitment project is in progress and due to complete by 16 December 2024.

Preparation of this accessibility statement

This statement was prepared on 8 July 2024.

This website was last tested on 21 June 2024 against the WCAG 2.1 AA standard.

The test was carried out by AbilityNet in June 2024.

Read the full accessibility test report

Feedback and contact information

If you find any problems not listed on this page or included in this report or think we’re not meeting accessibility requirements, email jobs@sheffield.ac.uk to report these issues.

If you need information on this website in a different format like accessible PDF, large print, easy read, audio recording or braille, email jobs@sheffield.ac.uk

We’ll consider your request and get back to you.

Enforcement procedure

The Equality and Human Rights Commission (EHRC) is responsible for enforcing the Public Sector Bodies (Websites and Mobile Applications) (No. 2) Accessibility Regulations 2018 (the ‘accessibility regulations’).

If you’re not happy with how we respond to your complaint, contact the Equality Advisory and Support Service (EASS).