How aria-label works with ADA Accessibility in HTML

aria-label can be a very powerful tool to use to make sure your site is ADA accessible. I'll break down how I used it on a series of links on a website.

Using aria-label for link purpose:

Video on how I made the social media links:

- - - - - -

⤵ Download ALL of my source codes & more!

Introducing ADWC PRO

ADWC Pro provides you with:

• Access to all the source codes for ALL projects
• Bootstrap Bootstrap online course (retail $79) w/ supplied source code
• All future online courses (Gatsby v5 course coming soon)
• Updates of ADWC and the web dev business
• and more!

Price:
Just $6/mo. or $49/year (32% off monthly)

-------

Got a question for me?

[deniseerazmus]

FYI - Since you have the link within an <a> you do not need to put "link to" all you would need to put is facebook etc. When you use on screen reader on your code you would hear "link" "link to facebook". The screen reader knows it is a link and you do not need to repeat this information.

[diegogaldames]

I have a question, is it better to use in <nav> or <a>, or both?

[soulafm]

Keep going, I really love your channel
your videos help me a lot

[TheFeelGoodKid]

Can you share a link to the run audit website checker

[Leonhart]

What's the difference between aria label and alt tag? Thanks for the informative video!

[SpookySkeletons]

How do I do this on a wordpress website?

[ham]

Doesn’t have an a tag already announce on a screen reader that it’s a link. Would it not read link link to twitter

[JosephDelsoin-vf]

Thanks for sharing! Noticed that making the update didn't improve your SEO score....Prior to you making the update your SEO score was a 91 and still the same score after the update.

[terezakoudelkova]

Hi, I don't think there's such a thing as "ADA accessible". It's either accessible or not. ADA compliant, or not. WCAG compliant or not.

[MertDiker]

this accessibility for what, is it for the people that have disabilities.