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

SargeSarge Registered Users Posts: 17 Big grins
edited September 24, 2015 in SmugMug Customization
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.
Sarge
SargentSchutt.com
- MacBook Pro Retina, Lightroom CC, Photoshop CC, etc
- Nikon D3, D800 (work)
- Sony NEX-5t (walkaround)

Comments

  • Hikin' MikeHikin' Mike Registered Users Posts: 5,467 Major grins
    edited 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;
    	}
    
  • ChancyRatChancyRat Registered Users Posts: 2,141 Major grins
    edited 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;
    	}
    

    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! rolleyes1.gif
  • AllenAllen Registered Users Posts: 10,013 Major grins
    edited 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! rolleyes1.gif
    .sm-tile-keywords a {border-color:red !important}
    Al - Just a volunteer here having fun
    My Website index | My Blog
  • SargeSarge Registered Users Posts: 17 Big grins
    edited 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;
    	}
    

    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?
    Sarge
    SargentSchutt.com
    - MacBook Pro Retina, Lightroom CC, Photoshop CC, etc
    - Nikon D3, D800 (work)
    - Sony NEX-5t (walkaround)
  • denisegoldbergdenisegoldberg Administrators Posts: 14,373 moderator
    edited 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
  • pabloconradpabloconrad Registered Users Posts: 97 Big grins
    edited September 23, 2015
    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.
    Paul Conrad
    Photojournalist
    Pablo Conrad Photography
    Seattle, WA, USA
    c: 206-450-8632
  • pabloconradpabloconrad Registered Users Posts: 97 Big grins
    edited 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/
    Paul Conrad
    Photojournalist
    Pablo Conrad Photography
    Seattle, WA, USA
    c: 206-450-8632
  • SargeSarge Registered Users Posts: 17 Big grins
    edited 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/

    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?
    Sarge
    SargentSchutt.com
    - MacBook Pro Retina, Lightroom CC, Photoshop CC, etc
    - Nikon D3, D800 (work)
    - Sony NEX-5t (walkaround)
  • pabloconradpabloconrad Registered Users Posts: 97 Big grins
    edited 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.
    Paul Conrad
    Photojournalist
    Pablo Conrad Photography
    Seattle, WA, USA
    c: 206-450-8632
  • SargeSarge Registered Users Posts: 17 Big grins
    edited September 23, 2015
    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...
    Sarge
    SargentSchutt.com
    - MacBook Pro Retina, Lightroom CC, Photoshop CC, etc
    - Nikon D3, D800 (work)
    - Sony NEX-5t (walkaround)
  • denisegoldbergdenisegoldberg Administrators Posts: 14,373 moderator
    edited 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' MikeHikin' Mike Registered Users Posts: 5,467 Major grins
    edited September 23, 2015
  • SargeSarge Registered Users Posts: 17 Big grins
    edited 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.

    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...)
    Sarge
    SargentSchutt.com
    - MacBook Pro Retina, Lightroom CC, Photoshop CC, etc
    - Nikon D3, D800 (work)
    - Sony NEX-5t (walkaround)
  • ChancyRatChancyRat Registered Users Posts: 2,141 Major grins
    edited 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' MikeHikin' Mike Registered Users Posts: 5,467 Major grins
    edited 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' MikeHikin' Mike Registered Users Posts: 5,467 Major grins
    edited 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.
  • SargeSarge Registered Users Posts: 17 Big grins
    edited September 24, 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.

    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?
    Sarge
    SargentSchutt.com
    - MacBook Pro Retina, Lightroom CC, Photoshop CC, etc
    - Nikon D3, D800 (work)
    - Sony NEX-5t (walkaround)
  • pilotdavepilotdave Registered Users Posts: 785 Major grins
    edited 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' MikeHikin' Mike Registered Users Posts: 5,467 Major grins
    edited 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.
Sign In or Register to comment.