At HackerRank, we are continually innovating, creating, and designing to give the candidates of our platform the ability to accomplish more. We fulfill this objective by committing to a diverse and inclusive culture in the hiring space. We comply with the WCAG 2.1 AA Standards to make our content accessible to a broader range of candidates with disabilities, including but not limited to blindness, deafness, cognitive limitations, and others.
Here are some of the key features we provide to ensure that our web content is accessible to all candidates, including those with disabilities.
- Assistive Technology
Make it easier for candidates to see and hear content, including separating foreground from background.
Distinguish Color Easily
- Colour contrast: When the contrast ratio between text and its background is adequate, people with low vision or colorblind are more likely to read the text. E.g., The color of the code and the error messages are in contrast with respect to their backgrounds, as shown in the two images below.
- Non-text contrast: People who have low vision or are colorblind may have difficulty perceiving the state of an element. e.g., whether it has keyboard focus, is selected/checked/pressed, etc., if the contrast between the element boundaries and/or state indicators and its background or adjacent colors is insufficient. When an interactive element's visual boundaries and state indicators have adequate contrast, people who have low vision or are colorblind are more likely to perceive which elements on the screen are interactive and what their current state is. For example, the checkbox has a border that is in contrast with the background.
Operability guarantees that candidates can interact with and fully use the site while taking the test.
Navigation Flow Improvements
- Keyboard accessibility & shortcuts: The website is entirely accessible via keyboard. This change makes navigation for candidates to use a keyboard to access the site. Also, contextual keyboard shortcuts throughout the website help candidates accomplish their tasks faster. For example, keyboard shortcuts related to code execution make it easier for candidates to run or submit their code easily.
- Skip links: Skip links are added throughout the website to help candidates reach the page's main content directly. For example, the candidate can now skip to the 1st question instead of going through the other options (All questions, instructions, etc.)
Seizures and Physical Reactions
- Blinking of Timer: Web pages should not contain anything that flashes more than three times per second. For example, as the candidate approaches the end of the test, the timer blinks once every 1.5 seconds to notify the candidate.
Make the interface components easily discoverable to the candidates.
Discover Code Execution Options: 'Run Code.'
- We are making the options for 'Run Code' and 'Run tests' more discoverable. The two key CTAs for program execution are highlighted in the editor window.
Responsiveness (on Desktop)
Make the website responsive.
- Responsive UI: People with low vision often read content on a desktop computer by scaling content using the browser zoom functionality. If zooming causes content to overlap with other content, candidates with low vision may not be able to see or use that content. We have ensured that content is presented without losing information or functionality even when zoomed to 400%.
- The entire website is compatible with a screen reader. All the alerts and notifications are also accessible to the screen reader. This makes it easier for candidates using screen readers to take the test with no difficulty.