6 {{ upvoteCount | shortNum }}
6 {{ upvoteCount | shortNum }}

can bullet titles be h4? its not working for me?

by Murkr
6 replies
  • SEO
    • |
i finally wrote my first SEO optimized content and im working on formatting the page structure right now and i ran into a problem and cant find anything online about it.

so i have something that i want in heading 3 and under it i have bullets, and i want to make the title of those bullets heading 4 but it wont let me, does a heading have to be an entire line or something? because its tries to make the entire line h4

for example:

<h3>Wind Damage </h3>
  • <h4>Shingle Roof Damage</h4> - <p>blah blah blah</p>
  • <h4>Tile Roof Damage </h4> - <p>blah blah blah</p>

is that not possible above^^ because that's how im trying to do it, but its not letting me, it wants to make then entire bullet h4 instead of just the title of the bullet.
#bullet #titles #working
  • Profile picture of the author Tim3
    No you cannot do what you are wanting to do there unless you hack something, it's not worth the effort imo.

    A compromise would be to use the bold tag <b> instead of H4, which, depending on your template, will likely come out the same size in bold.

    Stuffing your site with H tags won't help your SEO
    Signature

    {{ DiscussionBoard.errors[10429723].message }}
  • Profile picture of the author yukon
    Banned
    You could wrap the <h4> in a <div>, <span> or <p> tag & then style the <div>/<span>/<p> with CSS.



    HTML Code:
    <!DOCTYPE html>
<html>
<body>

<ul>
  <li><div style="font-size:15px; color:green"><h4>My Text1</h4></div>Some text here1...</li>
  <li><div style="font-size:15px; color:red"><h4>My Text2</h4></div>Some text here2...</li>
<li><div style="font-size:15px; color:orange"><h4>My Text3</h4></div>Some text here3...</li>
</ul>  

</body>
</html>
    {{ DiscussionBoard.errors[10429775].message }}
    • Profile picture of the author paulgl
      Since the standard bullet would be roughly (if not the exactly) the same size
      as h4, it's a non issue. Use the h4's and move on.

      Paul
      Signature

      If you were disappointed in your results today, lower your standards tomorrow.

      {{ DiscussionBoard.errors[10430145].message }}
  • Profile picture of the author Murkr
    hmm thats strange i think my post was deleted.

    anyways, thanks for the tips, especially yukon. i just finished my first ever SEO content, and im also new to web development so i hope i structured it correctly.

    Anyone who posts in this thread i will pm it to you if you'd like, i'd really like some feedback, i think its really good, but i dont know what experts will think.
    {{ DiscussionBoard.errors[10434708].message }}
  • Profile picture of the author yukon
    Banned
    This HTML/CSS code is tested & will do what OP is asking.

    The red text on the four bullet list in the screenshot below are all <h4> tags with the font sized to whatever you need in the CSS. Breaking out of the HTML block level requires some CSS padding on the right of the <h4> tags, you can adjust the padding as needed (padding-right:20px). If you need to move the list around the page use the margin CSS for offsets.

    Remember less is more with heading tags for SEO, keep the heading tag text focused on the page subject & treat them like alternative page titles (SERP listing titles).










    HTML Code:
    <!DOCTYPE html>
<html>

<style>

h4 { 
    display: inline;
	color:red;
	font-size: 15px;
        font-weight: bold;
	padding-right:20px;
	margin-left:0px;
}

p { 
    display: inline;
}

li {
	padding-bottom: 20px;
}

</style>

<body>

<div style="width:600px; margin:0 auto;">

<ul>

<li><h4>First heading tag</h4><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra sapien vel risus scelerisque efficitur. Nam eu condimentum nunc. Morbi eget feugiat justo. Donec cursus massa id dui scelerisque efficitur. Praesent gravida nibh justo, volutpat semper felis finibus ut. Praesent commodo ipsum libero, vel lobortis ipsum tincidunt a. Aliquam erat volutpat. Praesent non sem tincidunt, venenatis elit sed, feugiat est.</p></li>

<li><h4>Second heading tag</h4><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra sapien vel risus scelerisque efficitur. Nam eu condimentum nunc. Morbi eget feugiat justo. Donec cursus massa id dui scelerisque efficitur. Praesent gravida nibh justo, volutpat semper felis finibus ut. Praesent commodo ipsum libero, vel lobortis ipsum tincidunt a. Aliquam erat volutpat. Praesent non sem tincidunt, venenatis elit sed, feugiat est.</p></li>

<li><h4>Third heading tag</h4><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra sapien vel risus scelerisque efficitur. Nam eu condimentum nunc. Morbi eget feugiat justo. Donec cursus massa id dui scelerisque efficitur. Praesent gravida nibh justo, volutpat semper felis finibus ut. Praesent commodo ipsum libero, vel lobortis ipsum tincidunt a. Aliquam erat volutpat. Praesent non sem tincidunt, venenatis elit sed, feugiat est.</p></li>

<li><h4>Fourth heading tag</h4><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra sapien vel risus scelerisque efficitur. Nam eu condimentum nunc. Morbi eget feugiat justo. Donec cursus massa id dui scelerisque efficitur. Praesent gravida nibh justo, volutpat semper felis finibus ut. Praesent commodo ipsum libero, vel lobortis ipsum tincidunt a. Aliquam erat volutpat. Praesent non sem tincidunt, venenatis elit sed, feugiat est.</p></li>

</ul> 

 </div>

</body>
</html>
    {{ DiscussionBoard.errors[10434782].message }}
  • Profile picture of the author yukon
    Banned
    You can hide the HTML bullets by adding the code below to the CSS in the example code I posted above.


    HTML Code:
    ul {
	list-style: none;
}
    {{ DiscussionBoard.errors[10434785].message }}

Trending Topics