<header> vs <head>

csdunit2

#1

I thought I was making good progress through the course until I became stumped by the difference between header>and head>. The unit is titled headers but the HTML code is head>. When I looked up the info on W3, I got conflicting information. Shown here. Should I instruct the students to use header>, h1>,h2>, etc. This is not the way it appears in the lesson.

The following elements can go inside the element: (this element is required in an HTML document)
title>
style>
base>
link>
meta>
script>
noscript>
header>
A header> element typically contains:
one or more heading elements (h1> - h6>)
logo or icon
authorship information


#2

The HTML tag is a container for metadata and links to scripts and stylesheets. The tag is a semantic container used to designate contents that is introductory or navigational in nature. … The main difference is that the element is for META data and the element is for actual content.Nov 25, 2015
html - What is the real difference between the “head” and “header” …


#3

Check out this link for more clarification: https://teamtreehouse.com/community/what-is-the-different-between-head-and-header-again-and-what-goes-inside-each


#4

Hey @slooowlearner,

It’s definitely a tricky topic with a bunch of things with very similar names. Hopefully, this can help you out.

There are three different things

  1. The HTML Head Element which is <head> - Is is a tag and the <body> used to break up the information in an html file into two sections. The <body> tag hold all the content of the page and the <head> holds all the extra information often referred to at META data. You can go to https://www.w3schools.com/html/html_head.asp for more information.

  2. The Header tag which is <header> - You don’t need this tag for CS Discoveries. For more information on it, you can go to https://www.w3schools.com/tags/tag_header.asp .

  3. HTML Headings which are tags <h1> , <h2> … <h6>. These show on your page because they are the section headings for your content on your page. We sometimes refer to them in the curriculum as headers. These will be one of the most common tags that students will use throughout the curriculum. For the purposes of what students are working on early in the curriculum these are the most important tags of the 3 listed here for them to understand. For more on these you can go to - https://www.w3schools.com/html/html_headings.asp

Hope that helps!

-Dani


#5

Thank for the link clarifying what I had understood to be true but which is not clear in the design of the Discoveries course. I am combining Microsoft Word instruction with HTML instruction using code.org.

In the case of my curriculum the term Header has a corollary meaning. In Word, it is the information at the top of the page that can be repeated on multiple pages and in HTML it is basically the same - information that can be repeated on multiple pages.

As I understand Head it is really where one provides information about the document for computer use rather then human use or view such as key terms search engines will pick up on.

Is this right in laymen terms?


#6

Dani - Thank-you for your reply. I have not had an opportunity to work in coding for about 20 years now. So, I am rusty but not yet moldy (lol) The question came to mind as I was finishing CS Discoveries Unit 2 Lesson 9 where it instructs students in the “DO THIS”
For each page, make sure it has a header that includes the title of the page and a navigation bar that links to other pages in your site. For a review of the header, go to Lesson 9 Level 3.
I do remember previously creating navigation bars that would appear on all pages by using the header tag. Hence, the start of my confusion.
I will just instruct the students to copy and paste the hyperlink references within the head tag because this is how the course is designed but in my overall explanation of tags I will add a note at the bottom explaining the actual difference between a header and a head.
Diane Neville - Gulfstream Academy, Hollywood, Florida


#7

I was just looking at the documentation for HTML and saw that sometimes the link for Headings says “Headings” and other times it says “Headers”

The menu item on the main page says “Headers” https://docs.code.org/weblab/
but when you click on it, the menu item in the list changes to “Headings” and everything on the page refers to “Heading” or “Headings”
If you go to any other link, the menu item says “Header”

Just wanted to bring this to someone’s attention to help alleviate the confusion between “Head”, “Header”, and “Headings”


#8

@kammie.dill

Hi Kammie,

Thanks for bringing that bug to our attention. It looks like it was an oversight, and we’ll try to fix it ASAP. They should all say “heading” rather than “header” in the menus.

Elizabeth