Menu icon Foundation
Visiblity vs. Interchange regarding PHP and SEO

Hello, I am using Foundation with my Drupal 7 site. I am using Foundation for my sales front end of the site.

I was hoping you guys could help me clear up some questions regarding SEO when creating the different markup for small and large screen sizes.

I would love to just use the visibility classes because those are the easiest but I found I had to literally use one div for the entire page for a small screen and a different div for medium screen and up. There is going to be a ton of duplicated content in each of those divs but the user will only see one of those divs based on their screen size.

Will Google and the other search engines penalize my site for having that duplicate content on the page even though it is hidden?

If the answer is yes, then I would assume that I should either try to make the two divs meld into one and get even more creative on how to display the markup for the two different screen sizes OR you would suggest using the Interchange system.

Well, the interchange system is what I tried first until I needed to put a little php code snippet to print out a variable from my page template. It didn't work which I already knew but had to test it out anyway.

So, I guess the final option would be to write it with no duplicate content and not us the Visibility option but use the Interchange feature on the classes I want to use based on screen size. Is this correct?

Please advise on how best to be SEO minded as well as be able to deliver the custom markup for the different screen sizes.

Thanks a bunch. I really like Foundation. I researched a lot of options and decided that Foundation was the one.

Thanks.

seoPHPvisibilityinterchangescreen sizes

Hello, I am using Foundation with my Drupal 7 site. I am using Foundation for my sales front end of the site.

I was hoping you guys could help me clear up some questions regarding SEO when creating the different markup for small and large screen sizes.

I would love to just use the visibility classes because those are the easiest but I found I had to literally use one div for the entire page for a small screen and a different div for medium screen and up. There is going to be a ton of duplicated content in each of those divs but the user will only see one of those divs based on their screen size.

Will Google and the other search engines penalize my site for having that duplicate content on the page even though it is hidden?

If the answer is yes, then I would assume that I should either try to make the two divs meld into one and get even more creative on how to display the markup for the two different screen sizes OR you would suggest using the Interchange system.

Well, the interchange system is what I tried first until I needed to put a little php code snippet to print out a variable from my page template. It didn't work which I already knew but had to test it out anyway.

So, I guess the final option would be to write it with no duplicate content and not us the Visibility option but use the Interchange feature on the classes I want to use based on screen size. Is this correct?

Please advise on how best to be SEO minded as well as be able to deliver the custom markup for the different screen sizes.

Thanks a bunch. I really like Foundation. I researched a lot of options and decided that Foundation was the one.

Thanks.

This post has been closed. No new replies can be added.

Karl Ward over 5 years ago

I would like to know how interchange loads html partials, I assume using javascript ajax. In such case, I would try to avoid using interchange for elements that should be integral part of your page and SEO. Ok, so Google does in fact index JS-generated content these days, but it is highly unreliable, especially since you don't really know what partial it will be loading ...

Having said that, visibility classes may not be trustworthy either, as technically they are hiding content Google knows this.

Ultimately, you should only be using both visibility classes and interchange for non-SEO content. After all, Foundation is responsive, so you text floats around freely. You actually need to load massively different text-content on a per-device basis? I believe this is bad practice.