h1s and lists

Nesting H1s inside li or ul

[abitdodgy]

Hello,

I'm trying to build an accessible and SEO friendly site. I'm a little confused as to how SE interpret heading versus lists. I am using lists to create sections headers that happen to be links as well. Can I use an h2 tag to denote a header inside an li tag? W3C validates it correctly, but from a point of semantics is it correct? Does it also impact SEO?

The same question I have for using <strong> insite an h1 tag. Does it make a difference? Is it semantically correct? And does it impact SEO?

Many thanks.

[abitdodgy]

Sorry, I accidentally posted this in the wrong section. It's vaguely related to CSS, I suppose, but it is not the central topic.

[SuzyUK]

@abitdogy, Welcome to WebmasterWorld! I suppose it really comes under HTML basics, and switching off CSS to see if the document still makes sense without the style.

by the rulebook, yes your HTML will validate becasue yes an <li> element can contain other in flow elements (note a <ul> can only contain li elements so don't nest the Hx tag inside the ul without putting it in a <li>), like Div's headings etc. so there's no reason why not to use them if it makes sense for your application.

I would however say that while yes it's technically OK to nest an inline element like <strong> inside the Hx element it's not likely to affect the weight very much, it might give a double "boost" as far as the SE's are concerned, but I'd be very surprised. Adding in the <strong> might even dilute it?
The heading can be styled bold or not using the CSS, direct on the Hx tag.

re: dilution it's just a thought but say the SE's weight Hx element different from <strong> i.e. they place more importance on the Hx if the <strong> is nearest to the text, which it should be, the text might gain the lower weighting.. this is all theory and I'm not even sure this still applies, but before when you broke up header text with spans (another inline element) it did affect how it was indexed.

e.g. A popular usage of that was to target the first letter..
<h1><span>T</span>his is my Heading</h1>

however I don't know if this still applies. But I wouldn't like to chance "diluting" the headers with any extraneous tags, just my opinion of course.

[abitdodgy]

Thanks for reply SuzyUK.

You had some very interesting comments that fall in my own line of thinking. I also theorized that having extra markup in the hx tags could alter the way an SE indexes keywords. This is what gave rise to my questions.

I think I will go with <ul><li><h2><a href> on my navigation since they are indeed section titles, and opt against using <strong> unless it's within a <p>... which leads me to another question: Does an SE index text found in li as page content?

For example, I have a list of three titles each with it's own descriptive text. I employed a <ul> tage with three <li>s, where each <li> lists the title followed by the text. The structure is as follows: <ul><li><h2>title</h2>text</li></ul> I'm afraid that since the bulk of my text is in the li, the search engine will not give it weight as page content. Are my fears well founded?

Also, is it imperative to have a <p> with some text to follow each <h2>?

[lavazza]

I'm trying to build an accessible and SEO friendly site<snip/>

using <strong> insite an h1 tag. Does it make a difference?

I don't know, but I doubt if its beneficial for either SEO or accessibility

To my (sighted) eyes, it seems that strong tags nested inside h1 tags makes no difference visually

A while ago I wondered if it might make a difference audibly (i.e. with screen readers), and found a study that concluded "NO":

[paciellogroup.com...]

In a recent thread on the Web Standards Group mailing list, the question arose about whether Screen Readers support semantic HTML elements such as strong and em. The short answer for the two main screen readers JAWS and Window Eyes is no. Neither do they support i or b for that matter. What is meant here by support is, do they using default settings provide an indication to the user by changing voice or some other method when text content is marked up using these elements, or do they have the option to provide an indication in their HTML specific settings.

[SuzyUK]

Does an SE index text found in li as page content?

Yes as far as I know, I had some pages open and ran a search for some text that was in lists, it found it with or without quotes.

I would also like to imagine that as long as the text is relevant, and not stuffed, that lists, just like in word documents or presentations, might actually help, i.e. "bullet points"

Lists can often make for easier human reading so why not SE reading ;)

Also, is it imperative to have a <p> with some text to follow each <h2>?

No, not imperative, but again read the document with styles turned off, does it read "normal". The text following the <li> containing the <h2> should really be another <li> (whether nested or not). You can put a <p> inside an <li>, but you don't have to, an <li> is just another container. Yes it's most frequent follower is probably a <p> in a plain text context but it doesn't have to be. A list item is a list item, and a list item can contain divs, p, hx, more lists etc..

Lavazza, that is interesting, I think mattur recently pointed that out on the other semantics thread too, it just kind of backs up the don't dilute theory too, a heading should have a strong enough semantic meaning without the <strong> tag.

[abitdodgy]

SuzyUK, that makes sense, and that is what I originally intended to do. However, I think that putting a <p> in an <li> causes the document to fail validation with W3C... I originally had this setup but decided to change it when my document failed to validate.

Unfortunately I am working on a splash page that is structured in a way which does not really require or even allow blocks of text, which gives the appearance that my heading are redundant when in fact they are not.

[lavazza]

a heading should have a strong enough semantic meaning without the <strong> tag

Suzy, I don't disagree ('scuse the 2x negative)

My initial musings were in regard to <em>, rather than <strong> in hX tags... for example:

<h1> A header with some <em>jargon</em> in it </h1>

[lavazza]

I think that putting a <p> in an <li> causes the document to fail validation with W3C

The w3c validator says OK to HTML 4.01 Strict with HXs and/or Ps nested inside LIs

[SuzyUK]

ah yes I see Lavazza, I wasn't disagreeing either just talking in relation to the first post,

my musings too ;): your em example and my span, (or strong) is where I would be wary of "dilution" seeing as it really does not have any extra meaning, I think I would tend to avoid it altogether? the extra Jaws information just kind of backs up that wee thought.

@abitdodgy
putting a <p> inside the <li> should not make it fail validation?

e.g. this validates just fine (though this is where I meant the <p> might be optional, depending on if you've other blocks of content to go in there)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title> Page Title </title>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<style type="text/css" media="screen">

</style>
</head>
<body>
<ul>
<li><h2><a href="#">This Page</a></h2>
<ul><li class="about"><p>some more information about this particular page</p></li></ul>
</ul>
</body>
</html>

perhaps if you're using nested lists there was something else wrong?

if you post a code sample of what you're trying to achieve a second pair of eyes might be able to help?

edit oops I even missed a closing </li> before the final </ul> but that doesn't matter in HTML validation as closing </li>'s are optional, so it's still implicitly closed, however I ususally always like to put them in sample code just to clear, if you're using XHTML validation then that closing </li> would be required!

[abitdodgy]

SuzyUK, you are absolutely right; the markup does validate. I must have had extra markup in my document causing the validation process to fail. Thank you both for your comments; they have been tremendously helpful. I will post a link soon on the review section of the forum to see how my project shapes up in terms of SEO and semantic markup.