Direct answer
No, the <p>
is not necessary inside heading. Moreover, it must not be used there!
According to both the HTML 4 DTD and HTML 5 content models, the p
element cannot be used inside h1
and it cannot contain h1
either.
References to specs
In HTML 4, p
element is defined as block-level and can contain only inline elements, the same holds for h1
element.
In HTML 5 p
element can be used in contexts where flow content is expected and can contain phrasing content. The same holds for h1
element again.
Text
Other answers mentioned “free text” – paragraph text not marked up a p
element contents. Text is categorized as both phrasing content and flow content in HTML 5 and it’s nothing really special. With HTML 4 I am not sure about this and I suspect that the spec does not say much about it.
Being flow content means that text can be directly embedded in body
as its content model is flow content. In fact, text can be embedded virtually anywhere. Using p
elements is necessary for styling and paragraph breaks as any sequence of whitespace normally collapses into one before being displayed. But in some simple cases p
need not be used, e.g. when the whole document is just a heading and one paragraph:
<!DOCTYPE html>
<title>Really minimalistic HTML 5 example</title>
<h1>Really minimalistic HTML 5 example</h1>
And that’s all, folks!
Looking for html
, head
and body
tags? They are omitted; the elements still exist, though. But there is no p
element. You can verify that in Firebug or by applying styles to body
and p
. If you want “And that’s all, folks!” to be a real p
paragraph, just place <p>
before “And”. (Closing tag </p>
can be omitted.)
How to think about HTML
As many people offer misleading advice on HTML, I want to point you in the right direction, as far as HTML understanding is concerned.
Element is not a tag. Element is a unit of document structure. Tag is a string that represents element in document source code. Most elements need two tags (opening and closing one) to represent them. E.g. p
element is usually represented by <p>
opening tag, </p>
closing tag and the text between those two. The opening tag can also be e.g. <p style="color: red">
– a different tag for the same element. Opening tag lists element’s attributes (style
attribute in this case).
HTML is used to mark up structure of a document. You can completely ignore that browsers can somehow display h1
in big bold font, with big margins. CSS takes care of elements’ presentation. JS takes care of element’s behavior.
The important thing on h1
is it is a level 1 heading. It has this meaning, these semantics. p
, on the other hand, is paragraph (approximately; for details see my question on paragraphs in HTML). It is natural that headings and paragraphs are two distinct components of a document and that they are used independently one of the other. Using elements properly, respecting their defined semantics, is necessary for pretty display with styles switched off, SEO, browsing with screen readers and overall accessibility.