microsoft / vscode-docs

Public documentation for Visual Studio Code
http://code.visualstudio.com/docs
Other
5.69k stars 4.62k forks source link

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) #6057

Closed aniketr99 closed 1 year ago

aniketr99 commented 1 year ago

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:

  1. https://code.visualstudio.com/
  2. https://code.visualstudio.com/updates/v1_62
  3. https://code.visualstudio.com/updates/v1_58
  4. https://code.visualstudio.com/updates/v1_66
  5. https://code.visualstudio.com/updates/v1_57
  6. https://code.visualstudio.com/updates/v1_53
  7. https://code.visualstudio.com/docs/cpp/config-msvc
  8. https://code.visualstudio.com/docs/python/tutorial-django
  9. https://code.visualstudio.com/updates/v1_55
  10. https://code.visualstudio.com/docs/datascience/data-science-tutorial
  11. https://code.visualstudio.com/docs/python/tutorial-flask
  12. https://code.visualstudio.com/updates/v1_65
  13. https://code.visualstudio.com/updates/v1_67
  14. https://code.visualstudio.com/updates/v1_61
  15. https://code.visualstudio.com/updates/v1_64
  16. https://code.visualstudio.com/updates/v1_56
  17. https://code.visualstudio.com/docs/java/java-tutorial
  18. https://code.visualstudio.com/updates/v1_63
  19. https://code.visualstudio.com/updates/v1_54
  20. https://code.visualstudio.com/docs/java/java-build
  21. https://code.visualstudio.com/docs/devcontainers/containers
  22. https://code.visualstudio.com/docs/cpp/config-wsl
  23. https://code.visualstudio.com/api/language-extensions/syntax-highlight-guide
  24. https://code.visualstudio.com/docs/cpp/cpp-debug
  25. https://code.visualstudio.com/docs/editor/refactoring
  26. https://code.visualstudio.com/docs/getstarted/locales
  27. https://code.visualstudio.com/docs/remote/ssh
  28. https://code.visualstudio.com/docs/nodejs/working-with-javascript
  29. https://code.visualstudio.com/docs/remote/wsl
  30. https://code.visualstudio.com/docs/editor/command-line
  31. https://code.visualstudio.com/docs/other/unity
  32. https://code.visualstudio.com/docs/nodejs/nodejs-debugging
  33. https://code.visualstudio.com/docs/getstarted/keybindings
  34. https://code.visualstudio.com/docs/python/python-tutorial
  35. https://code.visualstudio.com/docs/supporting/FAQ#_how-to-disable-crash-reporting
  36. https://code.visualstudio.com/docs/languages/csharp
  37. https://code.visualstudio.com/docs/datascience/jupyter-notebooks
  38. https://code.visualstudio.com/docs/remote/remote-overview
  39. https://code.visualstudio.com/docs/setup/windows
  40. https://code.visualstudio.com/docs/supporting/faq
  41. https://code.visualstudio.com/download
  42. https://code.visualstudio.com/docs/editor/extension-marketplace
  43. https://code.visualstudio.com/docs/setup/setup-overview
  44. https://code.visualstudio.com/docs/languages/html
  45. https://code.visualstudio.com/Search
  46. https://code.visualstudio.com/blogs/2021/10/20/vscode-dev
  47. https://code.visualstudio.com/docs/nodejs/angular-tutorial
  48. https://code.visualstudio.com/learn
  49. https://code.visualstudio.com/docs/editor/whyvscode
  50. https://code.visualstudio.com/docs/getstarted/userinterface
  51. https://code.visualstudio.com/docs/setup/linux
  52. https://code.visualstudio.com/docs/remote/ssh-tutorial
  53. https://code.visualstudio.com/License/
  54. https://code.visualstudio.com/docs/cpp/launch-json-reference
  55. https://code.visualstudio.com/docs/nodejs/reactjs-tutorial
  56. https://code.visualstudio.com/docs/azure/extensions
  57. https://code.visualstudio.com/docs/cpp/config-clang-mac
  58. https://code.visualstudio.com/docs/languages/dotnet
  59. https://code.visualstudio.com/docs/languages/php
  60. https://code.visualstudio.com/docs
  61. https://code.visualstudio.com/docs/editor/workspaces
  62. https://code.visualstudio.com/docs/python/linting
  63. https://code.visualstudio.com/docs/getstarted/themes
  64. https://code.visualstudio.com/docs/cpp/config-linux
  65. https://code.visualstudio.com/docs/python/testing
  66. https://code.visualstudio.com/docs/typescript/typescript-compiling
  67. https://code.visualstudio.com/docs/remote/vscode-server
  68. https://code.visualstudio.com/docs/languages/overview
  69. https://code.visualstudio.com/blogs/2022/12/07/remote-even-better
  70. https://code.visualstudio.com/docs/supporting/troubleshoot-terminal-launch
  71. https://code.visualstudio.com/insiders/
  72. https://code.visualstudio.com/docs/getstarted/introvideos
  73. https://code.visualstudio.com/docs/languages/go
  74. https://code.visualstudio.com/docs/setup/mac
  75. https://code.visualstudio.com/blogs/2022/07/07/vscode-server#main-content
  76. https://code.visualstudio.com/docs/python/jupyter-support-py
  77. https://code.visualstudio.com/blogs/2022/07/07/vscode-server
  78. https://code.visualstudio.com/docs/containers/overview
  79. https://code.visualstudio.com/api/references/theme-color
  80. https://code.visualstudio.com/api/get-started/your-first-extension
  81. https://code.visualstudio.com/docs/remote/wsl-tutorial
  82. https://code.visualstudio.com/docs/python/debugging
  83. https://code.visualstudio.com/docs/java/java-spring-boot
  84. https://code.visualstudio.com/api
  85. https://code.visualstudio.com/docs/nodejs/nodejs-tutorial
  86. https://code.visualstudio.com/updates/v1_68
  87. https://code.visualstudio.com/updates/v1_59
  88. https://code.visualstudio.com/docs/java/java-project
  89. https://code.visualstudio.com/docs/remote/troubleshooting
  90. https://code.visualstudio.com/blogs/2020/12/03/chromebook-get-started
  91. https://code.visualstudio.com/docs/java/java-debugging
  92. https://code.visualstudio.com/docs/python/editing
  93. https://code.visualstudio.com/docs/python/environments
  94. https://code.visualstudio.com/docs/setup/uninstall
  95. https://code.visualstudio.com/updates/v1_69#main-content
  96. https://code.visualstudio.com/updates/v1_60
  97. https://code.visualstudio.com/updates/v1_69

Repro Steps:

  1. Launch website application using URL: https://code.visualstudio.com/
  2. "Home" screen gets open.
  3. 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:

    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:

Screenshot (71)

12-shweta commented 1 year ago

CELA_code.visualstudio.com_WCAG2.1_FEB2020;

Samhitha66 commented 1 year ago

This issue is also observed in the "Visual Studio Code Services [Benchmark] " testpass which has been done in the month of April 2023 Test Configuration: Windows11+Chrome+JAWS Environment: https://code.visualstudio.com/docs Observed throughout the application.

AIConfirmed; #Visual Studio Code Services; #BM_VisualStudioCodeServices_Web_Apr2023;

rzhao271 commented 1 year ago

Should be good now

Samhitha66 commented 1 year ago

@rzhao271 The issue is fixed in all the 95 links except 2 links. https://code.visualstudio.com/docs/nodejs/working-with-javascript https://code.visualstudio.com/download Could you please reopen the issue. Please find the attachment for the reference. image image

Regressed:04-05-23;

gregvanl commented 1 year ago

@Samhitha66 I can't reproduce the Fast Pass failure on the working-with-javascript page and from your screenshot it looks like the page hadn't fully loaded when you ran your scan. That page is using the standard topic template so the recent fix should be on that page. The /download page issue does reproduce and it should be straightforward to fix that custom page

rzhao271 commented 1 year ago

We deployed a change that should fix the issue for the download and Insiders pages.

Samhitha66 commented 1 year ago

@rzhao271 Regressed the issue in the below environment https://code.visualstudio.com/docs/nodejs/working-with-javascript https://code.visualstudio.com/download The issue is fixed. Hence closing the bug. Please find the attachment for the reference.

Closed;

image image