How to solve UX vs screen reader accessibility problem?

I’m currently studying web development and semantic HTML markup. A tutorial I followed explained that anchor texts like “Click here” or “Read more” aren’t descriptive enough for visually impaired users relying on screen readers, so it’s better to wrap the descriptive text in anchor tags instead of the call to action.

For example, <a href="">Click here</a> to know more information about the trips. is not recommended according to the tutorial, and it should be: Click here to know more <a href="">information about the trips</a>. This causes a problem where sighted users might try to click on “Click here” but nothing happens.

How can we address this UX issue to ensure both visually impaired and sighted users can access the page seamlessly?

You’re right on wrapping the descriptive text in anchor tags over the call to action. I think the answer to your question comes down to the content on the page you’re working on, and how you want it to be. We don’t always need to write an entire sentence with a call to action - sometimes it can just be a <a href"">Information about trips. But that might not be practical in all cases either. I think these things can only be determined on a case by case basis. As long as you have accessibility in mind, you’ll figure out what works and what doesn’t.