Moz Q&A is closed.
After more than 13 years, and tens of thousands of questions, Moz Q&A closed on 12th December 2024. Whilst we’re not completely removing the content - many posts will still be possible to view - we have locked both new posts and new replies. More details here.
Hiding Page Titles By Display None
-
Hi. I am new to this community, and new to SEO as well. A friend asked me to give them suggestions on onsite optimization for their Drupal website.
I know page titles are very important, and usually they should be set to H1. (At least I think) This particular website has all their page titles set to H2 and they are using display:none in their stylesheet to hide them for graphic design reasons.
What would be the most practical work around for this? We don't want this to appear sketchy in the eyes of the SE's, but putting page titles at the top of their pages really would take away from their graphical design.
The second issue is that they use a module called Quicktabs for tabbed product specs on each page. Each tab is actually pulled from a post (called a node in Drupal), so each tab has it's own title that is an H2. So not only are they hiding the main page title, but they are hiding 5 others within the tabs, and their are 6 H2 elements showing up on each product page all set to display:none.
Any creative suggestions?
Hope that makes sense....
Thank you!
-
WOW! Let me just say that again, WOW!
Yes, I would suggest a Drupal person or perhaps a better template. This one seems out of date as it still uses inline CSS. As Mary Anne mentioned, there are other issues as well.
Before you try and re-write everything for the H2s, I would look at some other code issues such as the alt tags.
Personally, I would look for another template after talking to someone who knows Drupal.
All the best
-
Thanks Maryanne,
I will definitely mention those image sizes. They are pretty large.
I need to get an H1 onto these pages. H1's are important, right?
In your opinions, what would be the most effective/least harmful method of doing this....for short term until we can figure something better out.....
- Set the hidden titles to be H1's instead of H2's?
or
- Manually go into each page and create an H1 using the post WYSIWYG editor? (Using this method, the H1 would come AFTER the H2, but at least it would not be hidden)
What are your thoughts?
-
Sheesh...I knew I wasn't losing my marbles when I thought this looked more complicated than normal. This CMS is Drupal.....just FYI, here's what is happening...
These pages are made in a module (equivalent to a plug in for Wordpress) called Panels. With panels, you can define content areas within your page, kind of like creating
sections. Eachsection is called a pane. In this case, they pulled in the information they are showing in each pane through another module called Views. So, on the lt3g page, there are 2 different panes above the tabbed section.
When you create a pane, Drupal asks you for a pane title. The tabs at the bottom are also a module that pulls posts into a tabbed section. Since each post has its own title, each tab shows an H2. In total, there are 10 H2s on this page!!
And the Analytics code is Google anlaytics installed into a pane. (I don't think they had to install the code onto every page, but they did), and they titled the pane 'Analytics'
I think this might be a job for a Drupal themer. Maybe that's what I will propose this company look into.
Also, for the
| FRS Custom Solutions, which indicates there should be something before the pipe, the <title>tag would go before the pipe, and installing the page_title module would allow you to define that.</p> <p>Usually I hear good things about Drupal, but I think in this case, with the use of panels to make pages, it just complicated things.</p></title>
-
Although the hiding of those headers is a little odd, I doubt you'd get hit for it as the hidden h2's are all consistent with the displayed content - it doesn't look (to me, at least) like anything's being done in a spammy manner. H2's are a very weak ranking factor to begin with, and It's not like you're keyword stuffing or trying to rank for irrellevant keywords. Of course, if you can find someone who can tweak things and treat those elements appropriately, all the better.
Off topic, but you may also suggest to your friend that they optimize their images. Those image files on the first page you mentioned are very large for the sizes at which they are being displayed and needlessly add to the page load times.
-
On the LT3G page, you have these elements that should be headers.
- ComLink LT<sup>3G</sup>
- <sup>MEDICARE APPROVED</sup>
- <sup>ComLink LT<sup>3G</sup> - Product Overview</sup>
- <sup>With the ComLink LT<sup>3G</sup>, you can:</sup>
But they are manipulated by in-line CSS. Even though there are H2s with appropriate text for the header?
Then you have this
## Products-LT3G Main Image
Which would go above your image LT3G-Rtg-Rot-Web.png
So you are saying you do not need the text atop the image for esthetics. Which is understandable.
Therefore, why do you not have that H2 tag classed to swap the text for the image? Or can you not manipulate your CMS this way?
On the Company page I am not sure why the H2 is below the text.
## Analytics Code
And what is the analytics code? : )
First, and for other reasons than the H2, this CMS is not very good. I feel as though you will continue to have many issues moving forward. Such as page titles. For the company page you have | FRS Custom Solutions which indicates that there should be something before the pipe (|).
I do not see yet a clear way out of this as the H2s are used for headers in some cases and then for nothing in others such as the analytics code.
Am I following this correctly, or totally missing the boat here?
-
No, I have no control over showing it. Drupal forces you to give each page a title.
http://www.frs-solutions.com/content/comlink-lt3g
Here is a link to one of the inner pages. This page has an image. But here is a page with no image: http://www.frs-solutions.com/content/Company
I am not knowlegable enough with CSS and creating template pages to go about having the title display as an image on some pages, but as text on others.
-
the first question would be why have it at all if you do not want to show it. I presume you have no control over it showing?
Then I would ask; in that space, what is showing now and why could you not swap for an image?
It might be better for you to post the URL of the site so I can see what you are trying to accomplish.
-
Ok. That's what I thought. But I wasn't sure. Do you know, is there any legitimate way to hide a post title (that's forced by the CMS) from both SE's and visitors without using the image swap method?
-
Sketchy as it adds no value to the visitor. It just depends on how often SEs look at CSS as to if/when you will get penalized. They might not look at the CSS unless they see other indicators.
What you are doing I would consider keyword manipulation, and that is sketchy.
Always look at the value of what you do with respect to visitors. If it adds no value, don't do it.
I hope that helps
-
Hi Richard,
Thanks for your response. Sorry if I was unclear...I am referring to the titles of the post. Not the <title>tag. Drupal forces you to give each post a title. And yes, the post titles are set to display as H2's, but the H2's in the stylesheet are set to display:none like this:</p> <div class="cssHead focusRow "><span class="cssSelector ">h2</span> {</div> <div class=" "> <div class="cssPropertyListBox "> <div class="cssProp focusRow editGroup "><span class=" "> </span><span class="cssPropName editable ">color</span><span class="cssColon ">: </span><span class="cssPropValue editable ">#595959</span><span class="cssSemi ">;</span></div> <div class="cssProp focusRow editGroup "><span class=" "> </span><span class="cssPropName editable ">display</span><span class="cssColon ">: </span><span class="cssPropValue editable ">none</span><span class="cssSemi ">;</span></div> <div class="cssProp focusRow editGroup "><span class=" "> </span><span class="cssPropName editable ">font-size</span><span class="cssColon ">: </span><span class="cssPropValue editable ">22px</span><span class="cssSemi ">;</span></div> <div class="cssProp focusRow editGroup "><span class=" "> </span><span class="cssPropName editable ">margin</span><span class="cssColon ">: </span><span class="cssPropValue editable ">0.8em 0</span><span class="cssSemi ">;</span></div> <div class="cssProp focusRow editGroup "><span class="cssSemi "><br /></span></div> <div class="cssProp focusRow editGroup "><span class="cssSemi ">There is no image swapping or text indent. So, search engines CAN see the H2, but visitors can't. Would this be considered sketchy or creative CSS?</span></div> <div class="cssProp focusRow editGroup "></div> <div class="cssProp focusRow editGroup "><span class="cssSemi ">And no, they are not in order... H2 obviously comes first on the page, followed by an H1 element if it's manually inserted onto the page.<br /></span></div> </div> </div></title>
-
Hi April,
Headers and Titles are different, so are you saying that Drupal pulls the title from the H2? If so, are you swapping out the text for an image, or just moving the text off the screen?
It is not uncommon to move text off the screen and swap that placeholder with an image, although it would look a bit sketchy to just move the text out of sight.
[Without direct knowledge] I don't believe Google is penalizing for creative CSS work unless they spot sketchy behavior such as moving lots of text out of view, which they would see as adding no value to the visitor, but would see it as keyword manipulation.
When you swap for an image, you have to define a size for the image space. This would indicate to the SEs that you are in fact moving text and swapping for an image of a certain size.
Sketchy would look like text indent of -9999px with no width or height size or with a very small width or height size of perhaps a couple pixels. Or not even indicating an background image for the div.
In short, if you are swapping text for an image, you are fine and this is common practice as long as SEs can see that this is for visual enhancements rather than keyword manipulation.
I would not worry as much about which headers are used as long as they are used in order. Such as H1s followed by H2s followed by H3s followed by H4s. Not H2s then a H3 then H1. Not that this would penalize you, but it is best practice.
I hope this answered your question
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
-
Shifting target keyword to a new page, how do we rank the internal page?
I have been targeting one keyword for home page that was ranking between the postilion 6-7 but was never ranking on 1st as there were 2 highly competitive keywords targeted on the same page, I changed the keyword to an internal service page to rank it on 1st, I have optimized the content as well but the home page is still ranking on 11th, how do I get the internal page rank on that keyword
On-Page Optimization | | GOMO-Gabriel0 -
Duplicate 'meta title' issue (AMP & NON-AMP Pages)
how to fix duplicate meta title issue in amp and non-amp pages? example.com
On-Page Optimization | | 21centuryweb
example.com/amp We have set the 'meta title' in desktop version & we don't want to change the title for AMP page as we have more than 10K pages on the website. ----As per SEMRUSH Tool---- ABOUT THIS ISSUE It is a bad idea to duplicate your title tag content in your first-level header. If your page’s <title>and <h1> tags match, the latter may appear over-optimized to search engines. Also, using the same content in titles and headers means a lost opportunity to incorporate other relevant keywords for your page.</p> <p><strong>HOW TO FIX IT</strong></p> <p>Try to create different content for your <title> and <h1> tags.<br /><br />this is what they are recommending, for the above issue we have asked our team to create unique meta and post title for desktop version but what about AMP page?<br /><br />Please help!</p></title>0 -
How many hyphens are allowed in page titles or image names?
When I was going through certification, I was told it should be limited to one or two. I was curious if there is a change.
On-Page Optimization | | SeobyKP0 -
Getting the Titles and Headings Right on Product Pages. Userbility vs SEO
Hey Mozzers, I am optimising a chaotic section of the site including many similar products. Writing unique content etc. The titles and urls were all over the place so my first job was to tidy them up so I could make some sense of the situation, especially as sometimes they didn't even match! I should point out were on Magento, so product name = Both the Heading and Title of the page, the meta title can be set separately. When i refer to title I mean both <title>and <h1></strong><br /><br />Before they existed as such<br />URL: domain.com/200-x-0-5-g-rs-232-balance.html<br />TItle: PC-1234 200 x 0.5g x 0.3 RS-232 Balance<br /><br />This format was (Product Code, Capacities, Resolutions, Accuracy, Product Title)<br /><br />The issue was all 60 products in a page followed this format. Navigating through the page was a nightmare and was just a jumble of numbers and highly confusing even to me who learnt what they all mean, especially when you had 8 products from the same range you got presented with<br /><br />APC-1234 200 x 0.5g x 0.3 RS-232 Balance<br />APC-1235 500 x 1g x 0.3 RS-232 Balance<br />APC-1236 1000 x 2g x 0.3 RS-232 Balance<br />APC-1238 5000 x 10g x 0.3 RS-232 Balance<br />APC-1239 10000 x 15g x 0.3 RS-232 Balance<br />APC-1210 20000 x 25g x 0.3 RS-232 Balance<br />APC-1211 50000 x 50g x 0.3 RS-232 Balance</p> <p>I changed them to something more user friendly.<br /><br />URL: domain.com/200g-precision-balance.html<br />Title: 200g Precision Balance<br /><br />This has seen the following benefits<br />- URL is now clear and means something to the user<br />- Product titles are easy to navigate and the page is more pleasing to the eye<br />- The jumble of numbers in the title are now all labelled and shown below each product listing in bullet point so the user can see the basic spec of a product without having to decipher any titles<br /><br />Upon reflection I has a couple of concerns I was hoping you could discuss, I am wondering if I have made the titles too simple.<br />1) I have no product code in the title<br />We have our own products manufactured and sell existing brands with their own product codes. Some of these can be lengthy. Adding them makes them hard to the eye and the page looked cramped.<br /><br />The codes are listed beneath each product title on category pages and on a list on the actual product page, but no where in the titles. <br /><br />2)None of our products have a brand listed in the title<br />None of the products on the site had brand names in anything but the images when i started and as such it snuck under my radar. But should i pre-fix all titles with a brand name?<br /><br />Should </p> <p>URL: domain.com/200g-precision-balance.html<br />Title: 200g Precision Balance</p> <p>become</p> <p>URL: domain.com/BRAND1-200g-precision-balance.html<br />Title: BRAND1 200g Precision Balance<br /><br />My instinct tells me to change things to include brands as its useful to the customer and should have an SEO benefit, but to leave out product codes as they are accessible to the customer where they are now and dont make things messy and unreadable.<br /><br />As always, thanks for the input!</p></title>
On-Page Optimization | | ATP0 -
SVG image files causing multiple title tags on page - SEO issue?
Does anyone have any experience with SVG image files and on-page SEO? A client is using them and it seems they use the title tag in the same way a regular image (JPG/PNG) would use an image ALT tag. I'm concerned that search engines will see the multiple title tags on the page and that this will cause SEO issues. Regular crawlers like Moz flag it as a second title tag, however it's outside the header and in a SVG wrap so the crawlers really should understand that this is a SVG title rather than a second page title. But is this the case? If anyone has experience with this, I'd love to hear about it.
On-Page Optimization | | mrdavidingram2 -
What is on page links?
Hi - i would like to know exactly what an on page link is? i understand the linking system however cant work what exactly what an on page link is? Thanks
On-Page Optimization | | OasisLandDevelopment0 -
Page Title in Local SEO Title Tags?
Hi All, Still working on my title tag usage for local SEO, and I was hoping for some more feedback. My question is this: In Local SEO titles, I'm using location + keyword combinations, unique on each page. However, since each page has a specific title for the client, I figure I should be placing that at the front. My thought here was that this helps with the overall usability to the reader of the website. Ex. Contact Us page for Pizza shop Contact Us | Springfield IN Gourmet Pizza | Moe's Italian Pizza Anyone have thoughts on this one? Thank you!
On-Page Optimization | | kbaltzell0 -
Missing meta descriptions on indexed pages, portfolio, tags, author and archive pages. I am using SEO all in one, any advice?
I am having a few problems that I can't seem to work out.....I am fairly new to this and can't seem to work out the following: Any help would be greatly appreciated 🙂 1. I am missing alot of meta description tags. I have installed "All in One SEO" but there seems to be no options to add meta descriptions in portfolio posts. I have also written meta descriptions for 'tags' and whilst I can see them in WP they don't seem to be activated. 2. The blog has pages indexed by WP- called Part 2 (/page/2), Part 3 (/page/3) etc. How do I solve this issue of meta descriptions and indexed pages? 3. There is also a page for myself, the author, that has multiple indexes for all the blog posts I have written, and I can't edit these archives to add meta descriptions. This also applies to the month archives for the blog. 4. Also, SEOmoz tells me that I have too many links on my blog page (also indexed) and their consequent tags. This also applies to the author pages (myself ). How do I fix this? Thanks for your help 🙂 Regards Nadia
On-Page Optimization | | PHDAustralia680