Usually, we think that the top section of our site/app is the header, and this is correct. The editorial name for that top section is the masthead.
However, from an HTML5 standpoint, there's a difference between a masthead and a header.
The masthead is the main header of our site/app and there can be only one. It usually contains the logo, some navigation, maybe a search field, and so on. The header can be considered the top area of any section and there can be more than one header.
Notice that we're not talking about the <header> element, at least not yet.
The masthead can be built using the <header> element, but the <header> element can also be used in other parts of the same page.
Here's the definition from MDN:
The HTML
<header>Element represents a group of introductory or navigational aids. It may contain some heading elements but also other elements like a logo, wrapped section's header, a search form, and so on.
Here are a few important...