ColorCode

Videos 🎥Courses 📚Podcast 🎙️Merch 👕Login 🏠
arrow left
HTML Basics

VIDEOS

Last Updated: February 4, 2023

HEAD tag

What is the HEAD tag in HTML and what is it used for?

Let's... quickly talk about the <head> tag because we haven’t paid much attention to it and it’s pretty important. Like I said here, it’s where you put general information about your page.

<title>

First child is <title>. This will become the title of your page, when you look at the tab itself. If you don’t add it, it’ll just say the name of the file, which sucks. You don’t want that. SO be sure to add a relevant title to your HTML document.

<meta>

<meta> tags are for adding meta information for search engines. Meta tags have a name attribute and a content attribute. If the name is description, the content becomes the description of your page when google displays it in the search results. If the name is keywords, the content will be all the keywords that are relative to your content, separated by a comma.

There’s an awesome meta tag called viewport, this tells the browser how to scale the page for different device sizes. Here's a good example on W3Schools. Here’s the full meta tag that solves the problem:

<meta name="viewport" content="width=device-width, initial-scale=1.0">

You don’t have to remember it, just realize what meta tags are capable of doing. There are other meta tags of course, but these are some of the more popular ones.

<style>

Using the <style> tag you can add CSS to your page, I talk all about it here

<link> & <script>

These two will let you load other files like JavaScript and CSS into your HTML to make it more awesome.

So you see, none of these tags directly add any content to the page, they don’t show up inside the browser, but they are just as important for the final product.

So that’s a little bit about the <head> tag. I hinted at CSS a couple of times, we’re almost ready for it but first, HTML identifiers which will lead us to CSS selectors…..