Display: none
-
A prominent SEO consultant recently told me that using display:none in the css is still a bad idea. We built a simple drop down menu using widely used jquery techniques and it uses display:none to slideToggle the menu.
Does anyone else think this is a bad idea? If so, how should I change it since just about every jquery drop down I come across uses the slideToggle/display:none.
-
I'd suggest checking that any jquery solution hides stuff with display:none after the page has loaded. Essentially is the content/menu fully visible when you turn javascript off and load the page? (regardless of how horrific the display looks?)
Bear in mind that Google also advises against things like display:none for implementation of things like microformats.
-
Using display:none is fine. There's JavaScript on the page that will make those items display when the users takes some action on the menu. Google has some way of reading the JavaScript to see what may be displayed, and at this point, I'm sure they're very good at detecting these types of menus. I don't think you can't make a menu like that without using it, and tons of sites use them.
Obviously, you shouldn't use display:none to cloak text on the page, when no user action can get that text to be displayed.
-
Conventional wisdom says this is a bad idea because its a technique used by black-hats to stuff keywords into their documents. See:
http://www.mattcutts.com/blog/seo-mistakes-unwise-comments/
However, for JQuery and things like menu's and screen reader links, Google appears to know the difference. See:
http://www.google.com/support/forum/p/Webmasters/thread?tid=50f9a4942ac605ec&hl=en
The takeaway is you can use this, and its unlikely to get your site penalized. But be careful that what you're doing is both (a) common practice and (b) couldn't get caught in a spam finding algorithm. If you are in MLM or pharmaceuticals or something that often gets associated with spam, you'll want to avoid using these techniques. If there's no way your site could be considered spam and you're using display:none legitimately, then you'll be safe.
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
-
Display ads and SEO
I have a section(no. of webpages with content) on my site with display ads. The site is mainly for UK visitors. I want to show ads to UK visitors but not US visitors. Rest of the content will be the same for UK and US. There will just be 1 page with same UrL for US and UK. Hence, no href lang tags are being used.
Technical SEO | | Kohliharleen
Is there any correlation between display ads and SEO? Would not showing ads in US cause any issues for bots or do bots consider display ads and SEO as two completey different aspects. Asking as Google bot crawls from the US.1 -
Bing result title is displaying a competitors name
When searching "Cambridge Savings Bank" which is the specific name of a bank in Bing the search results return with them as Number one with the correct URL. The issue is Bing has titled the search result "East Cambridge Savings Bank" (which is another entity all together) and still has the correct www.cambridgesavings.com URL. So basically Bing is putting another corporation's name on our website. This issue only is in Bing. Any idea how to correct this? 2.png 1.png
Technical SEO | | BOD20081 -
Incorrect Logo is Displaying on Google Knowledge Graph - Need Urgent Solution!!
Incorrect Logo is Displaying on Google Knowledge Graph for our company. We have structured schema for logo etc. But still, Google is fetching and showing logo from some other sources on google search results. What will be the right fix for this? Our site url : http://www.travelyaari.com/
Technical SEO | | RobinJA0 -
CSS Float Top Left Image not displaying
Using CSS/HTML in Dreamweaver CC, I am trying to display a SEO friendly matrix of six images wide by three deep on the Home Page, but cannot get the first (top left) image to display consistently. The page appears correctly in Dreamweaver Design View, but not in the Live View. Equally it works fine in Safari, but not in Firefox nor I.E. I seem to have tried every CSS variation to resolve this issue, without success. Can someone stear me in the right direction, please? The relevant HTML Code ... Celotex PL4050 - 62.5mm insulated wallboard from £11.96 per m² / £34.45 per board SuperFoil SF19 40mm Multi-foil Roll from £5.23 per m² / £98.00 per 18.75 m² Roll Celotex GA4000 General application Rigid PIR from £8.56 per m² / £24.66 per board Rockwool Full-fill 75mm Cavity Wall Slabs from £3.51 per m² / £1.92 per slab Knauf Earthwool 270mm Loft Roll 44 Combi-Cut from £3.80 per m² / £22.51 per 9.93 m² Roll Kingspan Kooltherm K8 75mm Cavity Wall Boards from £16.26 per m² / £8.79 per board Knauf Earthwool 170mm Combi-cut Loft Roll 44 from £3.16 per m² / £25.34 per 8 m² Roll Kingspan Kooltherm K7 Rigid Phenolic Foam - 75mm £13.91 per m² / £40.05 per board ... The associated CSS code ... #popular {
Technical SEO | | JustInsulation
width: 1050px;
height: 800px;
overflow: hidden;
width: auto;
height: auto;
}
#product1 {
background-image: url(../007-graphics/popular/01-prod.png);
background-repeat: no-repeat;
width: 150px;
height: 265px;
margin-left: 24px;
float: left;
overflow: auto;
clear: left;
}
#product2 {
background-image: url(../007-graphics/popular/02-prod.png);
background-repeat: no-repeat;
width: 150px;
height: 265px;
margin-left: 10px;
float: left;
opacity: 0.85;
}
#product3 {
background-image: url(../007-graphics/popular/03-prod.png);
background-repeat: no-repeat;
width: 150px;
height: 265px;
margin-left: 10px;
float: left;
max-height: 275px;
opacity: 0.85;
}
#product4 {
background-image: url(../007-graphics/popular/04-prod.png);
background-repeat: no-repeat;
width: 150px;
height: 265px;
margin-left: 10px;
float: left;
max-height: 275px;
}
#product5 {
background-image: url(../007-graphics/popular/05-prod.png);
background-repeat: no-repeat;
width: 150px;
height: 265px;
margin-left: 10px;
float: left;
max-height: 275px;
opacity: 0.85;
}
#product6 {
background-image: url(../007-graphics/popular/06-prod.png);
background-repeat: no-repeat;
width: 150px;
height: 265px;
margin-left: 10px;
float: left;
max-height: 275px;
opacity: 0.85;
}
#product7 {
clear: both;
background-image: url(../007-graphics/popular/07-prod.png);
background-repeat: no-repeat;
width: 150px;
height: 265px;
margin-left: 24px;
float: left;
max-height: 275px;
opacity: 0.85;
}
#product8 {
background-image: url(../007-graphics/popular/08-prod.png);
background-repeat: no-repeat;
width: 150px;
height: 265px;
margin-left: 10px;
float: left;
max-height: 275px;
}
#product9 {
background-image: url(../007-graphics/popular/09-prod.png);
background-repeat: no-repeat;
width: 150px;
height: 265px;
margin-left: 10px;
float: left;
max-height: 275px;
opacity: 0.85;
} ... The complete code is located at - www.just-insulation.com/index.html0 -
Rich Snippets Inconsistent Display
Hi Folks, We implemented Schema mark up on our hotel details page many months ago now (previously we had a different mark up language, but switched to Schema during a complete page re-design). Its been live for plenty of time now and is being picked up in webmaster tools. http://www.asiarooms.com/en/singapore/singapore/175433-orchard_hotel_singapore.html Even before we switched to Schema we had a very inconsistent display of rich snippet data in the search results and this has continued despite the mark up being implemented correctly. For example, a search in Google Singapore for 'Orchard Hotel Singapore' shows the AsiaRooms.com listing without any rich snippets. You can see that the vast majority of our competitors like Agoda, Booking.com always show rich snippet data (search for 'orchard hotel singapore agoda' for example). I have checked the hotel in the rich snippet testing tool and its marked up correctly such that it should feasibly show the review count and the score. http://www.google.com/webmasters/tools/richsnippets?url=http%3A%2F%2Fwww.asiarooms.com%2Fen%2Fsingapore%2Fsingapore%2F175433-orchard_hotel_singapore.html&html= Whilst Agoda and Booking seem to display rich snippet data on literally EVERY hotel, its very inconsistent for AsiaRooms which is extremely frustrating - feels like some kind of punishment or favouritism. Any ideas why this might be the case and anything I could try to resolve it? Thanks, Ben
Technical SEO | | BenRush1 -
Getting a video displaying a lightbox indexed
We have created a video for a category page with the goal of building links to the page and improving the conversion rate of visitors to the page. This category is Christmas oriented so we want to get the video dropped in ASAP. Unfortunately there was a mixup with our developer and he created a lightbox pop-up to display the video on the category page. I'm concerned this will hurt our ability to get the video indexed in Google. Here was his response. Is what he says here true? "With the video originally being in lightbox the iFrame Embed was enough since the video can't be on the page, it would have to be hidden on the page which is ignored by Google. The SEO would be derived from modifying the video sitemap to define the category page as the HTML page for the Wistia video and Google will make the association. The sitemap did all the heavy lifting, the schema markup did not come till later so it had no additional affect on Google other then to re-enforce the sitemap." Thanks for your help!
Technical SEO | | GManSEO0 -
Why is Google not displaying the right URL on SERP?
Google is not displaying the URL correctly for this page. (See image) Here is the search that I performed: http://goo.gl/xk7L8 If you click on the URL, it doesn't take you to the page that it the URL references. Any ideas? It should show this URL: http://www.theskincentermd.com/breast-enhancement tsc-serp.png
Technical SEO | | theBREWROOM0 -
Updated title tags not displayed in SERPs?
A couple weeks ago I updated the title tags and URLs of some of my site's top landing pages, but the new versions aren't indexed in Google. Webmaster tools says that my site has been crawled since updated. I'm using a pretty old version of Joomla for a CMS, and had to fight with the plugins a little bit to make it all work (sh404SEF for the URLs and sh404SEF Custom Tag Module for the title tags). For example, www.radiussecurityinc.com's indexed title is still: Radius Security Solutions | Home But should be: CCTV System Design - IP Industrial Surveillance | Radius Security Other pages besides the home page have the old title tags as well as old URLs. Any ideas how I can fix this? Thanks a lot in advance! Jeff
Technical SEO | | jaysan0