I am new to HTML and started with my first lesson.
I am unable to understand the head tag clearly and need help to understand it clearly.
As I read about the head tag, it says "The head of an HTML document is the part that is not displayed in the web browser when the page is loaded."
However when I try in my lab exercise with the below code in my html file, the content inside the h1 tag that is within the head tag is displayed in the web browser, which is confusing me as I was expecting that, whatever I write inside the head tag will not be displayed in the browser, as per what I read. Can someone give me clarity on this.
<!DOCTYPE html>
<html>
<head>
<title>First Lesson</title>
<h1>Hello World!</h1>
</head>
<body>
<h1>Hello World!</h1>
</body>
</html>
Modern HTML is very tolerant. You can now get away with not closing tags, or even no tags at all (remove the <h1> tags and "hello world!" will still be displayed) You could put the <title> in the body and it will still be displayed in the browser tag.
Although it still works, it is incorrect and fails HTML markup validation.
Any of the tags that meant to be in the head <title> <style> <base> <meta> etc. Won't be displayed on the page.
Html tag head contains machine-readable information, which not displayed, like metadata, scripts, styles. He also inherits all of the properties html element and browser parse him, like common html tag. More information: link, link
I would like to add the image present at this link http://startup.registroimprese.it/isin/search?0-IResourceListener-data-resultRow-22-resultViewPnl-companyCardContainer-logoImg&antiCache=1628599295826 to my html page. Therefore, I have added the above URL to the "src" attribute in the < img> tag. My HTML code looks like this:
<html lang="en">
<head>
<meta charset="utf-8">
</head>
<body>
<img src="http://startup.registroimprese.it/isin/search?0-IResourceListener-data-resultRow-26-resultViewPnl-companyCardContainer-logoImg&antiCache=1628599295828">
</body>
</html>
However, the image is not displayed when I render the page, and this is what I see.
blank page
What I expect to see instead, is the image at the link correctly displayed on my html page. Any idea what is wrong and how I could fix it?
NOTE: I know I could download the image locally and then add it, but I specifically need to find a solution to add the image from the link, and not from a path on my local computer.
If I just have an <img> as an html page, could there be any security risks? In other words, no <html><head>or<body> tags.
So let's say it is my default.htm page.
The html, head and body elements are always going to be there. You can't actually have an HTML page without them, even if you leave out the tags.
The following two valid HTML documents are equivalent (whitespace notwithstanding):
<!DOCTYPE html>
<title>Image</title>
<img src="lightbulb.jpg" alt="">
<!DOCTYPE html>
<html>
<head><title>Image</title></head>
<body><img src="lightbulb.jpg" alt=""></body>
</html>
So even if there were any such security risks associated with leaving those elements out (which there aren't), the fact that they will always be there renders that concern moot.
If I want to redirect to another page in my HTML file, do in have to place the meta tag in the head or can I place it at the top of the file before the DOCTYPE? Thank you.
You can't place a meta tag above the DOCTYPE. The DOCTYPE must always be the first element in an HTML document, and meta tags must only be placed in the head.
Documents must consist of the following parts, in the given order:
Optionally, a single "BOM" (U+FEFF) character.
Any number of comments and space characters.
A DOCTYPE.
Any number of comments and space characters.
The root element, in the form of an html element.
Any number of comments and space characters.
Source: http://www.w3.org/TR/html5/syntax.html#writing
For purposes of this question, the spec says that a document must start with a DOCTYPE and be followed by a root html element. While a meta tag might still work, there is no guarantee of it doing so today and continuing to do so in the future.
The meta tag has to be inside the <head></head> section. You can not add anything before <!DOCTYPE html>
Here is detailed description of DOCTYPE
W3C deprecates the use it, but they do offer an example on W3C:
<HEAD>
<TITLE>Don't use this!</TITLE>
<META http-equiv="refresh" content="5;http://www.example.com/newpage">
</HEAD>
<BODY>
<P>If your browser supports Refresh, you'll be transported to our
new site
in 5 seconds, otherwise, select the link manually.
</BODY>
GIYF: H76: Using meta refresh to create an instant client-side redirect
You should insert the following line in the head section of your HTML page, replacing http:example.com/ with the actual web page to which you want to redirect your viewers:
< meta http-equiv="refresh" content="2;url=http://example.com/" />
Here is an example with the correct line inserted in a typical HTML page. Note that it comes above the title tag.
<html>
<head>
<meta http-equiv="refresh" content="2;url=http://example.com" />
<title>Page Moved</title>
</head>
<body>
This page has moved. Click here to go to the new page.
</body>
</html>
I was hoping that someone may know how to resolve this HTML5 validation error. When I try to validate my page: http://blog.genesispetaluma.com using http://validator.w3.org, it gives me the following error code:
Error Line 90, Column 63: An body start tag seen but an element of the same type was already open.
<body class="home blog single-author two-column right-sidebar">
I interpreted this error to mean that I have two body tags in the code. However, I have searched everywhere and can only find one <body> (the one referenced by the error) and one </body>. Can anyone please tell me how to resolve this error?
I had a similar problem but with <head>, giving the following W3C markup error:
A head start tag seen but an element of the same type was already open
I had this code:
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<head>
When it was supposed to be:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
I knew that was wrong but it's hard to spot sometimes, as you're just so used to the header code being correct 99% of the time. I obviously cut n pasted some code and that ended up in the wrong place.
This isn't specific to your question, I know, as your error relates to the <body> tag, but this is the kind of thing you're looking for. Maybe you have a <link> or <meta> tag in your body somewhere, that's meant to be in the <head>. Without seeing your code, it's hard to give you a perfect answer.
Possibly it's because:
<div id="wrapFix">
<div id="drawLogo1">
<div id="drawLogo2">
<img src="http://genesispetaluma.com/img/logoNew.png" alt="Genesis Fitness G stylelogo">
</div>
</div> <!-- end of drawLogo1 -->
Is between your closing head tag and opening body tag. I.e. lines 81-87
One of the widgets (the facebook like button I believe) you're using is inserting HTML into the page and part of that HTML is a body tag. Not sure if there's anything you can do about this, but I think that's what's throwing the error. Looks like this:
<body class="plugin transparent_widget ff4 win Locale_en_US">
</html>
</iframe>
I got this error:
A head start tag seen but an element of the same type was already open
I read this post and then i noticed my tag listed before the head like this.
<title>Home</title>
<head>
</head>
it should have been
<head>
<title>Home</title>
</head>
It happens in below said scenarios as per my knowledge -
When you mistakenly choose <head> thinking <header> tag.
When your <header>, <nav>, <section> or <footer> tag(s) are outside of <body> tag.
So, after creating your page, you can validate these changes here.
I got the same error message : check out if any body-inside <element> is displayed between the <head> and <body>, like said above.
My error was caused by a <div> tag, with absolute position, to display some page information during the development - simply a line on a false position in the code.
Hi in my case hgroup tag is the reason why I'm having validation error I, remove this tag from head tag and put it inside after body tag after this the document is now valid.
Just for the record, I had exactly the same problem and it seems that including some php files within the head element was strangely giving the problem, even if the view-source of Firefox was not printing such php code nor tags
<head>
<? include("./file.php"); ?>
<title><? echo $title ?></title>
</head>
solved using:
<? include("./file.php"); ?>
<!DOCTYPE html>
<html>
<head>
<title><? echo $title ?></title>
</head>
<body>
...
...
If Your problem With head and body both are show validate error just remove displaying text from head and keep it in body..
I have been faces the problem recently.
For Example You have text to display in header inside head just remove header from head and keep it in body ......Problem solved...Thanks
In my case it was the facebook tag
<div id="fb-root"></div>
which was inside the page's <head>.
Moved that to the <body> of the relevant page (not required globally) sorted it. So yes, the answer supplied above by Emil H was correct.
Also bear in mind, if you copy/paste your code from things like slack, etc. they will have 'special characters' for formatting (that are usually invisible) which may cause that issue.
Here is a video to demonstrate: https://drive.google.com/file/d/1OJS15zmSvzhVXVLcQGGhePZGNCxWHocN/view
This error can happen if you put into <head> tag that restricted to be there. For example:
<head>
<audio preload="auto" class="menu-beep" id="sound-01">
<source src="sound-01.mp3">
</audio>
</head>
In this case, the tag will be immediately opened in the browser memory. But later the browser will find the body tag that opens the page. This is how it turns out that there is a second body tag.
I had similar problem with <head> tag. I use https://validator.w3.org
Look at few examples how to solve this problem:
<script> should be inside <head>
css should be inside <head>