Table of contents

HTML <base> Tag

What is HTML <base> Tag?

The HTML base tag is used to define a base URL or target for all relative links and resources within an HTML document. It is placed inside the head section and affects how browsers interpret all relative paths on the page.

If you set a base URL, every relative link (like images, stylesheets, or anchor tags) will use that base path. The HTML base tag is important for simplifying URL management and ensuring all links work correctly, especially when the document moves to a different location or folder.

Only one base tag can be used in a single HTML page, and it must be declared before any other relative link or resource reference.

Syntax of the HTML <base> Tag

plaintext
<base href="URL" target="target_window">
</base>

The href attribute defines the base URL, and the target attribute specifies where linked documents will open.

Examples of HTML <base> Tag

Example 1: Basic HTML Base Tag

plaintext
<!DOCTYPE html>
<html lang="en">
<head>
  <base href="https://www.scholar247.com/">
</head>

<body>
  <a href="about.html">About Us</a>
  <a href="contact.html">Contact</a>
</body>
</html>

In this example, all relative URLs such as about.html and contact.html will automatically refer to https://www.scholar247.com/about.html and https://www.scholar247.com/contact.html. This helps avoid repeating the full URL every time.

Example 2: HTML Base Tag with Target Attribute

plaintext
<!DOCTYPE html>
<html lang="en">
<head>
  <base href="https://www.scholar247.com/" target="_blank">
</head>

<body>
  <a href="services.html">Our Services</a>
  <a href="blog.html">Visit Blog</a>
</body>
</html>

In this SEO-friendly example, all links on the page open in a new tab due to the target="_blank" setting. The base href defines the website’s root location, simplifying link management for the entire document.

Attributes of the HTML <base> Tag

The HTML base tag supports two attributes:

• href: Specifies the base URL that will be used for all relative links on the page.
• target: Defines the default target window or frame where linked pages will open. Common values include _self, _blank, _parent, and _top.

These attributes make it easier to control link behavior and ensure consistent navigation across multiple pages.

Best Practices for HTML <base> Tag

• Use only one base tag per HTML document.
• Always place the base tag inside the head section and before any other relative link.
• Use the href attribute to define your main domain or folder structure.
• Be cautious when setting the target attribute globally, as it may cause all links to open in new tabs.
• Test relative URLs after applying the base tag to confirm that all links resolve correctly.

FAQs About the HTML <base> Tag

Q1: What is the purpose of the HTML base tag?

The HTML base tag defines a default base URL and target for all relative links and resources in a webpage, making link management simpler.

Q2: Can I use more than one base tag in a page?

No, only one base tag is allowed in an HTML document. If more than one is included, only the first one will be used by browsers.

Q3: Where should I place the base tag?

The base tag must be placed inside the head section of your HTML document before any other link, script, or resource that relies on relative paths.

Q4: What happens if I don’t use the base tag?

If the base tag is not included, all relative URLs are resolved based on the page’s current location or directory.

Q5: Does the base tag affect SEO?

The base tag itself doesn’t directly impact SEO, but it helps prevent broken links and ensures consistent navigation, which supports a better user experience and site structure.

HTML

Related Articles