Can I make the text in headers invisible?

I’m new at this. My understanding is that search engines find your site by the text in the headers; however I don’t want the header text (the stuff I want to include in the headers for the search engines to find) to show on my pages. Can I do that? I imagine one way to do that would be to match the text color with the background color; however I can’t do that as my background is a wood grain image. Thanks in advance for any guidance y’all can offer.

If you are trying to trick the Search Engines it’s a foolish method attempting to make the text invisible as they search all text not just the headings. And especially if try to you use markup so text matches background colour that will only get you penalised by them.

To answer your question; if you had a legitimate reason, i.e. other than SEO for a little hiding of text. You’d use CSS and perhaps; h5 {visibility: hidden;} or h5 {display: none;} which differ in results but will hide the text.

If you want to replace the header with a non-transparent image, the best way is to place the image over the text. But I suspect that’s not what you want here. So the next best method is to do this:

h1 {margin-left: -9999px;}

What you are asking about is called “content cloaking” – and as xhtmlcoder implied it’s one of the fastest ways to get your site slapped down for abuse by the search engines. If you’re going to have headings, they should be visible and there for structural reasons in the document, otherwise why have them? Stuffing text into headings JUST for SEO is black-hat nonsense that does more harm to your page than good.

Though I do wonder if Ralph is onto what you are really asking as you mention a background image – are you asking about image replacement of text?

I’m a lawyer doing a personal page for my solo practice. Initially, I started out developing a design that had as a header, “my name, trial attorney” but the design has evolved into one wherein I have an image of a desktop with a sheet of my letterhead stationary on the top of the desk. My navigation will be on an image of a little piece of scrap paper that is attached to the stationary with a paperclip. There will also be a polaroid photo of yours truly attached to the paperclip. The stationary will have a “correspondence” typed onto it that will tell the viewer what I and my site are all about. Obviously, the letterhead includes the image of text that includes my contact information and the heading “my name, trial attorney”. Remember, I’m new at this, which means I could break rules that I’m not even aware of. I don’t want to do anything that is un-kosher, tricky, or whatever. So far I have read Ian Lloyd’s book for beginners and a few tutorials.

I think what I’m proposing here is what Ralph was referring to in his post, above: I’m using nothing but non-transparent images on my home page. However, I still need folks to be able to find my page using search engines. If it makes any difference, there will be nothing in my “invisible header” that is not visible as an image on the page. After all, I’m not trying to get as many visitors to my site as possible, on the contrary, ideally I want to attract only people in my city who are looking for an attorney to hire, in my field of specialty. This is actually a fairly small number of people. That being said, most visitors to my site will be my clients who have already retained me–I plan on including information on my site that will answer a lot of their general questions about the legal process, so I don’t have to spend so much of my time repeatedly explaining this information to my clients and prospective clients.

Thank you for reading and for taking time to respond.

Here is a nice example of how you can have your header text in place (for search engines and for readers using screen reading software etc.) and yet an image sitting over the text:

Hello Ralph–Okay, here’s an excellent example to illustrate my point:

I got it by perusing this site, which I am really enjoying for inspiration:

Regarding the example I have posted–it’s at the extreme end of the spectrum to illustrate my idea–in this example there is no visible text at all on the home page.

I want to have an image of a piece of paper on a desk–I’m new at this so what I’m doing first is to try to figure out what is possible. I want to use an actual image of my letterhead. However, I would like search engines to pick up on what area of law I practice in–it’s just that that information is not on my letterhead and would ugly the whole design up if I put that in there.

I’m reading and looking at the example you posted for me but it’s all Greek to me. (Ha!–I guess I’m not as smart as I thought I was.) I don’t know what that example is illustrating. Perhaps I need to read it again tomorrow after I have a little rest–it’s been a long week. Anyway, I can’t imagine that I’m proposing anything unique or sneaky or whatever here–I just want a website without a big headline type header across the top of it.

Thanks again for taking an interest in my project.

You could put it in the <title> element in the <head> of the document. That appears at the top of the browser, and is the title in search results.

I’m reading and looking at the example you posted for me but it’s all Greek to me … I don’t know what that example is illustrating.

The heading at the top is an image, but behind it is the real text. So the image placed over the top of the text. It only works if the image is not transparent. In most browsers, it’s easy to turn off images. If you choose that option, you will see the real text in place of that image.

It sounds like you want a web page with no text on it, just images. Well, yo can do that, but the images at least should have some alt=“” text. But really, what you are looking at here is not very practical for the web. That first site you linked to is pretty and cool and all, but in reality it’s not a good site. It’s confusing, inaccessible and does not adapt well to changing browser conditions … so around these purist halls it’s most likely to be considered junk. :slight_smile:

Okay, I read your last post and then looked again at your link. I get it now. I’m going to put it all together and post a prototype, submit it here for critique and then go from there. Thanks again to Ralph and others for all the great help.

OK, great. I look forward to seeing what you come up with. :slight_smile: