Text-Indent trick and SEO

Thank you both for the answer! Yeah, I have read the guidelines shortly after asking the very question and it seems that the algorithm for Google is going to search CSS aswell, or at least it is able to check styling values like transparent, opacity 0 and so on, so to avoid the "Bulk Keywords Action" that some SEO specialists use to do!

Thanks guys!

That link is about text that exists to manipulate search rankings. That link also says that not all hidden text is deceptive. If all hidden text was deceptive then websites with drop down menus, or slideshows, or accordion style faq's where you click on the question to reveal the previously hidden answer would all be seen as deceptive because it contains hidden text.

The technique outlined in this video is an old one but it's essentially a font replacement technique. The image shows the same text as in the h1. I don't feel there's anything deceptive about this.

This video seems to suggest that it's ok but you should move on to more modern techniques: https://www.youtube.com/watch?v=hb4LYWxXESY

Now that we have web fonts it's not as necessary to have our text in images to achieve a certain font.

Can we at least agree that the answer is not cut-and-dry? The debate has been going on for years and isn't likely to stop any time soon.

This video from Google, while older than the one you posted, blatantly states the following:

use alt text rather than CSS when your logo is an image

So, sure, Google probably won't blacklist your site for using the logo text indent trick, but based on what Google has said regarding this issue I still think best practice would be using the alt attribute. What it comes down to is the fact that you're indenting the text off-screen in order to improve search engine rankings; if a webpage was created without rankings in mind, there would be absolutely no reason to do this. This is directly contrary to the Google guidelines of "create websites for users, not for search engines."

By the way, for anyone who searches on this topic in the future, another thing to consider when using large text indents is performance. The web browser has to calculate and draw a 9999px (or whatever) box, even if it's not within the viewport. While the performance hit is negligible to modern computers, older computers and some devices (e.g. the first iPad) will suffer noticeably. A better method is:

text-indent: 100%; 
white-space: nowrap; 
overflow: hidden;

Yes, I do think it's not cut-and-dry and I agree that you should move on to something else.

I don't think it is being indented off screen though to improve search engine rankings. It's moved off screen so that visual users don't see that text with whatever fonts they have installed on their system but instead see the text in the image with the specific font the designer wanted them to see. As I mentioned, this is an older technique that was more common when web fonts weren't as prevalent.

Doing this today you would probably have an image of the gear and the h1 text would be live text visible on the screen using a web font. There's no need to hide the text off screen.

Another problem too is that not everyone agrees on whether or not a logo should be an html image with the img tag or a css background image. So you can certainly do the alt text if you have an html image but if you're in the css camp then you don't have that available to you.

I wish there were definitive correct answers on these things because you need to get your project done and you want to do the best things that you can.