Home > Tutorials > HTML/CSS/JS Tutorials > Understanding The <BASE> Tag in 2018

Understanding The <BASE> Tag in 2018

The <BASE> tag has been a part of HTML for decades now, and little has changed with the tag itself as we’ve transition to 2018. At its core, the <BASE> tag creates a document base – off which relative hyperlinks in the body of the document will go.

Change The Base URL For All Links On A Page

By default, all relative links on a website will act off the domain on which they are called. For example, if I added  relative link to /contact from this page Рthe base would be https://rapidpurple.com.

<head>

</head>

<a href="/contact">/contact</a>

Demo: /contact

However if I were to define the base tag with an HREF attribute set to https://mediaexplode.com, watch what happens to the same link:

<head>
<base href="https://mediaexplode.com/">
</head>

<a href="/contact">/contact</a>

Demo: /contact

Whenever you set the <BASE> tag, all relative links on that page will refer to the specified URL rather than the server on which the page is hosted. Take note that this also applies to same-page anchor tags, like #anchor, or ?anchor. As such – combining <BASE> tags with various javascripts is generally not a great idea.

Changing The Target For All Links On A Page

The <BASE> tag has another great purpose Рit can be used to easily set all links on a page to open in a new window, or a specific frame. This can be accomplished using the second attribute supported by <BASE>, the target attribute.

For example, if we wanted to make all links open in a new window, we could set our target attribute to _blank, just like we would for a regular link.

<head>
<base target="_blank">
</head>

Just keep in mind that there can be only be one defined <BASE> within a document, and it must be inside the <HEAD> element.

About Michael Boguslavskiy

Michael Boguslavskiy is a full-stack developer & online presence consultant based out of New York City. He's been offering freelance marketing & development services for over a decade. He currently manages Rapid Purple - and online webmaster resources center; and Media Explode - a full service marketing agency.

Check Also

How To Check Which Linux Shell You’re Using

The majority of Linux based hosting servers generally use the BASH shell, or Bourne Again ...

Like every other website, this site uses cookies to analyze our traffic. Cookies may also be utilized by our advertisers and partners. By using this website you agree to the use of said cookies. More Information

The cookie settings on this website are set to "allow cookies" to give you the best browsing experience possible. If you continue to use this website without changing your cookie settings, continuing to navigate past this message, or you click "Accept" below then you are consenting to the use of cookies on the Rapid Purple website.

Close