Forum Moderators: open
[edited by: aakk9999 at 12:35 pm (utc) on Nov 10, 2013]
4.) If a page is not ranking where it should the issues are way bigger than whether a <p> is used within an <li> or not -- The use/non-use of a <p> within an <li> will not make a hill of beans, or even a single bean, of difference in the results.
JD_Toims
<li><p> and <li> alone are both valid HTML.
What if your css styling specifies different fonts and/or font-sizes for <p> and <li>? It seems like that would create a conflict.
I doubt that the code would validate.
<p><ul><li>blahblahWhat if your css styling specifies different fonts and/or font-sizes for <p> and <li>? It seems like that would create a conflict.
p {blahblah1}
li {blahblah2}li {blahblah2}
p {blahblah1}li p {blahblah3}p.someclass {blahblah5}
li p {blahblah6}
What that means is within a <p> that contains a list of "things" it's better for source-code semantics to code it as: <p>Some text </p><ul><li>item 1<li>item 2<li>item 3</ul><p>Some other text</p> rather than coding the whole thing as a <p>.
It's common to think of lists only in terms of
--item1
--item2
--item3
but there are situations where you really want a semantic list structure even though the individual items are quite long, up to multiple paragraphs.
how would you code it?
There are several ways to launder your widget:
--running water {detailed description here}
--sonic vibrations {detailed description here}
--dry cleaning {detailed description here}
you can define a p.list
If you have several sentences for each <li>...</li>, however, instead of 1 word, would you code it the same way?
List elements (in particular, ol and ul elements) cannot be children of p elements. When a sentence contains a bulleted list, therefore, one might wonder how it should be marked up.
The solution is to realise that a paragraph, in HTML terms, is not a logical concept, but a structural one. In the fantastic example above, there are actually five paragraphs as defined by this specification: one before the list, one for each bullet, and one after the list.
The markup for the above example could therefore be:
<p>For instance, this fantastic sentence has bullets relating to</p>
<ul>
<li>wizards,
<li>faster-than-light travel, and
<li>telepathy,
</ul>
<p>and is further discussed below.</p>
Authors wishing to conveniently style such "logical" paragraphs consisting of multiple "structural" paragraphs can use the div element instead of the p element.
Thus for instance the above example could become the following:
<div>For instance, this fantastic sentence has bullets relating to
<ul>
<li>wizards,
<li>faster-than-light travel, and
<li>telepathy,
</ul>
and is further discussed below.</div>
Semantically, <li> and <p> are essentially the same thing.
...a paragraph, in HTML terms, is not a logical concept, but a structural one.
In the fantastic example above, there are actually five paragraphs as defined by this specification: one before the list, one for each bullet, and one after the list.
Should you always have p tags in divs?
div.para {exact same styling as my default p here}li.para {exact same styling as your default p here}
but from the HTML docs, even though the <li> display=inline example I gave first works, it's not even technically correct, the second one is.
Sometimes markup may make a difference. F'rinstance search engines might be more inclined to recognize local anchors if you attach them to an <h-something>. But that's headers.
<p>Here is a list:</p>
<ul>
<li>Orange widgets are the best. They contain the latest features and are easy to use. The prices are also reasonable.</li>
<li>Blue widgets are also good. They contain some of the latest features and are easy to use. The prices are pretty good.</li>
</ul>
<p>As you can see from the above list, blah blah blah</p>
If I didn't have the paragraph at the end, so it is just the paragraph at the top and the two bullet points
<p>Here is a list:</p>
<ul>
<li>Orange widgets are the best. They contain the latest features and are easy to use. The prices are also reasonable.</li>
<li>Blue widgets are also good. They contain some of the latest features and are easy to use. The prices are pretty good.</li>
</ul>
would that change how you code the bullet points? Would you include a <p> inside an <li> in this situation?
The <li> is also seen as a paragraph so the <p> does not have to be included?
<li><p>blahblah</p></li><li>
<p>blahblah</p>
<p>blahblah</p>
</li><li>blahblah
<p>blahblah</p>
</li>do you mean that when the anchor link on a page is clicked, it takes you to an h2 tag on that page? This might make the local anchor more recognizable to the search engines?
<h3><a name = "blahblah" id = "blahblah">Header Text</a></h3>
Can you tell me which is the second one?
I guess I should note: An alternative, essentially the same, HTML coding method of the preceding example for people to "get" as well as a bot or machine would be the following.
<p style="display:inline">Here's a list of 4 things for you to remember in the order they are presented: </p><ol style="list-style-type:none;padding:0;margin:0;display:inline;"><li>1, <li>2, <li>3, <li>4</ol><p style="display:inline">.</p>
<p>Here's a list of 4 things for you to remember in the order they are presented: <ol style="list-style-type:none;padding:0;margin:0;display:inline;"><li>1, <li>2, <li>3, <li>4</ol>.</p>
Well I don't see why it would matter what follows the end of the list, whether it's a <p> or <h2> or <blockquote> or something else.
4.5 Grouping content
4.5.1 The p element
4.5.2 The hr element
4.5.3 The pre element
4.5.4 The blockquote element
4.5.5 The ol element
4.5.6 The ul element
4.5.7 The li element
4.5.8 The dl element
4.5.9 The dt element
4.5.10 The dd element
4.5.11 The figure element
4.5.12 The figcaption element
4.5.13 The div element
4.5.14 The main element
4.4 Sections
4.4.1 The body element
4.4.2 The article element
4.4.3 The section element
4.4.4 The nav element
4.4.5 The aside element
4.4.6 The h1, h2, h3, h4, h5, and h6 elements
4.4.7 The header element
4.4.8 The footer element
4.4.9 The address element
4.4.10 Headings and sections
4.4.10.1 Creating an outline
4.4.10.2 Sample outlines
4.4.11 Usage summary
4.4.11.1 Article or section?
[edited by: JD_Toims at 1:04 am (utc) on Nov 14, 2013]
I didn't think it should and so said it didn't matter what followed for making that decision. If it does matter, could you give some examples of the differences?
<li>attribute of a thought</li>
<p>the whole thought</p>
