{Linked:Bug1763106}[Adaptive Cards > Designer] Ensure links are distinguished from surrounding text in a way that does not rely on color (.ac-anchor)

[Raisul123]

Target Platforms

Other

SDK Version

1.5

Application Name

Adaptive Cards

Problem Description

Test Environment:
URL: https://adaptivecards.io/designer/
OS version: 25H2(OS Build 26220.6780)
Edge-dev Version: 143.0.3624.0 (Official build) dev (64-bit)
Tool: Accessibility Insight for web

Pre-Requisite:
Run the below attached JSON file under 'Copy Card Payload editor.'

Repro Steps:

1. Open the above URL on the Edge Dev browser.
2. Navigate to the Select a workspace for Copilot Card using tab key.
3. Run Accessibility insight for web tool.
4. Observe and verify that the Ensure links are distinguished from surrounding text in a way that does not rely on color or not.

Actual Result:
Users relying on visual contrast alone may fail to recognize links within the text, as there are no non-color-based indicators.
• Links are only differentiated from surrounding text by color.
• No additional visual cues such as underlines, or font changes are provided to help users distinguish links from regular text.

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.10/link-in-text-block?application=msftAI)

Expected Result:
Links within the text should be underlined or styled in a way that ensures they are visually distinct, even for users with color vision deficiencies or when viewed in grayscale.
• Links should be clearly distinguishable from surrounding text using visual indicators other than color, such as underlining, bold formatting, or other textual styling.
• Users should be able to recognize links irrespective of their ability to perceive color differences.

Snippet: Learn more

How to fix:
Fix any of the following:
The link has insufficient color contrast of 1.25:1 with the surrounding text. (Minimum contrast is 3:1, link text: #6264a7, surrounding text: #5c5b5b)
The link has no styling (such as underline) to distinguish it from the surrounding text

User Impact:
Users with color vision deficiencies or low vision may not be able to perceive color differences that distinguish links from regular text. If links are not clearly identifiable through alternative means (like underlining or hover effects), these users may miss critical navigation paths or actions. This can lead to confusion, hinder task completion, and reduce the usability and accessibility of digital experience.

WCAG Reference:
https://www.w3.org/WAI/WCAG21/Understanding/use-of-color

Have feedback on bugs logged, please tag bug as “A11yRCA” and add your feedback in the comment section.

Screenshots

Card JSON

{
    "title": "Publish Adaptive Card Schema",
    "description": "Now that we have defined the main rules and features of the format, we need to produce a schema and publish it to GitHub. The schema will be the starting point of our reference documentation.",
    "creator": {
        "name": "Matt Hidinger",
        "profileImage": "https://pbs.twimg.com/profile_images/3647943215/d7f12830b3c17a5a9e4afcc370e3a37e_400x400.jpeg"
    },
    "createdUtc": "2017-02-14T06:08:39Z",
    "viewUrl": "https://adaptivecards.io",
    "properties": [
        {
            "key": "Board",
            "value": "Adaptive Cards"
        },
        {
            "key": "List",
            "value": "Backlog"
        },
        {
            "key": "Assigned to",
            "value": "Matt Hidinger"
        },
        {
            "key": "Due date",
            "value": "Not set"
        }
    ]
}

Sample Code Language

No response

Sample Code

No response