How do I change the color of the separator bars between keywords?

Sarge · September 23, 2015

Hi,

I'm trying to change the color of the bars between keywords to match the background color, but cannot figure this out... I've changed the color of the keywords, the 'keyword tag/emoji', but cannot for the life of me figure out how to change the color of the separator bars.

The gallery I'm trying to apply this to: http://www.sargentschutt.com/Architecture/Exteriors/

I can 'hide' all the keywords, but am told that hiding the meta keywords is a no-no with Google, so I'd like to ostensibly hide the keywords sections beneath the photos by making all the text the same as the background...

Thanks for any tips.

Hikin' Mike · September 23, 2015

"Hiding" your keywords by making the text and background the same color is a BIG NO-NO, but hiding them on CSS is fine:

.sm-tile-keywords {
	display: none;
	}

ChancyRat · September 23, 2015

Hikin' Mike wrote: »
"Hiding" your keywords by making the text and background the same color is a BIG NO-NO, but hiding them on CSS is fine:
.sm-tile-keywords {
	display: none;
	}

Mike, *is* there a code to change the color of the bars instead of hiding them? I've been on a hunt for that for a long time... was thrilled that this thread came up ... and then you subverted it!

Allen · September 23, 2015

ChancyRat wrote: »

Mike, *is* there a code to change the color of the bars instead of hiding them? I've been on a hunt for that for a long time... was thrilled that this thread came up ... and then you subverted it!

.sm-tile-keywords a {border-color:red !important}

Sarge · September 23, 2015

Hikin' Mike wrote: »
"Hiding" your keywords by making the text and background the same color is a BIG NO-NO, but hiding them on CSS is fine:
.sm-tile-keywords {
	display: none;
	}

Why is making them the same color a "BIG NO-NO"???

My understanding is that if you 'hide' them, then you won't have any keywords to be picked up by search engines, so the work-around is to have them be the same color as the background?

denisegoldberg · September 23, 2015

Sarge wrote: »

Why is making them the same color a "BIG NO-NO"???

My understanding is that if you 'hide' them, then you won't have any keywords to be picked up by search engines, so the work-around is to have them be the same color as the background?

It's bad from a search engine optimization (SEO) standpoint.

See https://support.google.com/webmasters/answer/66353?hl=en and http://www.seochat.com/c/a/search-engine-optimization-help/hidden-text-in-websites/. There are many more write-ups about this topic, just search for "hidden text on website".

--- Denise

pabloconrad · September 23, 2015

denisegoldberg wrote: »

It's bad from a search engine optimization (SEO) standpoint.

See https://support.google.com/webmasters/answer/66353?hl=en and http://www.seochat.com/c/a/search-engine-optimization-help/hidden-text-in-websites/. There are many more write-ups about this topic, just search for "hidden text on website".

--- Denise

Do the keywords still get indexed if you hide them via CSS? Will google still read them and index them?

Would love to know the answer to this.

pabloconrad · September 23, 2015

Apparently, Google does penalize you if you hid via CSS:

http://seoshrugged.com/2014/07/13/does-google-crawl-css-displaynone-content/

Sarge · September 23, 2015

pabloconrad wrote: »

Apparently, Google does penalize you if you hid via CSS:

http://seoshrugged.com/2014/07/13/does-google-crawl-css-displaynone-content/

When you say 'hide', do you mean 'hide' via the CSS command to 'hide keywords', or 'hiding' by way of making the keywords match the background color?

pabloconrad · September 23, 2015

Sarge wrote: »

When you say 'hide', do you mean 'hide' via the CSS command to 'hide keywords', or 'hiding' by way of making the keywords match the background color?

CSS command.

Sarge · September 23, 2015

pabloconrad wrote: »

CSS command.

Which is why I've always thought 'camouflaging' the keywords by making the font color match the background color was the way to go, with regard to prioritizing both SEO rank and clean design looks...

denisegoldberg · September 23, 2015

Sarge wrote: »

Which is why I've always thought 'camouflaging' the keywords by making the font color match the background color was the way to go, with regard to prioritizing both SEO rank and clean design looks...

I guess you didn't see the Google page I linked above - https://support.google.com/webmasters/answer/66353?hl=en.

It says:

Hiding text or links in your content to manipulate Google’s search rankings can be seen as deceptive and is a violation of Google’s Webmaster Guidelines. Text (such as excessive keywords) can be hidden in several ways, including:

Using white text on a white background
Locating text behind an image
Using CSS to position text off-screen
Setting the font size to 0
Hiding a link by only linking one small character—for example, a hyphen in the middle of a paragraph

I think it's worth reading that article.

--- Denise

Hikin' Mike · September 23, 2015

I posted a question on SEO Chat about hiding "keywords" (I'm also a Mod) - http://forums.seochat.com/search-engine-optimization-28/hiding-keywords-481569.html and so far hiding it with CSS is the way to go.

Sarge · September 23, 2015

Hikin' Mike wrote: »

I posted a question on SEO Chat about hiding "keywords" (I'm also a Mod) - http://forums.seochat.com/search-engine-optimization-28/hiding-keywords-481569.html and so far hiding it with CSS is the way to go.

If you use the CSS 'hide' command, will it render all the keywords nonexistent to search engines?

In other words, is using the 'hide' command the same as having no keywords whatsoever? If so, what's the point of having keywords and then 'hiding' them.

I just want a visually clean interface that gets picked up in searches. How to achieve these twin goals?

(Sorry I'm re-asking the same question but I'm not clear how this will work out...)

ChancyRat · September 23, 2015

Allen wrote: »

.sm-tile-keywords a {border-color:red !important}

Thank you Allen - but it didn't work. I put it in the gallery CSS?
Here: http://www.joinrats.com/keyword

Hikin' Mike · September 23, 2015

Sarge wrote: »

If you use the CSS 'hide' command, will it render all the keywords nonexistent to search engines?

In other words, is using the 'hide' command the same as having no keywords whatsoever? If so, what's the point of having keywords and then 'hiding' them.

I just want a visually clean interface that gets picked up in searches. How to achieve these twin goals?

(Sorry I'm re-asking the same question but I'm not clear how this will work out...)

According to this article, Google does crawl (index) the 'display:none' command.

Hikin' Mike · September 23, 2015

Just to add, personally if you display JUST your keywords and no text, I really don't think you are going to rank well. My opinion only.

Sarge · September 24, 2015

Hikin' Mike wrote: »

Just to add, personally if you display JUST your keywords and no text, I really don't think you are going to rank well. My opinion only.

Thanks for the help.

Would you recommend using the display:none command (assuming this still somehow leaves the keywords visible for Google crawling) and then use titles for the photos?

What is the best practice?

I'm trying to use sample galleries to display my best work in various categories, and want to be sure that work is getting picked up by Google so when people are, for example, looking for an architectural photographer in Jackson Hole, they find me high in google results. Google results are ultimately more important than the look of the site (i.e. hiding keywords).

What would you recommend as best practice?

pilotdave · September 24, 2015

Sarge wrote: »

Thanks for the help.

Would you recommend using the display:none command (assuming this still somehow leaves the keywords visible for Google crawling) and then use titles for the photos?

What is the best practice?

I'm trying to use sample galleries to display my best work in various categories, and want to be sure that work is getting picked up by Google so when people are, for example, looking for an architectural photographer in Jackson Hole, they find me high in google results. Google results are ultimately more important than the look of the site (i.e. hiding keywords).

What would you recommend as best practice?

Google finds text. The more relevant text you have, the better. Personally, I'd just leave your keywords showing and make them meaningful. Don't use long phrases as keywords, and try to make your keywords repeatable (so they apply to multiple images, not just one). Keywords should also not apply to all of your images (too generic). Then they become useful not just to google but to your site's visitors. Take a look at your site's keyword list and you'll see some areas for improvement. Once you clean up the nonsensical numeric keywords, you'll start to have a useful list.

Dave

Hikin' Mike · September 24, 2015

Sarge wrote: »

Thanks for the help.

Would you recommend using the display:none command (assuming this still somehow leaves the keywords visible for Google crawling) and then use titles for the photos?

What is the best practice?

I'm trying to use sample galleries to display my best work in various categories, and want to be sure that work is getting picked up by Google so when people are, for example, looking for an architectural photographer in Jackson Hole, they find me high in google results. Google results are ultimately more important than the look of the site (i.e. hiding keywords).

What would you recommend as best practice?

No "best practice". Do what you feel you need to do. I use the Thumbnail Gallery and I decided to hide my keywords in the lightbox. I admit that I don't promote my SM site as much as my WordPress site. People find me on my WordPress site, not SM.

How do I change the color of the separator bars between keywords?

Comments