17

For what it's worth, I'll offer my own take on this. Hidden text alone is not deceptive. What you do with it is what determines whether it's deceptive. There are many scenarios in which hidden text is a good thing, both in terms of accessibility, functionality and just pure awesomeness. But there are also some setbacks, and times where hidden text may ...


11

I agree with w3d’s answer, there should be no problem with Google Search or any other search engine. However, I suggest to make it visible anyway. Not for SEO, but for accessibility: Screen reader users are not the only users that can benefit from skiplinks. Skiplinks are useful for all users that navigate with the keyboard, and only a subset of those ...


8

I can't see any reason why Google would think a hidden "Skip to content" link was deceptive. Are you flooding the page with hidden keywords or trying to deceive the search engines? No. Google is no doubt very aware of "skip to content"-like links. They have been recommended by the W3C after all. Google does state (in the article you link to) that "not all ...


8

Your rich snippet data needs to be visible to users. From Google's rich snippet troubleshooting: Is your marked-up content hidden from users? In general, Google won't display any content in rich snippets that is not visible to human user. It can be tempting to add all the content relevant for a rich snippet in one place on the page, mark it up, and ...


7

You refer to pages and posts so presumably you're using Wordpress and if you are, you can easily show content based on whether the page is a post or a page which saves you from having to hide anything with CSS anyway. if ( is_page() ) { // This is what you want to show in the footer for pages... } else { // This is what you want to show in the ...


6

Yes Google does index content in hidden div tags see the test results here http://tomaltman.com/does-the-google-bot-index-css-hidden-divs/ I have hidden a secret word in a div which I hid via the css style="display:none" on the home page... The Google Bot did index the information in the hidden div. (September 28, 2011)


5

Yes, only one H1. But there's an easy solution, which has it's own flaws (you could get very weird titles in SEO results!): <h1> <span class="responsive-hidden">This is my title</span> <span class="hidden responsive-show">This is my title</span> </h1> This is not a perfect solution! This is perfect for less ...


4

Other answers say that Google would allow this, but they don't say what hidden text Google penalizes for. Google only considers hidden text deceptive when: There are hidden keywords that users might search for but then be upset when they find that your site doesn't have them. Users are not likely to be searching for "skip to content" The hidden text ...


4

Your goal is excellent, and I think the approach you are looking for is already existent in CSS as @media and display. One option HTML <a href="#" class="menu_links"><span class="hidetext">Graphic </span>Design</a> CSS @media screen { span.hidetext { display: none; } } @media aural { span.hidetext { display: inline; } } ...


4

If your text is visible to humans and search engines alike than this is fine. When it comes to SEO, it's not the technique that is bad. It's the intent. Your content is visible to everyone and is not an attempt to manipulate your rankings so you're fine.


4

The logo is content, not presentation. So it should be included in the HTML, not in the CSS. Therefore using the img element is the appropriate choice. However, you should not use the alt value "Logo" for it; use the company name (i.e., what the logo stands for) instead. And then you could and should omit the title attribute. (And the title attribute of the ...


3

This has been asked several times on varous stack's and in various forms, there is no right or wrong answer because Google does understand the text-indent usage when using background, however... It is widely agreed that using a proper image using an ALT tag is the better way of keeping your code more semantic and having better accessibility. For example ...


3

What you're doing is a legitimate practice and should not impact your organic visibility. The definition of cloaking is: "...the practice of presenting different content or URLs to human users and search engines." You are not doing this. You're instead creating a temporary load screen until the browser has reached the load event, at which point you're ...


3

Googlebot now renders pages and views the page as a user sees it when it loads, including applying CSS and running JavaScript. Google will detect text that is hidden using either CSS or JavaScript. Google will penalize a site for hiding keyword rich text that cannot be viewed by users. They call the practice cloaking: showing content to search engine ...


2

This will not be an issue at all. Google doesn't penalize websites because of hidden content. They penalize sites that hide content for the explicit purpose of manipulating their search engine rankings. So what you're doing is fine since any user can see that content simply by clicking on a link. In fact, what you're doing is extremely common and even used ...


2

Javascript?.... no problem! kind off... Google and other search engines have had the ability to make sense of JavaScript for some years, however depending on how complex your scripts are will determine how easily the search bots can make sense of it all. No javaScript fall backs Generally its always best practice to ensure your pages can some what viewed ...


2

If you try to show content to Google and not users, you'll be trouble because that's cloaking. Search engines are actually crawling your content for it's users so if these end users can't see the content then whats the point. May be you could provide some sample of you book, which can also be crawlable.


2

The question is interesting but brings back memories of a time when people would debate IF Google could read Flash. And if text in flash was - as you ask here - visible or possibly to be viewed as a technique to add (blackhat) content. The answer to the Flash story was and is "Google reads EVERYTHING". And TEXT made for screen readers (etc) that is USEFUL to ...


2

As most optimized variation i would consider the one which contains most SEO-relevant signals. And this is in my opinion this one: <div itemscope itemtype="http://schema.org/Organization"> <a itemprop="url" href="http://www.example.com/" title="My Firm"> <h1 itemprop="name">My Firm</h1> <img itemprop="logo" src="http://...


2

You should use the <img> solution rather than the background image solution. Most sites have a logo image rather than a logo background -- Google supports it fully. The standard image solution also works best with accessibility. The background image solution could possibly get you penalized for hidden text or keyword stuffing. (I would say that ...


2

It's actually very common to see sites using display: none on elements that do not render correctly on smaller screens. Not hiding breadcrumbs unless addressed can actually harm your mobile ranking due to Googles stance on Size Tap Targets Appropriately. Small or tightly packed links or buttons are more difficult for users to accurately press on a ...


2

Google does not punish sites with hidden elements, in fact its been like this for several years. Nowadays Google is much smarter than it was a decade ago, their bots are able to understand a great deal of standard JavaScript scripts, CSS code and modern CSS3 stylesheets. Google rarely punishes sites for hiding text because keyword stuffing no longer works ...


2

Search engine bots evaluate HTML content, not CSS positioning. Whatever text you have inside your HTML elements is all that matters. So one question is, is the about page filled in on this one at the same time or fetched later? If it's fetched from a different URL, /about, search engines can find that, too.


2

When you don´t put something in between, are your links even visible / klickable on your page? Normally you would attach a link to a picture like this. <a href="image1"><img src="example.jpg" alt="example pic"></a> If your images are created through CSS you should include the html elements on which the CSS is creating the images in ...


2

Google does crawl and see content in the page that is hidden by default. However Google does not usually index content that is initially hidden. Googlebot now renders pages and indexes the parts of the page that are visible on page load. Occasionally Google will index hidden content if it knows it can easily be shown. When it does so, it usually gives ...


2

Search engines look at page source, not the cosmetic aspect of a design directly*. Providing you are using CSS for your overlays and transitions, not scripting that hinders crawlers you will be perfectly fine. Just be sure to provide correct HTML attributes such as Alt ( unless you're using a background image ), Title and make sure the text still has a ...


2

According to Google's recommendations Structured Data General Guidelines: Important: Google does not guarantee that your structured data will show up in search results: ....The content referred to by the structured data is hidden from the user. Accordingly, your website may have a high risk of getting a penalty from Google. Do not do this.


2

Absolutely not, on the contrary, you could be penalized by cloaking. Cloaking is a search engine optimization (SEO) technique in which the content presented to the search engine spider is different from that presented to the user's browser. Google understands CSS styles (especially the ones used to hide content) so that strategy can backfire you ...


2

For such a purpose, the meta element can be used. It’s visually hidden by default. <meta itemprop="bestRating" content="5" /> (For representing a rating value in HTML, you could also use the meter element, which allows setting the min and max with HTML attributes.) For the structured data, it doesn’t matter whether the data is visible or not. For ...


1

Is there any technique or best practice or whatever I can use to hide some text only for screen readers? I can give an answer for the "whatever" part of your question. Create an image and add text in it using your image manipulation program. Then for the most secretive approach, use CSS to define your image as a background of a DIV element. Here's code to ...


Only top voted, non community-wiki answers of a minimum length are eligible