The Lost Feed

🌐Old Internet

What Nobody Tells You About Links and Buttons

Discover the forgotten truth about links and buttons in web design. Learn why choosing the right HTML element matters for better user experience and accessibility.

9 views·4 min read·Jul 6, 2026
When going somewhere does a thing: on links and buttons

Have you ever clicked something on a website, expecting it to take you to a new page, only for it to do something else entirely? Or maybe you clicked a button, thinking it would perform an action, but it just moved you somewhere new?

This common confusion happens more often than you might think. It points to a simple, yet often overlooked, rule in how websites are built. Understanding this rule can make the internet a much smoother place for everyone.

The Basic Rule We All Forget

At its heart, the internet is built on a few core ideas. One of the biggest is how we move around and interact with things. We either go somewhere, or we do something.

This simple difference is crucial for good web design. It tells us whether to use a link or a button, and getting it wrong can lead to frustration for anyone using a website.

What

Makes a Link a Link?

A link, or an "anchor" tag in the language of the web (HTML), is made for one purpose: navigation. When you click a link, your browser's job is to take you to a different place. That place could be another page on the same website, a totally different website, or even just a different spot on the current page.

Think of a link like a road sign. It points you to a destination. You expect to arrive there when you follow its direction. This is its fundamental job, and it does it well.

The Browser's Job

When you click a proper link, your web browser knows exactly what to do. It loads a new page, updates the address in your bar, and lets you go back with the "back" button. This predictable behavior is why links are so powerful and easy to understand for everyone.

What

Makes a Button a Button?

In contrast, a button is designed to perform an action. It does not typically take you to a new page. Instead, it triggers an event on the current page.

Examples include submitting a form, opening a menu, playing a video, or saving some settings. When you click a button, you expect something to happen right then and there, without leaving your current view.

"A link takes you on a journey. A button makes a change." This simple thought helps clarify their distinct roles in web interactions.

The Problem with Mixing Them Up

Using a link when you should use a button, or vice versa, creates problems. For regular users, it is confusing. They click something, and it does not behave as they expect. This can make a website feel broken or poorly designed.

More importantly, it hurts accessibility. Many people use assistive technologies like screen readers or keyboard navigation. These tools rely on the correct use of HTML elements to understand a page.

Why Accessibility Matters

Screen readers announce links differently than buttons. If a button is disguised as a link, a screen reader might tell a user, "Link: Add to Cart," when it should say, "Button: Add to Cart." This misleads the user about what will happen next. Similarly, keyboard users expect to use the Enter key for links and the Spacebar for buttons. When these elements are swapped, it breaks their expected interactions.

Real-World Examples Gone Wrong

Imagine an online store. If the "Add to Cart" feature is built using a link, clicking it might reload the entire page, which is slow and clunky. It should be a button that updates the cart without leaving the product page.

Conversely, if a "Read More" button on a blog post actually takes you to the full article, that is also a mistake. "Read More" is about navigating to more content, so it should be a link. These small missteps accumulate, making the web harder to use.

Getting It Right

So, how do you decide? It comes down to a simple question:

  • *Is the user going somewhere new?

  • If yes, use a *link

  • (<a>).

  • *Is the user performing an action on the current page?

  • If yes, use a *button

  • (<button>).

This distinction is fundamental. It ensures that everyone, regardless of how they access the internet, has a clear and predictable experience. Making the right choice means building a more intuitive and inclusive web.

These seemingly small choices in web design have a huge impact on how we all experience the internet. By understanding the core difference between links and buttons, we can build and use websites that are clearer, more accessible, and simply work better for everyone. It is a simple rule, but one that makes a world of difference.

How does this make you feel?

Comments

0/2000

Loading comments...