Repository: microsoft/vscode-docs

Issue #6057: A11y_code.visualstudio.com_Homepage_AI4W: Ensure links are distinguished from surrounding text in a way that does not rely on color (#banner-link-updates)
Created: 2023-02-21T07:58:31Z
GitHubTags:
#Accessibility; #WCAG 1.4.1; #link-in-text-block; #A11ySev2; #A11yTCS; #A11yWCAG2.1; #ChromiumEdge; #DesktopWeb; #Win11; #Visual Studio Code; #AI4W; A11y_code.visualstudio.com_WCAG2.1; #A11y_WCAG2.1_FEB2020; #A11yMAS;#CELA_code.visualstudio.com_WCAG2.1_FEB2020;
Environment Details:
Application Name: code.visualstudio.com
#URL:https://code.visualstudio.com/
Browser version: Microsoft Edge Version 110.0.1587.50
Windows Version: Windows11
Note:
Similar issue is also observed in below links:

https://code.visualstudio.com/
https://code.visualstudio.com/updates/v1_62
https://code.visualstudio.com/updates/v1_58
https://code.visualstudio.com/updates/v1_66
https://code.visualstudio.com/updates/v1_57
https://code.visualstudio.com/updates/v1_53
https://code.visualstudio.com/docs/cpp/config-msvc
https://code.visualstudio.com/docs/python/tutorial-django
https://code.visualstudio.com/updates/v1_55
https://code.visualstudio.com/docs/datascience/data-science-tutorial
https://code.visualstudio.com/docs/python/tutorial-flask
https://code.visualstudio.com/updates/v1_65
https://code.visualstudio.com/updates/v1_67
https://code.visualstudio.com/updates/v1_61
https://code.visualstudio.com/updates/v1_64
https://code.visualstudio.com/updates/v1_56
https://code.visualstudio.com/docs/java/java-tutorial
https://code.visualstudio.com/updates/v1_63
https://code.visualstudio.com/updates/v1_54
https://code.visualstudio.com/docs/java/java-build
https://code.visualstudio.com/docs/devcontainers/containers
https://code.visualstudio.com/docs/cpp/config-wsl
https://code.visualstudio.com/api/language-extensions/syntax-highlight-guide
https://code.visualstudio.com/docs/cpp/cpp-debug
https://code.visualstudio.com/docs/editor/refactoring
https://code.visualstudio.com/docs/getstarted/locales
https://code.visualstudio.com/docs/remote/ssh
https://code.visualstudio.com/docs/nodejs/working-with-javascript
https://code.visualstudio.com/docs/remote/wsl
https://code.visualstudio.com/docs/editor/command-line
https://code.visualstudio.com/docs/other/unity
https://code.visualstudio.com/docs/nodejs/nodejs-debugging
https://code.visualstudio.com/docs/getstarted/keybindings
https://code.visualstudio.com/docs/python/python-tutorial
https://code.visualstudio.com/docs/supporting/FAQ#_how-to-disable-crash-reporting
https://code.visualstudio.com/docs/languages/csharp
https://code.visualstudio.com/docs/datascience/jupyter-notebooks
https://code.visualstudio.com/docs/remote/remote-overview
https://code.visualstudio.com/docs/setup/windows
https://code.visualstudio.com/docs/supporting/faq
https://code.visualstudio.com/download
https://code.visualstudio.com/docs/editor/extension-marketplace
https://code.visualstudio.com/docs/setup/setup-overview
https://code.visualstudio.com/docs/languages/html
https://code.visualstudio.com/Search
https://code.visualstudio.com/blogs/2021/10/20/vscode-dev
https://code.visualstudio.com/docs/nodejs/angular-tutorial
https://code.visualstudio.com/learn
https://code.visualstudio.com/docs/editor/whyvscode
https://code.visualstudio.com/docs/getstarted/userinterface
https://code.visualstudio.com/docs/setup/linux
https://code.visualstudio.com/docs/remote/ssh-tutorial
https://code.visualstudio.com/License/
https://code.visualstudio.com/docs/cpp/launch-json-reference
https://code.visualstudio.com/docs/nodejs/reactjs-tutorial
https://code.visualstudio.com/docs/azure/extensions
https://code.visualstudio.com/docs/cpp/config-clang-mac
https://code.visualstudio.com/docs/languages/dotnet
https://code.visualstudio.com/docs/languages/php
https://code.visualstudio.com/docs
https://code.visualstudio.com/docs/editor/workspaces
https://code.visualstudio.com/docs/python/linting
https://code.visualstudio.com/docs/getstarted/themes
https://code.visualstudio.com/docs/cpp/config-linux
https://code.visualstudio.com/docs/python/testing
https://code.visualstudio.com/docs/typescript/typescript-compiling
https://code.visualstudio.com/docs/remote/vscode-server
https://code.visualstudio.com/docs/languages/overview
https://code.visualstudio.com/blogs/2022/12/07/remote-even-better
https://code.visualstudio.com/docs/supporting/troubleshoot-terminal-launch
https://code.visualstudio.com/insiders/
https://code.visualstudio.com/docs/getstarted/introvideos
https://code.visualstudio.com/docs/languages/go
https://code.visualstudio.com/docs/setup/mac
https://code.visualstudio.com/blogs/2022/07/07/vscode-server#main-content
https://code.visualstudio.com/docs/python/jupyter-support-py
https://code.visualstudio.com/blogs/2022/07/07/vscode-server
https://code.visualstudio.com/docs/containers/overview
https://code.visualstudio.com/api/references/theme-color
https://code.visualstudio.com/api/get-started/your-first-extension
https://code.visualstudio.com/docs/remote/wsl-tutorial
https://code.visualstudio.com/docs/python/debugging
https://code.visualstudio.com/docs/java/java-spring-boot
https://code.visualstudio.com/api
https://code.visualstudio.com/docs/nodejs/nodejs-tutorial
https://code.visualstudio.com/updates/v1_68
https://code.visualstudio.com/updates/v1_59
https://code.visualstudio.com/docs/java/java-project
https://code.visualstudio.com/docs/remote/troubleshooting
https://code.visualstudio.com/blogs/2020/12/03/chromebook-get-started
https://code.visualstudio.com/docs/java/java-debugging
https://code.visualstudio.com/docs/python/editing
https://code.visualstudio.com/docs/python/environments
https://code.visualstudio.com/docs/setup/uninstall
https://code.visualstudio.com/updates/v1_69#main-content
https://code.visualstudio.com/updates/v1_60
https://code.visualstudio.com/updates/v1_69

Repro Steps:

Launch website application using URL: https://code.visualstudio.com/
"Home" screen gets open.
Open Accessibility Insight for desktop and check Ensure links are distinguished from surrounding text in a way that does not rely on color (#banner-link-updates).

Issue:
Ensure links are distinguished from surrounding text in a way that does not rely on color (link-in-text-block - https://dequeuniversity.com/rules/axe/4.6/link-in-text-block?application=msftAI)
Target application:
Visual Studio Code - Code Editing. Redefined - https://code.visualstudio.com/
Element path:
#banner-link-updates
Snippet:
Version 1.75
Related paths:
.container > .message
How to fix:
Fix any of the following:
The link has insufficient color contrast of 1.88:1 with the surrounding text. (Minimum contrast is 3:1, link text: #0098ff, surrounding text: #cccccc)
The link has no styling (such as underline) to distinguish it from the surrounding text
Environment:
Microsoft Edge version 110.0.1587.50
====
This accessibility issue was found using Accessibility Insights for Web 2.37.3 (axe-core 4.6.3), a tool that helps find and fix accessibility issues. Get more information & download this tool at http://aka.ms/AccessibilityInsights.
Attachment:

Duplicate issue #6321: A11y_Visual Studio Code Services_Docs Python_Testing_Use Of Color: Links text on the page are not associated with underline/chevron to differentiate from normal text on page.
Created: 2023-05-17T12:15:01Z
GitHub Tags
#WCAG1.4.1; #A11ySev3; #Use Of Color; #A11yTCS; #A11yWCAG2.1; #Chrome; #DesktopWeb; #Win11; #Visual Studio Code Services; #BM_VisualStudioCodeServices_Web_Apr2023;
Environment Details
Application Name: Visual Studio Code Services
URL: https://code.visualstudio.com/
Microsoft Windows 11 Enterprise 10.0.22621 Build 22621
Chrome Version 113.0.5672.93 (Official Build) (64-bit)
Repro Steps

Hit the application URL: https://code.visualstudio.com/
Tab till "Docs" link and press enter.
Tab till "Python" link in the left navigation and press enter.
Tab till "Testing" link which is present under the python and press enter.
Observe that Link text on the page are not associated with underline/chevron to differentiate from normal text on page.

Actual Result
Link text on the page are not associated with underline/chevron to differentiate from normal text on page.
Note:
Similar issue is observed throughout the application for link texts and for on-page heading links as well.
Expected Result
Link text on the page should be associated with underline/chevron to differentiate from normal text on page.
User Impact
Color-blind users will not be able to distinguish between normal text and link text on the page, so they face difficulties to access the links easily.
Attachment:

Closing comment (2023-05-19T21:20:24Z): I believe this issue is a duplicate of #6057. That issue states the following:
How to fix:
Fix **any** of the following:
The link has insufficient color contrast of 1.88:1 with the surrounding text. (Minimum contrast is 3:1, link text: #0098ff, surrounding text: #cccccc)
The link has no styling (such as underline) to distinguish it from the surrounding text

The colour contrast of the links should be at least 3:1 now, thus meeting the requirements above.