This article is about several tags wrapped up, after reading the book, for instance, usage and position on a web site.
1冊ですべて身につくHTML & CSSとWebデザイン入門講座[第2版] (DL特典:Webデザイナーのポートフォリオの作り方入門講座) (1冊ですべて身につく)
Layout

image reference: https://chot.design/html-css-beginner/5cac8c19c5ec/
<header> Tag
This tag creates header, including a logo image, a page title and a navigation menu in most situations.
See the Pen <header> Tag by Nao (@naopon-hamumu) on CodePen.
<nav> Tag
This is used for a navigation menu, often located at
See the Pen <nav> Tag by Nao (@naopon-hamumu) on CodePen.
<main> Tag
See the Pen Untitled by Nao (@naopon-hamumu) on CodePen.
<article> Tag
We can make higlighted articles of what we would like to by this tag.
example: CBC NEWS
See the Pen <article> Tag by Nao (@naopon-hamumu) on CodePen.
<section> Tag
we can see the section tag, having one theme consisted of multiple things, for example, "DISCOGRAPHY" on timelesz.
See the Pen Untitled by Nao (@naopon-hamumu) on CodePen.
<aside> Tag
This tag is suitable putting contents aside, not related to what mainly convey.
We can see the web "はてなブログ" site, using this tag.
See the Pen <aside> Tag by Nao (@naopon-hamumu) on CodePen.
<footer> Tag
Any page we can see this tag at the bottom, written about copyright and so on.
example: 中島健人|STARTO ENTERTAINMENT
See the Pen <footer> Tag by Nao (@naopon-hamumu) on CodePen.
<div> Tag
This tag has not decided roles like other tags I showed you. In the site "ILLIT JAPAN OFFICIAL SITE", the tag is used to give id on <div> to make hamburger menu.
<div>
</div>