The head tag in HTML is the way to tell the browser a few things before it starts rendering the page. You can put your CSS, JavaScript, Meta information, and more in this tag. Like I said earlier, the head tag will not actually display any content on the page itself. However, you can place content between the <title> </title> tags that will show content in the page tab in the browser. If you look on the tab now you can see that I have put content in the title tag.
Boom! You just set a page title. Never forget to set the page title! It helps users who have multiple tabs open to understand what your tab is all about. It also is the displayed text in the search results. So, if you want people to consider clicking your link in the search results, you must have a title tag. How many links do you click on without a title tag?
Meta Tags
Aside from the title in the head tag, HTML pages have the ability to use Meta tags. While not explicit to the user, search engines crawl through these Meta tags to help display the best information possible for the user. Quite a few Meta tags exist, but only a few are commonly used:
- <meta name=”description” content=” A description about your HTML page goes here”/>
- <meta name=”keywords” content=” Keywords, about, your, content, goes here”/> (Notice the commas to separate keywords.)
- <meta http-equiv=”Content-Type” content=”text/html;charset=utf-8″ />
Now, I said at the top of this page that you can embed CSS and JavaScript in the head tags (not in the title tags), but we will get to those in their separate tutorial categories. Well, that pretty much concludes foundation of the head tag.
References
//Hello
I think you forgot about at the beginning of the page!
Thanks So much!!!!!!!
Short, And to the point!!!
Waiting for more.
Meta tags helps a lot because I can write about my web pages not only once but i can give a lot of informations
Very Good Tutorial, Great references. Found a lot of useful information regarding meta tags.
This is a good instructional course, with good explanations. But I hope there is more hands on exercises and problem solving tutorials. I am looking for something more in depth. Not just a run down. I hope this site will provide that. As I am trying to teach myself. For free that is.
This is great
didn’t really understand how the test your code works.
It seems no matter what I write I get green "No errors!" tag and progress points.
progress gained, very informative and builds capacity.
I think the explanations of what is happening are FAR better than codeacademy but the Test Your Code option is nothing compared to the hands on experience codeacademy provides.
Well, thank you very much for creating afterhoursprogramming.com. It is exactly what I was looking for… awesome! I’ve just finished the HTML tutorial and now I’m reviewing again its content. While reading, I’ve noticed some mistypings and missing text. I decided to contribute to your efforts to provide free tutorials by commenting and mentioning the mistakes, so that you can correct them. It’s the least I can do to return the favour and the whole process will earn me the "Commentator" badge ;). So… in this page: (1) [It also is the displayed in the search results.] you probably write smth like: [It also is the displayed text in the search results.] or [It is also displayed in the search results.] (2) [<meta name="description" content=" A description about your HTML page goes"/>] here you missed the word "here" 😛 at the end, thus it should be: [<meta name="description" content=" A description about your HTML page goes here"/>].
please explain Meta tags in detail with some example