Other tags inside an H1 tag
-
So I have a situation with the website I'm currently redesigning where the H1 titles are supposed to mix colors per the current brand strategy.
The branding crew is adamant that this has to be done so there is no use in saying "just don't do it".
To accomplish this I'm wrapping the words that need to be the other color in a .
Additionally, some pages have a "sub text" as part of the title, floated to the right and in a smaller font but with the same multi color treatment. I'm wondering if the sub text should be in an H2 and positioned to the right or if it would be beneficial to have the text in the H1 as well.
An example of what I'm talking about would be something like this: "Big Shoes for Big Guys - Nike Shoes"
In that, the "Big Shoes" and "Nike" would be one color and the "for Big Guys" and "Shoes" would be another. I can imagine having the "Nike Shoes" as part of the H1 would be a good idea in some respect but I'm not certain of that.
In order to make that happen I can only think of one way to do it:
-H1-
Big Shoes
-span- for Big Guys -/span-
-div- Nike
-span- Shoes -/span-
-/div-
-/H1-So that brings me back to the original concern, do search engines care about tags inside the H1?
The only other way to accomplish the color changes that I can think of would be to have a fairly large chunk of javascript setup to go through H1's to colorize them using the span tags. That is unless GoogleBot has started to execute javascript while crawling the sites now...
-
I tend to use this quite a lot; It does not harm Search Engines, what is important is that only inline elements are contained within an H1 tag, that is
spanis a perfectly valid element, however adivis not. In your case you should use multiple spans with separate class names.You should also consider splitting it into H1 / H2 depending on your site structure and navigation as it might make more sense in some cases.
-
It's fine to include tags withing an
, but including awithin an
goes against HTML conventions.
-
To answer your question, a span tag within a H1 tag will not have any negative effect, its quite normal to use markup to add visualize appearance, and a span tag is not "semantic" markup.
Once you are not splitting up the word, as is using
Nike
, I have read that the robots would read that as N "space" ike ... hence not the word nike
BTW, thats a very crude and unsemanctic way to style that phrase, why the div within the H1 tag
I would use a below, without having the benefit of seeing your website layout of course
Big Shoes for Big Guys
Nike Shoes
Then add your markup and styling within the the classes
If you need anymore help with the styling, give me a shout
Regards
John
Got a burning SEO question?
Subscribe to Moz Pro to gain full access to Q&A, answer questions, and ask your own.
Browse Questions
Explore more categories
-
Moz Tools
Chat with the community about the Moz tools.
-
SEO Tactics
Discuss the SEO process with fellow marketers
-
Community
Discuss industry events, jobs, and news!
-
Digital Marketing
Chat about tactics outside of SEO
-
Research & Trends
Dive into research and trends in the search industry.
-
Support
Connect on product support and feature requests.
Related Questions
-
How to avoid duplicate title tags?
I've got roughly 1200 location pages for a travel client. Since the business does the same thing at every location, the title tags and descriptions are almost identical except for the location name. I know Google likes tags and meta descriptions to be unique, but how many different ways can I write the same title in a 55 character limit? For example, here's how the titles look: Things to do in San Jose, CA | Company Name
Web Design | | Masbro
Things to do in Dallas, TX | Company Name
Things to do in Albuquerque, NM | Company Name **My question: Are 1200 title tags structured this way unique enough for Google? ** I have got the same problem with the meta descriptions, but I can vary those a bit more because i have more characters to work with. Thanks for your input,
Dino2 -
How to make my site title H1?
Hi In my Header.php I have the following php code for my title: <title><br /><?php<br />// Generate Page Title dynamically<br />if (is_home()) {<br /> bloginfo('name'); ?> - <?php bloginfo('description');<br />} elseif (is_category()) {<br /> single_cat_title(); ?> - <?php bloginfo('name');<br />} elseif (is_single()) {<br /> single_post_title();<br />} elseif (is_page()) {<br /> bloginfo('name'); ?>: <?php single_post_title();<br />} elseif (is_404()) {<br /> bloginfo('name'); ?> - <?php _e("Page not found", "fungames");<br />} elseif (is_search()) {<br /> bloginfo('name'); ?> - <?php _e("Search results for", "fungames"); echo esc_html($s, 1);<br />}<br />?><br /></title> This generates a good title different for every page/post I have on my site. But is now H1. I want the same code if, but with H1 tag somewhere in it. Cant figure it out how to do it! Can u help please?
Web Design | | Catinas970 -
Wordpress - redirecting tags
I just ran a webmaster tool from Yoast SEO premium and notice I have a lot of problems with tags (restricted-robots-txt) For example : http://www.soobumimphotography.com/tag/wedding-group-photo/ Do I have to redirect to http://www.soobumimphotography.com/wedding-group-photo/ Should I do this to each and every posts Thank you
Web Design | | soobumim0 -
Does using role="heading" instead of H1 in HTML code affects SEO?
Does using role="heading" instead of affect SEO? http://www.w3.org/WAI/GL/wiki/Headings_using_role%3Dheading
Web Design | | LNEseo0 -
Using H tags and its maximum Limits
hi..
Web Design | | funclub247
I want to Know what is a Maximum limit of using H tags in One Page : for Eg : I Know That I Can use Only One H1 Tag per Page, What about Other H tag Limit..
h1 - 1 time Maximum
h2 - ..?
h3 - ..?
h4 - ..?
h5 - ..?
h6 - ..?
h7 - ..?
.....
i want to target more than 30 key word using H tag as a header of the paragraph...1 -
Changing H1 Tag based on referrer
Hello, I need some quick help and advice. We're going through a website re-design, and we have a few H1 tags set on some of our inner pages. The team is ok with these, however they want to change the H1 tag if the user gets to that page from a page within the site. Example:
Web Design | | uSell
When the referrer is our site (www.domain.com), the H1 tag = Go to Step 2 When the referrer is anything else, the H1 tag = Welcome to our site I'd like to keep the H1 tag as the SEO rich keyword text we agreed on (in this case "Welcome to Our Site"), however our developers don't think its directional enough and wants to change it based on the user path. I'm ok with the suggestion, however I want to make sure that if we choose the option with the referrer that this doesn't impact our SEO efforts. I'm assuming the referrer will changed based on how the bot gets to the page, but i'm not certain and was wondering if anyone had some thoughts on this.. Any help is greatly appreciated. Thanks...0 -
Missing Meta Description Tag - Wordpress Tag
I am going through my crawl diagonostics issues and I have lots of "Missing Meta Description Tags". However when I look at the url's they are Wordpress Tags, which do not have a meta description. Shall I just ignore these errors or should I find a way to add a meta description? Is it important?
Web Design | | petewinter0 -
How to Add canonical tags on .ASPX pages?
What is the proper way (or is it possible) to add canonical tags on website pages that end in .aspx? If you add a canonical tag to the Master Page it will put that exact canonical tag on every page, which is bad. Is there a different version of the tag to put on individual pages? And one to put on the home page without the Master Page error?
Web Design | | Ryan-Bradley0