Foundations / Topic guide
Make the next click easy to understand.
A useful link tells someone where it leads before they activate it. The anchor element, a working href, and meaningful visible text do most of the work. Design and scripting should preserve that simple contract.
Link HTML URLUse a link for navigation
An anchor with an href represents a destination. A button represents an action in the current interface, such as expanding a menu. Keeping those elements distinct preserves familiar keyboard behavior and browser features. Avoid clickable containers that imitate links with JavaScript; a real anchor can be copied, opened in a new tab, and understood without the script.
Write labels that survive their context
Describe the resource or the next task instead of repeating “click here.” A label such as “Read the iframe security guide” carries meaning even when a reader encounters it separately. When a linked image is the only content of an anchor, its alternative text needs to provide that purpose. Do not repeat the same destination across several indistinguishable links in a small card.
Make interaction visible
Give links a recognizable appearance, enough spacing, and a clear keyboard focus treatment. Color alone can be difficult to interpret; underline links within prose or provide another persistent visual cue. Let ordinary navigation open in the current tab unless there is a specific reason otherwise. If you choose a new tab, communicate that behavior where the reader can notice it.
<a href="/iframe-html-url/">
Read the iframe embedding guide
</a>Reference: W3C: Understanding link purpose. Examples and review steps above are practical editorial guidance.
Go deeper in the Lab
Build HTML links that people can actually use
Turn link text, keyboard focus, touch targets, and destination behavior into a more dependable reading experience.
Read the full article · 7 minGood questions make better links.
Have a correction, a question, or a topic for the Lab?