javascript - 隐藏谷歌丰富网页摘要

Question

正如 Google 关于对用户隐藏丰富网页摘要的声明:

It can be tempting to add all the content relevant for a rich snippet in one place on the page, mark it up, and then hide the entire block of text using CSS or other techniques. Don't do this! Mark up the content where it already exists.

然而，我正在研究的问题是，在某些框架中，这过于繁琐，因为每个所需的丰富网页摘要都位于数十个模板之一中。从开发人员的 Angular 来看，这会在各处创建碎片代码，从而使框架的模块化特性变得复杂。

主要问题是，使用什么技术可以使丰富网页摘要可以全部存在于一个模板中？我考虑过扩展“SEO block ”的概念，它位于页面底部并提供所需的丰富网页摘要，但这看起来很困惑并且会导致重复的内容。

这里是否有任何其他可能的技巧可以用来对用户隐藏此标记？如果我将丰富网页摘要内容放入使用 jQuery slideToggle() 的 div 中，是否仍然“隐藏”了 Google 所关注的内容？

Answer 1

可以使用 meta 关键字隐藏您的丰富网页摘要。我已经在我的个人网站 (victorlava.com) 上完成了这项工作。看一看:

<article itemscope="" itemtype="http://data-vocabulary.org/Person">
                <meta itemprop="name" content="Victor Lava">
                <meta itemprop="photo" content="http://www.victorlava.com/external/victor-lava.png">
                <h2>I am a Professional <span itemprop="title">Web Developer</span> who creates web applications</h2>
                <p itemprop="description">I am a professional <b>web developer</b> from <span itemprop="location">Lithuania</span>, who trully enjoys <b itemprop="role">coding</b>. I develop all kind of <b>web</b> things. Web things like: <b>web applications</b>, <b>websites</b> and <b>custom cms</b>.  
                   For my frontend development I like to use: <b>HTML5</b>, <b>CSS3</b> and <b>Javascript</b>. These are the latest web technologies, which must be used in the development process by <b>professional</b> web developer. For my backend development I usually use web technologies like: <b>PHP</b>, <b>MySQL</b>, other <b>APIs</b> and <b>CodeIgniter</b>.
                   I am that kind of <b>web developer</b>, who isn't afraid to experiment. By experimenting I am able to create unique and eye-catching <b>websites</b> for my clients. I am open for new proposals, so feel free to <b><a href="http://victorlava.com/contact.html" title="Hire Web Developer">hire me</a></b>.</p>
            </article>

使用:<meta itemprop="name" content="Your Content">元属性工作得很好，你不需要用 CSS 或 Javascript 隐藏任何东西。在我看来，元属性将是您的最佳选择。顺便说一句，您可以在此处阅读有关丰富网页摘要以及如何测试它们的更多信息 http://blog.victorlava.com/rich-snippets-testing-tool-webmaster-seo-very-useful/ .