Can HTML contain two HEAD tags

In my web application, I got a Header.jsp file that contains the contents of the default header. Im including it in all other pages using jsp: include a tag inside the body tag for each individual page.

Header.jsp contains its own HEAD tag to specify default meta tags, link stylesheets, scripts, and some HTML elements. At the same time, I will have another set of HEAD tags on all other separate pages to define the title, special script pages and style sheets.

For example:

Header.jsp

<head> <link rel="shortcut icon" href="<%=request.getContextPath()%>/images/favicon.ico" type="image/x-icon" /> <meta http-equiv="X-UA-Compatible" content="IE=edge"/> <script src="js/jquery.js"></script> <link rel=stylesheet type="text/css" href="dashboard.css" > </head> <h2>Dashboard</h2> 

main.jsp

 <!DOCTYPE html> <html> <head> <title>Main page</title> <script src="main.js"></script> </head> <body> <jsp:include page="Header.jsp" flush="true" /> ..... other HTML contents specific to main page ..... </body> </html> 

does it really do?

+20
html html5 jsp
source share
6 answers

Invalid to standard

Relevant Part:

4.2.1 head element

Categories: None.

Contexts in which this element can be used: As the first element in an html element.

The second <head> element will not be the first element in the html document.

+11
source share

The short answer is YES.

This is not a good solution, but it will certainly work.

People usually answer these questions theoretically, for example, "no, because it does not meet the standards." This is true, it is not. Future browsers may not support it, some source parsers may get confused, HR / IT specialists who check your portfolio may think that you know less than John Snow, and all sorts of bad things. In theory. But this happens in the real world, and browsers are not stupid: they know what you mean, they will use head tags and work as expected.

And this is no coincidence.
They have very good reasons:

1. The title is optional. (see notes under the article!)
Browsers accept content similar to the title, even outside it, so in fact they completely ignore the tag itself. And if they ignore one thing, they will probably also ignore a few.

2. Visitors are precious.
Browsers want you to enjoy your time. They want to show you the best page they can make up from the mess they have. They want to show you how the Internet works, and not how bad your favorite site is. If they can figure out what the HTML wants to express (and there is no deadly ambiguity in the structure), they will do their best to fix the page.

3. Poor markup tolerance is a thing.
Browsers are not just patient and forgiving, but sometimes they take acrobatic steps to make your stuff work. Look at this terrible mess:

 <!-- no doctype! --> <!-- no HTML tag! we're all gonna die! --> <head> <style> body {background:#002233;} </style> </head> <head><!-- let twist again! --> <style> body {color:white} </style> <!-- we didn't even close the second one!! --> See this text?<br> With the background AND color properly set?<br> <br> Your browser quite a badass. 

About browser tolerance, there is much more with ugly examples - make sure you forget everything you saw when you returned!)

So yes, of course, the principle of "be a good friend of your browser", no matter how smartly it corrects your mistakes. But if you wake up in a dark dungeon with hungry lions around, and your only way out is to use two tags & lt; head> - well, feel free! This is not broken syntax, this is not a serious violation of HTML5 rules - it is nothing more than a convenient cheat. And do not succumb to the widespread myth that non-standard, inaccurate sites thrive much worse: people usually just don’t know for sure and want to stay on the safe side. As a rule, they describe hell as the place where web authors who fail the validator go to.

TLDR: in practice, two head tags work.

Now, please use only one option.


ADDITIONAL NOTES

As @StanislavBerkov pointed out, both W3C and MDN assume that the HEAD tag is implied, that is, it is probably better to just leave the head tag completely. I would not recommend this approach if you have a standard use case for only one of them, but obviously it is better not to have one, but two. The documentation is not very clear on this topic, so make sure you test everything in the main browsers - but again, in practice, you will not have any problems.

+54
source share

Good answer @ Gwenc37. You can have any tags in any other tags, but it’s always best to stick to W3C standards and specifications. Later in the project, you can get to the point where your HTML code is not parsed correctly in the browser, or even worse.

To be safe, rather adhere to W3C standards. Thus, you will not be mistaken. Hope this helps.

+2
source share

Here is an idea you could try

In your main head do it

 <!DOCTYPE html> <html> <head> <link rel="shortcut icon" href="<%=request.getContextPath()%>/images/favicon.ico" type="image/x-icon" /> <meta http-equiv="X-UA-Compatible" content="IE=edge"/> <script src="js/jquery.js"></script> <link rel=stylesheet type="text/css" href="dashboard.css" > 

Notice that I left the end head tag. Then, in all of your files, you must either close the header tag, or add additional header material, and then close your header tag, for example

  <title>Main page</title> <script src="main.js"></script> </head> <body> <jsp:include page="Header.jsp" flush="true" /> ..... other HTML contents specific to main page ..... </body> </html> 

As for the name of your page, you can run a little php to determine which page you are on.

+2
source share

According to W3C standards, no! you cannot do this.

In your case, you use JSP as a server side script. The problem can be solved with CONSTANTS for styles / scripts / other html elements.

You just need to add the condition to the "main.jsp" file as per the page requirements.

+1
source share

According to W3C standards, you cannot have two HEAD tags.

As for your problem, you can call the header.jsp file without the HEAD tag, or you can rename it to scripts.jsp or constants.jsp

For example:

Header.jsp

 <link rel="shortcut icon" href="<%=request.getContextPath()%>/images/favicon.ico" type="image/x-icon" /> <meta http-equiv="X-UA-Compatible" content="IE=edge"/> <script src="js/jquery.js"></script> <link rel=stylesheet type="text/css" href="dashboard.css" > 

main.jsp

 <!DOCTYPE html> <html> <head> <title>Main page</title> <script src="main.js"></script> <jsp:include page="Header.jsp" flush="true" /> </head> <body> ..... other HTML contents specific to main page ..... </body> </html> 
0
source share

All Articles