3

I am having trouble validating my code with W3 Validator. I am new to Web Design. Can someone help me. The Validator states:

Error: Self-closing syntax (/>) used on a non-void HTML element. Ignoring the slash and treating as a start tag.

From line 15, column 1; to line 15, column 41

p>↩↩↩<h1>↩<a href="http://www.monroecollege.edu:"/><img s

Code:

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Home-International Student Home Page</title>
<link href="cssstyle.css" rel="stylesheet">
</head>
<body>

<h3>About Image:</h3>
<p>Monroe College Logo</p>

<h1>
   <a href="http://www.monroecollege.edu:">
   <img src="monroelogo.jpg"  alt="" height="115" width="700"/>
</h1>
Michael Benjamin
  • 346,931
  • 104
  • 581
  • 701
Venetta Smithen
  • 37
  • 1
  • 2

3 Answers3

3

First thing, close the anchor (<a>) element in your <h1> container.

Invalid HTML

<h1>
    <a href="http://www.monroecollege.edu:">
    <img src="monroelogo.jpg"  alt="" height="115" width="700"/>
    <!-- missing closing </a> tag here -->
</h1>

Valid HTML

<h1>
    <a href="http://www.monroecollege.edu:">
    <img src="monroelogo.jpg"  alt="" height="115" width="700"/>
    </a>
</h1>

Make sure to always add closing tags to non-void (non-self-closing) elements. Check the description for each element to determine the "tag omission" requirement.

Void elements are also known as self-closing, empty and singleton. Here is a list of all void elements in HTML

area, base, br, col, embed, hr, img, input, keygen, link, meta, param, source, track, wbr

All other elements require a closing tag.

Also, for void elements, the trailing slash isn't necessary anymore. It's acceptable, but not necessary.

This is valid HTML:

<br>, <hr>, <img>, <input>, <meta>, etc.

In fact, removing the slash is recommended by the Google HTML/CSS Style Guide and the Stack Overflow community.

Also, putting an image inside a heading element (in this case <h1>) is perfectly valid. Whether or not it's the right thing to do is another question.

Community
  • 1
  • 1
Michael Benjamin
  • 346,931
  • 104
  • 581
  • 701
1

Dont forget to close that <a> tag

Also, you do not need to put that <h1> around the image, it won't do anything and might yield errors as it expects some text inside.

Otto
  • 879
  • 9
  • 7
0

1) images in HTML doesn't need to a header ( <h1>, <h2>, <h3> and ... ) tag.
but it is allowed. don’t forget to set the alt attribute on the img!
alt attribute is mandatory.

2) most tags in html should close after opening them but not all. for example :

<br> <embed> <hr> <img> <input> <link> <meta> <param> <source>
  • You forget to close <a> tag in last line.
Soheil Shiri
  • 11
  • 5