I want to fix the “Non-descriptive link content” warning from my site, whose read-only link is published below. The warning appears at the three social links (the ones with LinkedIn, Stack Overflow and GitHub logos). I tried to read the help, but I don’t understand where, exactly, should I go to fix this error.
I run into a similar issue, and after reading a bit about it I found a solution.
You should go into the settings panel of the link that you are working with, add a custom attribute called “aria-label” and inside the value field add the description.
For example, the LinkedIn link should look like this
I know this is an old topic, but it may help someone else with the same concern.
Fixing “Non-descriptive link content” in Webflow involves ensuring that the link text or content provides clear and meaningful information about the destination of the link. Here are some steps you can follow to address this issue:
Identify the Problem Links:
Go to your Webflow project.
Navigate to the pages or sections where the “Non-descriptive link content” issue has been flagged.
Review Link Text:
Check the text of each link to ensure it clearly describes the destination or purpose of the link.
Avoid generic terms like “click here,” “read more,” or “learn more.” Instead, use descriptive phrases that convey the content or action the user can expect when they click the link.
Update Link Text:
Modify the link text to make it more descriptive and relevant.
For example, instead of using “click here,” you could use “view our services” or “read the latest article.”
Use ARIA Labels (if necessary):
If the link text needs to remain generic due to design constraints, you can use ARIA labels to provide more context.
Add an ARIA label to the link with a more descriptive text, which screen readers will read out to users with accessibility needs.
Check External Links:
For links that lead to external websites, ensure that the link text accurately describes the external content or website.
If necessary, you can provide additional context within the content surrounding the link.
Test and Validate:
After updating the link text, preview the changes in Webflow to ensure they appear correctly.
Test the links on different devices and browsers to make sure they work as expected and provide clear information to users.
Re-publish Your Website:
Once you’ve addressed the “Non-descriptive link content” issues, republish your Webflow website to make the changes live.
By following these steps, you should be able to fix the “Non-descriptive link content” issues in your Webflow project and improve the accessibility and user experience of your website.
