Main, head, body tag

I just started learning on this platform today and saw these tags. When I tried them out,

<main>
Hello
</main>
<body>
L
</body>

,both still appeared on screen in order. Hello being on top of L . Does anyone have a really detailed explanation for these?

Thanks.

Could you explain your question a little further?

I’ve edited your post for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

Please use the “preformatted text” tool in the editor (</>) to add backticks around text.

See this post to find the backtick on your keyboard.
Note: Backticks are not single quotes.

markdown_Forums

Can you explain what you mean? It still isn’t at all clear what you’re asking & what you don’t understand.

what’s the purpose of the main,body and head tags if they all appear on the screen line by line?

wouldn’t it be the same if i were to write:

Hello
L

instead of:

<main>
Hello
</main>
<body>
L
</body>

Well putting aside that the structure is wrong (<body> is the tag that should contain all of the visible content on a web page, <main> should be a child of that), no.

How could there possibly be any structure? How could it be styled, for example? How could you tell what is what? HTML is markup, it is a notation for attaching some information to blocks of text. Text on its own is just text.

So for example, this is small excerpt of the text that makes up the front page of a UK newspaper’s site, in text form:

The Guardian - Back to home
Support The Guardian
Available for everyone, funded by readers
Contribute
Subscribe
Search jobs
Sign in
Search
News
Opinion
Sport
Culture
Lifestyle
UK
World
Business
Coronavirus
Football
Environment
UK politics
Education
Society
Science
Tech
Global development
Obituaries
News, sport and opinion from the Guardian's UK edition
Coronavirus
Monday 18 May 2020
Live UK coronavirus: thousands expected to return to work as train capacity increases
48s ago
This morning the Daily Telegraph has splashed on a story (paywall) saying that a study from Australia suggests that the risk of coronavirus spreading in schools is extremely low. Here’s an extract. Coronavirus does not spread widely in schools, according to a major study which is being considered by government advisers ... The study examined by the government advisers was conducted by Australia’s National Centre for Immunisation Research and Surveillance. It was cited by the country’s officials
29m ago
Paul Whiteman, the general secretary of the NAHT union, which represents head teachers, told the Today programme this morning that teachers wanted more clarification on whether schools were centres of transmission. He said: Specifically around the transmission from children to adults, we’ve been told over the weekend - it’s been asserted by the government publicly over the weekend - that there isn’t the level of risk that we fear. However, we haven’t yet seen the scientific underpin of that. The
36m ago
Oliver Dowden, the culture secretary, was doing the morning interview round on behalf of the government this morning. Here is a summary of what he’s been saying. Dowden said he did not expect Premier League football to resume until “probably mid-June at the earliest”. He said the Premier League would need to find a way for it to go ahead safely behind closed doors before the government gave approval. He said he was looking at increasing the number of free-to-air matches as this could be helpful

do you understand why this, on its own, is not useful?

<!DOCTYPE html>
<html>
<body>
<main>
Hello World
</main>
</body>
</html>

Would this be correct? Is it possible to remove the body tag and have “Hello World” still show up on screen? or have it the other way? (other way being main tag being removed)

Yes, you can remove the body tag and the browser will still render the text: browsers are designed to be forgiving. It is not really correct HTML,and anything that depends on sane HTML may fall over, but the browser will print some text to the screen

If the body tag shows all the visible content on a web page, does the main tag do the same? and should the head tag be outside of the body tag or inside?

I think it will be best prectice to use this structure… :

<html>
<head>
</head>
<body>
</body>
</html>

I saw most of the web projects made with this structure…

Hmm, alright. Thank you!

Best practice:

<!DOCTYPE html>
<html>
  <head>
    <!-- metadata elements -->
  </head>
  <body>
    <!-- page contents -->
  </body>
</html>

Also you can find more about page contents including main, header, footer, section … here:
https://www.freecodecamp.org/learn/responsive-web-design/applied-accessibility/jump-straight-to-the-content-using-the-main-element

HTML is one of the languages that is made for new beginners. It has fallbacks. So if like your example, you didn’t put the main content inside the <body> tag, the HTML document will read it like it is inside the <body> tag. That is also why HTML is one of the easiest to learn language.

The <main> tag is for the main content on the page, like <header> is for stuff that goes in a header, or <nav> for navigation, or <p> for paragraphs. It goes in the body.

Like you have a web page that has a header, and some navigation, then the content, then a footer

<html>
  <head><!-- non-visible stuff, scripts, stylesheet links etc --></head>
  <body>
    <header></header>
    <nav></nav>
    <main><!-- main content here --></main>
    <footer></footer>
  </body>
</html>
1 Like