Use of Color > Perform Audit > Create
With &896, we will perform an audit of GitLab to ensure that we are following standard WCAG standards in terms of Use of Color.
1.4.1 Use of Color: Color is not used as the only visual means of conveying information, indicating an action, prompting a response, or distinguishing a visual element. (Level A)
Prep
Not all features are accessible on GitLab.com, such as the admin area. For this reason, it is helpful to set up your local environment in order to perform your audit. This will allow you to perform actions and simulate different interactions, such as form errors, success messages, etc. To get started:
-
Configure two local GitLab Development Kit instances -
Create a list detailing each page and/or area that relates to your individual stage group -
Ensure you are including features that may only be in higher tier subscriptions (EE codebase)
-
Audit
-
Using GDK (CE and EE), review each page/area to ensure that color is not solely used to: -
Convey information -
Indicate an action -
Prompt a response -
Distinguish a visual element
-
-
Create issues in either CE or EE, depending on whether it relates specifically to a higher tier feature. -
Attach it to the Create sub-epic. If the issue expands across all of GitLab, attach it to the top-level epic if one does not already exist.
-
-
Determine a solution for each created issue -
Work with your PM to discuss found issues and schedule accordingly -
Run the following SQL query in Periscope to find which URLs are most visited on GitLab.com
-
Page views per URL in March 2019 on GitLab.com
SELECT date_trunc('month', PAGE_VIEW_START) AS month,
COUNT(PAGE_URL) AS page_views
FROM analytics.snowplow_page_views
WHERE PAGE_VIEW_START > '2019-03-01'
and PAGE_VIEW_END < '2019-04-01'
and PAGE_URL LIKE '%merge_requests/new%'
GROUP BY 1
ORDER BY 1
Source Code group
-
Source Code Management (Docs; Feature list) -
Repository -
Import projects/repos -
Export project -
Files -
Commits -
Branches -
Tags -
Contributors -
Graph -
Compare -
Charts -
Locked Files
-
-
File finder -
Push rules -
Remote repository mirroring -
Restrict SSH Keys -
Protected branches -
Xcode Integration -
Activity Stream -
GPG Signed Commits -
Git LFS -
Private commit email -
Instance file templates -
Group file templates
-
-
Code Review/Merge requests (Docs; Feature list) -
Description Templates -
Award emojis -
System notes (title, description, and other attribute changes) -
Quick actions -
Custom notifications -
Todos -
Jira Integration -
Jira Issues Integration -
Jira Development Panel Integration -
Create new branches/MRs from issues -
Allow edits from upstream maintainers in a fork -
First time contributor badge -
Fast-forward merge with option to rebase -
Squash and merge -
Jenkins CI Integration -
Merge approvals -
Merge conflict resolution -
Merge when pipeline succeeds -
Revert specific commits or a merge request from the UI -
Cherry-picking changes -
Automatically close issue(s) when a merge request is merged -
Configurable issue closing pattern -
Work in Progress merge requests (WIP) -
Code owners -
Discussions
-
Knowledge group
-
Design management -
Wiki
Editor group
https://colororacle.org/ is a helpful tool to utilize during the audit process. Change pages to greyscale to simulate an experience with no color. To help get you thinking, the following are some common problems (not necessarily related to GitLab):
- Text links have no visual cue other than color
- Required fields are only indicated by the use of red
- “Mary's sales are in red, Tom's are in blue"
- Using color to indicate that a database entry has been updated successfully
- Using highlighting on form fields to indicate that a required field had been left blank