W3C HTML validator accuses " Empty heading"
I am trying to validate my html and it is giving me the following message:
Line 328, Column 34: Empty heading.
<h3 class="titulo-chamada">A internet no controle</h3>
Hinted that the title is empty, but see that it has a content.
3 answers
The meaning of "empty" in this case is not that the tag has no content; it is that this tag does not reference a section. The semantic meaning of a header is that it is "the header of a section", and not simply a formatting option (such as strong or em).
See this question in Soen for more details. I'm still researching about what should be done to fix this, when I find out post here.
Update: in your case, using the header inside a article would be correct, the problem seems to be because that article is inside a figure. There are several uses for this element , but I don't know the consequences of using it that way. So one way to solve this problem would be to put this article somewhere else (for example in a div, as you say you did successfully in the comments).
I keep the W3C HTML5 validator. the problem you reported is caused by a bug in the validator code. It is not the expected behavior. The <h3> is certainly not empty, so the error message is actually wrong. I will try to fix this bug soon. Thank you for realizing the problem.
I'm the maintainer of the W3C HTML5 validator. The problem reported here is caused by a bug in the validator sources. It's not intended behavior. The <h3> is definitely not empty. So in this case the error message is just wrong. I'll try to fix this validator bug soon. Thanks for catching it.
I think I get it. Semantically it is not right to put a h3 inside a figure tag. If I swap the figure tag and use a div, it solves the problem.
<!DOCTYPE html>
<html class="no-js">
<head>
<meta charset="UTF-8">
<title>Teste</title>
</head>
<body>
<figure class="chamada-banner grid grid-8-12">
<article class="chamada-box">
<span class="categoria">Ponto de vista</span>
<span class="description">Entrevista</span>
<h3 class="titulo-chamada">A internet no controle</h3>
<p>Atualmente, publicam-se on line muito mais informações sobre nós mesmos do que jamai antes, todos estes dados estão sendo coletados por organizações...</p>
</article>
</figure>
</body>
</html>
By removing the figure tag and using a div resolve.
<!DOCTYPE html>
<html class="no-js">
<head>
<meta charset="UTF-8">
<title>Teste</title>
</head>
<body>
<div class="chamada-banner grid grid-8-12">
<article class="chamada-box">
<span class="categoria">Ponto de vista</span>
<span class="description">Entrevista</span>
<h3 class="titulo-chamada">A internet no controle</h3>
<p>Atualmente, publicam-se on line muito mais informações sobre nós mesmos do que jamai antes, todos estes dados estão sendo coletados por organizações...</p>
</article>
</div >
</body>
</html>
Or you can use a span instead of h3, if I want to use the figure tag.
<!DOCTYPE html>
<html class="no-js">
<head>
<meta charset="UTF-8">
<title>Teste</title>
</head>
<body>
<figure class="chamada-banner grid grid-8-12">
<article class="chamada-box">
<span class="categoria">Ponto de vista</span>
<span class="description">Entrevista</span>
<span class="titulo-chamada">A internet no controle</span>
<p>Atualmente, publicam-se on line muito mais informações sobre nós mesmos do que jamai antes, todos estes dados estão sendo coletados por organizações...</p>
</article>
</figure>
</body>
</html>