How to position the head, main, aside?

The first picture is shown as located items at the moment for a second as I would like.
Issues: semantically correct elements located? And how to ask them the position as in the second example (I read and tried some options, but they don't work).
March 23rd 20 at 19:08
2 answers
March 23rd 20 at 19:10
Semanticheskii - true, but the semantics is not only about the visual arrangement of elements, but also about correct use of tags (one h1 on the page, using html5 tags, etc.), but in General - everything is OK.

A positioning such as this is: Codepen.
Judging by the picture, the author wants centered the header and main blocks. - garett_Mayer4 commented on March 23rd 20 at 19:13
March 23rd 20 at 19:12
it's pretty simple, the video is old though but it works

Find more questions by tags Flexbox