Skip to content

Commit b843cc4

Browse files
deepusnathclaude
andcommitted
Normalize social link aria-labels in TeamMember to include member name
GitHub and personal site links used generic labels ("GitHub Profile", "Personal Site") that are indistinguishable across dozens of team members for screen reader users. Include the member's name like the Twitter/ Threads/Bluesky links already do, and mark the decorative icons aria-hidden so they don't pollute the accessible names. Fixes #8552 Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
1 parent 7b6c3ce commit b843cc4

1 file changed

Lines changed: 7 additions & 7 deletions

File tree

src/components/MDX/TeamMember.tsx

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -113,7 +113,7 @@ export function TeamMember({
113113
aria-label={`${name} on Twitter`}
114114
href={`https://twitter.com/${twitter}`}
115115
className="hover:text-primary hover:underline dark:text-primary-dark flex flex-row items-center">
116-
<IconTwitter className="pe-1" />
116+
<IconTwitter className="pe-1" aria-hidden="true" />
117117
{twitter}
118118
</ExternalLink>
119119
</div>
@@ -124,7 +124,7 @@ export function TeamMember({
124124
aria-label={`${name} on Threads`}
125125
href={`https://threads.net/${threads}`}
126126
className="hover:text-primary hover:underline dark:text-primary-dark flex flex-row items-center">
127-
<IconThreads className="pe-1" />
127+
<IconThreads className="pe-1" aria-hidden="true" />
128128
{threads}
129129
</ExternalLink>
130130
</div>
@@ -135,27 +135,27 @@ export function TeamMember({
135135
aria-label={`${name} on Bluesky`}
136136
href={`https://bsky.app/profile/${bsky}`}
137137
className="hover:text-primary hover:underline dark:text-primary-dark flex flex-row items-center">
138-
<IconBsky className="pe-1" />
138+
<IconBsky className="pe-1" aria-hidden="true" />
139139
{bsky}
140140
</ExternalLink>
141141
</div>
142142
)}
143143
{github && (
144144
<div className="me-4">
145145
<ExternalLink
146-
aria-label="GitHub Profile"
146+
aria-label={`${name} on GitHub`}
147147
href={`https://github.com/${github}`}
148148
className="hover:text-primary hover:underline dark:text-primary-dark flex flex-row items-center">
149-
<IconGitHub className="pe-1" /> {github}
149+
<IconGitHub className="pe-1" aria-hidden="true" /> {github}
150150
</ExternalLink>
151151
</div>
152152
)}
153153
{personal && (
154154
<ExternalLink
155-
aria-label="Personal Site"
155+
aria-label={`${name}'s personal site`}
156156
href={`https://${personal}`}
157157
className="hover:text-primary hover:underline dark:text-primary-dark flex flex-row items-center">
158-
<IconLink className="pe-1" /> {personal}
158+
<IconLink className="pe-1" aria-hidden="true" /> {personal}
159159
</ExternalLink>
160160
)}
161161
</div>

0 commit comments

Comments
 (0)