Is this ethical?

[weslinda]

So I came across this on a fairly well know web site and I was wanting to see what everyone thinks. Is this ethical?

h1 {
display: block;
height: 150px;
width: 533px;
position: absolute;
top: 0;
left: 200px;
padding: 0;
margin: 0;
font-size: 8px;
text-indent: -9000px;
overflow: hidden; }

It appears to me that they are attempting to have H1 tags with text in them, but not show them on the actual page. So what does everyone think?

My personal take is that it is wrong, and poor practice to say the least. Will CSS become the new tool to spam the search engines? Is this spamming? What would this be called if not spam?

[incrediblehelp]

Doesnt make much sense why hide the content from the spiders. Hiding code maybe yes. Maybe just simple test on their part. Interesting.

[Webnauts]

He is obviously not hidding the <h1> from the Search Engines. For search engines it is visible. He hides them from the users though. And his <h1> tags are sitewide not unique.

So he is definitely violating the Google Webmaster Guidelines!!!

Unethical and unprofessional.

[weslinda]

Well lets hope I haven't caused too much of a stir, but I'm wondering if web sites will start using CSS to game the system and if so, can search engines figure this out? More importantly, will they spend the money to find these things.

Also, I could see an issue with some of the Accessibility Items that are used in CSS to provide a "jump to content" menu for those not using a traditional browser. Any thoughts on whether these might cross into the same circles?

[Shift4SMS]

I think that users should not be dependent on Google or any search engine for stopping unethical behavior like this. Instead, the various browser manufacturers should add invalid or unethical css logic, similar to pop-up blockers, that would display a glaring warning to unsuspecting users that stroll upon a site:

WARNING: You are attempting to access a web site that is buggy or has been purposely programmed to use SPAM exploits. It is not recommended that you view this page. Do you want to continue to the site against our recommendation or do you want to black list the site and block the content?...

[wige]

I knew something like this would be only a matter of time. I have already seen on different sites, for example, CSS code that makes h1 content look like it was in p tags, most likely to get the benefit of h1 without the user noticing that that text is different.

It probably comes down to whether the search engines have started looking at CSS files and matching style instructions to pieces of code. If they don't yet, they probably will soon. This is an interesting approach though. There was an old technique where you would set the position of the element to somewhere off screen, but browser makers killed that by resetting the negative value to 0, making it possible for users to see the content that would otherwise be hidden.

People will always be looking for new ways to game the system, and CSS will only make it easier... after all, now that the style information is in it's own file, you could probably [EDIT: Deleted]. Sure, thats definite spam, but it would be almost impossible to detect.

Also, code like this can be legitimate. Above I mentioned the old trick of moving an entire block off screen. That was developed as a JavaScript hack to make text and images invisible until called by user action, when the visibility attribute was poorly supported. An overreaction to something like this (penalizing sites that hide content in such methods, rather than ignoring the content) can result in more harm to legitimate sites than stopping spam. For example, until recently I used a similar trick to hide a form and some text about AJAX, which was then "put back" on the client side if the browser had JavaScript enabled and supported the AJAX methods I used in the page.

Steve, there are some browsers that implement some basic checking of the web page as you suggest, however the focus of the developers is more on the immediate threat to the user. This particular exploit is something that affects the SE ranking, not the end user, so it is unlikely that a browser developer will spend much time on this when they already have to keep on top of exploits and XSS attacks that can compromise the end user directly. But always an idea for a FireFox plugin...

[chrisJumbo]

Of course, couldn't this be an aspect they initially want off-page and then javascript or something else brings it on-page.

Did you view the source to see what is contained in the <H1> tags?

[Webnauts]

Originally Posted by weslinda

Well lets hope I haven't caused too much of a stir, but I'm wondering if web sites will start using CSS to game the system and if so, can search engines figure this out? More importantly, will they spend the money to find these things.

Search Engine can see that hidden code. You can check that yourself with Lynx or a a search engine simulator.

Originally Posted by weslinda

Also, I could see an issue with some of the Accessibility Items that are used in CSS to provide a "jump to content" menu for those not using a traditional browser. Any thoughts on whether these might cross into the same circles?

There are legal CSS techniques to hide those links, without using the hidden or display:none rules, which SE can pick up.

Maybe server side?

[Webnauts]

Originally Posted by chrisJumbo

Of course, couldn't this be an aspect they initially want off-page and then javascript or something else brings it on-page.

Did you view the source to see what is contained in the <H1> tags?

The domain name which is keyword rich and the site owner's name. And the <h1> tag is sitewide the same. In other words not unique.
That is not a skip navigation or so ever. That cannot be forgiven.

[jackit_chick]

I think that is called Cloaking. A website I went to once to check out our competitors, to see if they were doing just that, was http://www.1-hit.com/...I don't see that free tool on their anymore, perhaps I'm not looking hard enough. Anyway, if a free tool can scan a website and see it cloaking things, why couldn't a search engine?

If you don't want your users to see it, then it shouldnt' be on their in my opinion.

[Webnauts]

I just setup a test page to demonstrate what you can hide with CSS and what the Search Engines can see.

No CSS hidden rules or display:none, which the major search engines already can recognize.

Simply view the source code.

[wgoodman]

I have used this myself and found it to be a great method for displaying my art heads. I used .css to swop my h1 heads with art. The visitors see the .gif art head and the engines see the h1 tagged text. I didn't do this as a black hat appoach, but to cosmetically display my heads well without loosing the value of h1 tags for search engines.

Yes, I think if it is used correctly is it very ethical.

Wayne Goodman, Website Design, Search Engine Marketing

[Webnauts]

Originally Posted by incrediblehelp

Doesnt make much sense why hide the content from the spiders. Hiding code maybe yes. Maybe just simple test on their part. Interesting.

Jaan they do not hide content from spiders. They hide <h1> headings content only from users. Pure spam.

[blitzen]

It appears to be an image replacement technique.

Netscape Text-Indent Rendering Error
CSS Image Replacement Using Negative Text Indent - Soxiam Wiki

[Webnauts]

Originally Posted by blitzen

It appears to be an image replacement technique.

Netscape Text-Indent Rendering Error
CSS Image Replacement Using Negative Text Indent - Soxiam Wiki

No, it is not!

[craigmn3]

Color me ignorant, but it strikes me that using this system to make whatever is in "block" into a header is defeating both the benefit of the heading tag and the benifit of what ever block says

Using a CSS to insert text into a a web page....can be considered "unethical" outting said text into an H1 Tag offers no benefit at all. The search engines will read that H1 tag as empty.

[Webnauts]

Originally Posted by wgoodman

I have used this myself and found it to be a great method for displaying my art heads. I used .css to swop my h1 heads with art. The visitors see the .gif art head and the engines see the h1 tagged text. I didn't do this as a black hat appoach, but to cosmetically display my heads well without loosing the value of h1 tags for search engines.

Yes, I think if it is used correctly is it very ethical.

Wayne Goodman, Website Design, Search Engine Marketing

Google Quality guidelines - specific guidelines

• Avoid hidden text or hidden links.

More: Webmaster Help Center - Webmaster Guidelines

So are you sure that is not black hat? Hm...

Can you also tell us what blind visitors see there? If a blind visitor cannot access that content, it is obviously spam.

Give me a minute to make a test.

[Webnauts]

Wayne I tested with a GoogleBot Simulator, and here is what Google see:

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Wayne Goodman, Director of Internet &amp; Mulimedia Services</title>

<meta name="description" content="Wayne Goodman, Director of Internet & Mulimedia Services, Smith O'Keefe & Associates, Wayne Goodman">

<meta name="keywords" content="Wayne Goodman">

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<link href="SOK_reDesign05.css" rel="stylesheet" type="text/css">
<style type="text/css">
<!--
h1 { padding:22px; font-family: Arial, Helvetica, sans-serif;}
-->
</style>
</head>

<body bgcolor="#666666">
<script type="text/javascript" src="flashobject.js"></script>

<table width="720" border="0"  align="center" cellpadding="0" cellspacing="0"  bgcolor="#ffffff" valign="top">
  <tr>
    <td height="226">
    <div id="staffcontent">                <p align="left">&nbsp;</p>
      <h1 align="left"> Wayne Goodman </h1>
      <p align="left">Wayne Goodman, Director of <a href="internet.html">Internet &amp; Mulimedia Services</a>,
        <a href="/">Smith O'Keefe &amp; Associates</a></p>
      <p>Wayne Goodman graduated with honors from <a href="http://www.temple.edu/tyler/">Tyler
        School of Art</a>, Temple University</p>
      <p>Previous to joining Smith O&rsquo;Keefe, Wayne Goodman was a graphic designer
        for
        <a href="http://www.resortsac.com">Resorts Casino Hotel</a> in Atlantic
        City for 16 years.</p>
      <p>Wayne Goodman supervises website development and renovations, <a href="/internet.html">multimedia
        development projects</a> and <br>
        <a href="/internet.html">search engine optimization</a> for the firm.</p>
      <p align="left"><a href="/whoWeAre.html">Smith O'Keefe and Associates</a> |
          <a href="/brand.html">Branding Strategies</a> | <a href="/convergence.html">Strategic
          Marketing</a> | <a href="/advertising.html">Advertising</a> | <a href="/publicRelations.html">Public
          Relations</a> <br>
          <a href="/news.html">Smith
          O'Keefe News</a> | <a href="/clients.html">Smith O'Keefe Clients</a> |
          <a href="/contact.html">Contact Smith O'Keefe</a> </p>
    </div>
<script type="text/javascript">
// <![CDATA[

var fo = new FlashObject("SOK_KeyStaff_Top.swf", "Key Staff", "720", "226", 6, "#ffffff");
fo.addVariable("flashVarText", "this is passed in via FlashVars");
fo.addVariable("myPage", "wayne");
fo.write("staffcontent");

// ]]>
</script>
    </td>
  </tr>
<tr>
<td width="720" height="410" align="left" valign="top">
    <div id="portfolioContent">                <p align="left">&nbsp;</p>

</div>
<script type="text/javascript">
// <![CDATA[

var fo = new FlashObject("keyStaffLG.swf", "key staff", "700", "700", 6, "#ffffff");
fo.addVariable("flashVarText", "this is passed in via FlashVars");
fo.addVariable("myPage","wayne");
fo.write("portfolioContent");

// ]]>
</script>
</td>
</tr>
<tr>
<td align="center" valign="top"><p>&nbsp;</p>
</td>
<tr>
<td height="46" align="center" valign="top"></td>
</tr>
</table>
</body>
</html>

[craigmn3]

Originally Posted by Webnauts

Can you also tell us what blind visitors see there? If a blind visitor cannot access that content, it is obviously spam.

Um....



Um.....

[Webnauts]

Originally Posted by craigmn3

Um....



Um.....

Professional SEOs use for testing use the browser Lynx. What is wrong with that?

[netroact]

Your assuming this webmaster is like you, crossing all their t's and dotting their i's in their website. I often use the same css to start with on all pages without editing anything. And, if I'm in a hurry on that site, I will leave the garbage lying around for awhile. I regularly sort out html pages that have scrambled source code. The website owner cut and pasted all kinds of crap into their source. It's kinda scary in there. I wear gloves.

[mcgettrs]

It does look like an image replacement technique and nearly every css tutorial i have come across have described different ways to all style rich browsers to show an image and for text browsers to just view a heading. They recommend it. It is an accessibility feature for website readers. When i first came across this technique I thought it should be counted spam as well but I have not found one forum where it has been described as that up until this one.

Of course if it is not used for image replacement I suppose it is spam.

[zevonjunior]

As discussed by wgoodman above there is nothing necessarily sinister in using this technique. It's just a standard image replacement technique for delivering a fancy site-wide logo graphic to most users, but then delivering a standard html logo to search engines or to users using assistive technologies. See, for example, page 64 chapter 3 of CSS Mastery, by Andy Budd, currently THE standard CSS textbook for serious html/css markup.

Not to say that it couldn't be used in some dodgy manner, but in its typical form it should be harmless, given that the search engine is reading the HTML, not the CSS or graphic. One could mislead a user, but not a search engine using such a technique .. unless I'm missing something.

Cheers, Adrian

[Webnauts]

When replacement techniques are applied, like sIFR or server side with i.e PHP, search engines are able to read the text present in the document, and visitors will see either the images or flash file that displays the text.

Then humans and the bots will be happy. And such methods should not be considered as "black hat", as long as the replacement is faithful to the text it replaces.

But seems like that is not the case here.

[weslinda]

Netroact. This isn't a newbie webmaster that did this. It is a very, and I mean very highly thought of SEO and Search Guru. Unless you don't know SEO, you know this persons name.

[mcgettrs]

Found this interesting article on the web in case any of you want to check it out:
Google, SEO and using CSS to hide text | 456 Berea Street

As one might have guess it seems to be a case of no one really knows if it is good or bad. I have been looking at how many sites use hidden css text and there are huge amounts of them that do but most of them use it very ethically. I haven't found any spam as of yet.

[weslinda]

MCGETTRS, This is in no way shape or form being used as an image replacement. This isn't ALT text. This is simply a link and text in an H1 tag being hidden off page. As Webnauts shared, it is not a unique tag per page, it is the same tag on every page of the site, and there are thousands. Which makes it semantically incorrect, and a fairly egregious error in my opinion.

[Webnauts]

Originally Posted by weslinda

Netroact. This isn't a newbie webmaster that did this. It is a very, and I mean very highly thought of SEO and Search Guru. Unless you don't know SEO, you know this persons name.

Wes, well done so far! Lets leave his name out of here, as he is not present.

[John]

Is it possible that they use different CSS for printing, and want the H1 heading to print but not display, because they use an image on the screen?

John

[Webnauts]

Originally Posted by John

Is it possible that they use different CSS for printing, and want the H1 heading to print but not display, because they use an image on the screen?

John

That is not the issue.

[stuart888]

The test is simple, would you do it if search engines did not exist? Answer: No

And that is the test the engines use, the site will be sandboxed.

[weslinda]

Great Point Stuart888, almost like there is a need for an organization for Search Engine Optimization that promotes a specific Code Of Ethics, and highlights issues like this for everyone to avoid.

[Webnauts]

Originally Posted by stuart888

The test is simple, would you do it if search engines did not exist? Answer: No

And that is the test the engines use, the site will be sandboxed.

I am looking forward to that.

[EditFast]

Interesting discussion on several levels. First, I find it odd that we now define what is "ethical" according to what Google tells us we should do. I am not sure that "ethical" is the word to use here, more like conforming for sound business reasons. But perhaps that is just semantics. Nevertheless, I am sure Google is happy that we are using this term to, in effect, define the importance of their rules.

Second, using CSS to hide <H1> tags is not a new thing. I found this technique several years ago on a site and immediately implemented it throughout my site since it was not "unethical" at that time and I did not notice any big difference in the way the search engines ranked my pages. Since November of last year I have removed all of these in compliance with Google's directives (ethical or not) and have not noticed any change in ranking whatsoever, but I like to stay on the "ethical" side of things.

[Webnauts]

Originally Posted by EditFast

But perhaps that is just semantics.

Isn't that enough?

[weslinda]

Well, I don't define this as a Google Initiative. I look at this as no-no from the standards point of view. This is not how either the H1 tag or CSS was meant to be used.

H1 tags are supposed to be the biggest headline piece of your site, and this domain has chosen to completely remove it's effectiveness. Breaking with semantics and standards.

I hope that this will start a discussion that more people should look at doing web design from a solid, ethical, efficient point of view. SEO Basics is the best place to start. In this blog, I address the importance of using standards in SEO and some of the benefits. While this is not an exhaustive overview, it is a start for those new to the industry or just getting started learning.

[modrewrite]

I wouldn't do that, its definately unethical because it violates googles tos. You might try <h1>keyword</h1>

h1 {
display:block;
width:150px;
height:150px;
overflow:hidden;
background:url(/images/h1.png) 0 0 no-repeat;
}

[Webnauts]

Originally Posted by modrewrite

I wouldn't do that, its definately unethical because it violates googles tos. You might try <h1>keyword</h1>

h1 {
display:block;
width:150px;
height:150px;
overflow:hidden;
background:url(/images/h1.png) 0 0 no-repeat;
}

Aren't search engines intelligent enough to recognize the overflow:hidden? Just curious.

[espectations]

Just my 2 pence - I am pro the idea that if anyone does something that does not comply with the rules of SE's, it should just be ignored rather than penalized.

This way, the spammers and unethical guys will do what they do but it will not benefit them.....

BTW I also use Lynx to check what the search engines see and this many times helped me solve issues that I was wondering about.

I would persnonally not do anything that does not comply with the rules or does not validate.

[dannysullivan]

Incrediblehelp dropped me an email asking me to comment on this thread. I came over, read the comments and kind of scratched my head. Comment about what? That CSS can be used to hide text? Sure, that's been known for ages. That hiding text using CSS can be considered spam or a poor man's version of cloaking? Sure, that's also been known for ages. I've written about it plenty of times. This isn't something new that people can do. It's something old that people have been doing for ages.

Still scratching my head, I then wondered, "Wait a minute. Is this about my site?" Surely not. But yep, there in our style sheet was the damning code. It's true. We were totally hiding text and technically might be considered spamming the search engines. Curses -- just when I hoped not to be counted among those other search spammers like Google and Yahoo that have been outed for using hidden text.

It was really confusing because I didn't think we used H1s in the site. We use H2s for our headlines. Then I found it. H1 we use as a replacement for those who don't have stylesheets and images on. Specifically, we use it to put the words "Search Engine Land by Danny Sulllivan" at the top of our pages, like this:

<h1><a href="http://searchengineland.com">Search Engine Land by Danny Sullivan</a></h1>

I've seen these come up primarily when I hit the site on my cell phone. I didn't like the "by Danny Sullivan" part actually, since the site isn't just by me. So I'd removed that from most of the pages. However, I hadn't realized that the stylesheet was hiding this from those with CSS working. It just hadn't occurred to me that this might be happening.

The stylesheet was created by the designer who initially created our site template, who isn't an SEO. Looking at it more closely today, I understand why he did this. See, the logo at the top of our page isn't an image on its own. It's part of the overall page background:

http://searchengineland.com/styles/i...header_bg2.jpg

So we can't put a link around the logo, because the logo is part of the page background itself.

FYI, you'll notice that the page background looks different than what you see on the site, because when we added our new tabs last week, we dropped an email subscribe box over our old RSS icon. That's also when the "by Danny Sullivan" part came back -- because the text came off an older template that was used.

Anyway, long story short -- there was no intention to spam the search engines. We hardly need to spam the search engines for that crucial text of "Danny Sullivan" or "Search Engine Land." We're sort of relevant for them without even trying, I think most people would agree.

We'll look at a way to make the logo be a hyperlink that doesn't involve using a hidden style, though our permanent solution might have to wait until next week as we're sort of busy with the upcoming conference we have this week.

Sorry for anyone that somehow thought we were endorsing some spamming technique. We're not, of course.

[mantawebsolutions]

OK, Danny has just told us why it's in the site (it sounds like it's been there for a while now) and I am sure, from his explanation, that they are forgiven, but does it answer the initial question?

Is it ethical and if it isn't, then it raises questions.
Was the site penalized in any way or did it lose any rank because of it?
Did search engines (Google) not pick up on this?
Does Google consider this one "error" simply as one of many other factors when they look at sites not following their guidelines?

[TrafficProducer]

Is this ethical? The answer is no!

Any, trying to fool search engines will be asking for trouble... get banned now.

[mantawebsolutions]

TrafficProducer: Agreed

[weslinda]

Danny. Since I started this monstrosity of a thread, I would like to thank you for taking the time to stop by, read this and comment openly on it. I think your statement and explanation defines why you are at the level you are in this industry.

I definately agree with you that this is not anything new and this should be corrected. It was in my opinion not something that was done to spam search engines or really do any major tricks to Google or any other search engine.

While many seasoned designers are familiar with this, I thought it would be important to open this discussion again, so that people can get a feel for what is right and wrong in design and that there are a few basics everyone should follow. Please realize it was my intention not to bring your name or SEL into this discussion. It was my goal to open a discussion that might open a few eyes and educate them on what to do and not to do on their web sites.

Regarding your upcoming conference, I wish I had the time to attend, it really looks like a great expo that all of us could learn by.

I'm excited to see your fix and I hope the conference goes well. Thanks again for stopping by and discussing this topic in depth.

[Cyclops]

It's also used for Phishing.

[wige]

Originally Posted by Webnauts

Aren't search engines intelligent enough to recognize the overflow:hidden? Just curious.

Possibly, but it is unlikely becuase a bot would have a hard time determining what part of the text is visible to a user and what part is being overflowed and thus hidden.

I just wonder how long it will be before someone finds a way to serve the bots a different CSS file than they do the users? That will be a whole new world of virtually undetectable spam.

[netroact]

Your assuming this webmaster is like you, crossing all their t's and dotting their i's in their website. I often use the same css to start with on all pages without editing anything. And, if I'm in a hurry on that site, I will leave the garbage lying around for awhile. I regularly sort out html pages that have scrambled source code. The website owner cut and pasted all kinds of crap into their source. It's kinda scary in there. I wear gloves.

Netroact. This isn't a newbie webmaster that did this. It is a very, and I mean very highly thought of SEO and Search Guru. Unless you don't know SEO, you know this persons name.

The stylesheet was created by the designer who initially created our site template, who isn't an SEO.

Google doesn't decide ethics anyway! They have their own interest involved, and it's not their website.

[weslinda]

Actually, google does kind of decide ethics and they will ban you if they feel you are doing something unethical. It's in their guidelines.

At this point, we can see that this is a really interesting discussion to say the least and we must take this at face value, believe that Danny is stating the truth and hope that others learn that techniques like this one are poor choices.

That's all we can do.

[wige]

But then what about the flip side of this, using CSS to "openly" hide text that is intended for use in Javascript or by other client sided technologies? As a hypothetical example:

I have a long web page that is a FAQ. I really don't care about the SEO of the page, it is there purely to answer common questions that a customer might have while going through the checkout process, covering how sales tax is calculated, shipping terms, etc. To make the page as easy to read, I have the questions as javascript links and the answers hidden using visibility:hidden. As the user clicks the question, the javascript toggles the visibility.

This is not uncommon, the Microsoft web site uses this technique throughout their developer site, for example. Even though this is an honest use, and one of the reasons this attribute was created in the first place, would my site be penalized for using it? Or would the bots just ignore the text set to be hidden?

[netroact]

Google has every right to ban anyone they want to ban, and courts should have no say whatsoever on the matter. But, google DOES NOT decide what is ethical. If someone uses their website to commit a criminal act, such as fraud or canned spam, this is unethical, but google is not the judge - criminal court will decide this.
As I stated before google has their own self-serving commercial interests involved.

People leave dead code lying around all the time, small websites and large websites. To me the ethics comes into play when people are so quick to accuse others of being unethical. Ethics has to do with morality and your treatment of others. I know you didn't accuse anyone of spam, but others were real quick to do so.

I hate spammers as much as anyone. Probably more. I hope google bans all spammers, but I do hope they use common sense and good judgment in their decision. I hope they are ethical in determining what is ethical.