My website frontpage looks like a whiteboard. I wanted to "attach" little notes of text on how to use the website, what there is et cetera on the whiteboard. These designs are all images, and I want the notes to be able to sit on a bit of an angle, use different fonts and things you can do with regular text. But I would also like Google to find the text. I was thinking of using display: none; to write the text out, but hide it from the human eye, hoping search engines would find it. Will I get penalized for that? I was also thinking of typing it and positioning it way outside the monitor, or maybe behind the image of the note with some z-index in CSS. What is my best bet? Thanks, Stephanie
anything that is related to hidden text to manipulate ranking is bad, I would suggest use the alt tags to target your keyword on images.
display:none; It will not be a problem if you use it on 1 page and a maximum of 140 words. most developers use script property display: none; to show a hidden tab, menu, or effect. But if you use the same color on font & background then you'll be penalized for sure
You can use display:none safely as long as it is not used as a way to stuff hidden content into the page purely for SEO purposes. HOWEVER it is possible you will still trip a penalty as it is a computer/bot that makes that decision on Google's behalf. What would be better is to remove the text from the images and then overlay it as actual text in a visible div.
Couldn't you just keep the writing as part of your images and then use the image alt tag instead to reflect this image text content?