What is the head tag?
In HTML, the head tag houses technical information called metadata about a web page to help browsers and web crawlers better make sense of it. It is typically not visible to the user.
If you want a more in-depth understanding of this topic, check out the FAQ section below:
Question #1: What are the elements of the head tag?
The elements of the head tag are as follows:
- <title>
- <style>
- <base>
- <link>
- <meta>
- <script>
- <noscript>
Let us go over each one in more detail:
The <title> element, as the name suggests, defines the title of the entirety of the HTML content (i.e., the part the user does not see) of a web page. It is different from the <h1> tag, which, in contrast, defines the title of the actual content (i.e., the part the user sees) of the web page.
The <style> element is where the cascading style sheets (CSS) code goes to tell browsers how to properly render a web page’s HTML code.
The <base> element is in charge of defining the absolute (a.k.a. base) URL, such as https://www.mydomain.com, that all relative URLs, such as https://www.mydomain.com/pricing, will use.
The <link> element allows you to link your HTML document to an external resource such as a style sheet. It has two attributes: href and rel. The former defines the location of the external resource while the latter defines its relationship to your HTML document.
The <meta> element is where additional technical information about the web page, such as important keywords and the page’s description, go.
The <script> element either contains a script, such as JavaScript, or links to an external resource that contains the scripts the web page needs to run properly. It can go either inside the head tag or at the bottom of the body tag.
Finally, the <noscript> element is in charge of defining an alternate text in cases where the browser does not support scripts or the user disables scripts.
Question #2: Can I omit the head tag in my HTML code?
The short answer is yes, you can technically omit the head tag in your HTML code. This, however, does not mean that your code would work without it. Browsers would still try to figure out where in your code the tag should go and add it in.
The problem with letting browsers take care of adding in the head tag is that while they are generally good at determining where it should be inserted, they are not accurate 100% of the time. This means that your website may end up looking weird on some browsers.
Also, while omitting the actual tag is technically okay, omitting required head elements, such as <title>, will cause your HTML code to not work properly (if at all).
Question #3: Does the head tag affect SEO?
While the head tag itself does not directly affect SEO, the <meta> element that it contains does. This particular head element contains all sorts of technical information about a web page, helping not only browsers, but also web crawlers better make sense of it. The more web crawlers know about your website, the higher its odds of showing up in search results because search engines know exactly the most relevant keywords for it are.
Of course, this should only form a small part of your SEO strategy. There are a lot of other areas you need to work on if you want to rank higher, including:
- Doing keyword research to find the right keywords to use
- Publishing high-quality content to attract a steady stream of engaged followers
- Link building to increase your website’s authority in your field
For more information on head tags, check this article from SEJ.