#️⃣ Link and Buttons in Action
When building a webpage, you'll often need to let users either go somewhere (like another page or website) or take an action (like submit a form or click something). That’s where links and buttons come in.
Master Code Block (This will be used for further examples)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Anchor Tag & Button Tag Example</title>
</head>
<body>
<!--All content to be added here-->
</body>
</html>🔗 The <a> Tag – For Links
The <a> tag (short for “anchor”) is used to create clickable links.
These can take users:
To another website
To another page on your site
To a different section on the same page
Even open their email app
Basic example:
<body>
<h1>Anchor Tag Example</h1>
<p>Click the link below to visit Google:</p>
<a href="<https://www.google.com>">Go to Google</a>
</body>🔘 The <button> Tag – For Actions
Buttons are used when you want something to happen after a click — like submitting a form or triggering a script.
Basic button:
<body>
<h1>Button Example</h1>
<p>Click the button below:</p>
<button>Click Me</button>
</body>💡 Link vs Button — When to Use What?
Use this When you want to...
<a> Take the user somewhere (another page, link, file)
<button> Trigger an action (submit, run a script, etc.)
They may look similar with CSS styling, but their purpose is different.
So in short:
Use <a> for navigation
Use <button> for interactions
Both are essential building blocks when creating user-friendly websites.