h1：在{}之前为seo工作吗？

将<h1></h1>和h1:before{ content: "title";}的工作方式与<h1>title</h1>相同？h1：在{}之前为seo工作吗？

我正在创建一个响应式页面，其顶部是h1标签之间的标题，例如“John Smith”，但在手机浏览器中不适合导航，所以我希望它在mbile浏览器上说“John”。我可以在我的css中使用:before来设置基于视口大小的内容来实现此目的。

我只需要知道它是否会验证为“约翰史密斯”之间的搜索引擎优化的原因h1标签？

来源

2013-06-29 aztekgold

内容：'';添加仅在运行CSS时才存在的文本或图像，因此您可以预期它对搜索引擎不可见。即使对于JavaScript来说也不容易，因为它不存在于DOM中 –

这个问题似乎是无关紧要的，因为它是关于在Stack Overflow中脱离主题的SEO。 –

@JohnConde我不太确定，这个问题确实涉及代码... – 2013-06-30 03:34:06

我不确定:after和:before对搜索引擎优化的影响。然而，当你使用这种方法时，你将会把它放在你的样式表中，而我认为这种做法会被认为是不好的做法。我会解决更多类似这样的：

HTML：

<h1>John <span class='hide-mobile'>Smith</span></h1>

CSS：

@media (max-width: 768px) { 
    .hide-mobile { 
    display: none !important; 
    } 
}

来源

2013-06-29 18:52:42 Pevara

移动版本不会为标题添加字符（例如，用较短的字词替换长字） – Yogu

简单明了！ – aztekgold

选择一个作为应在页面大纲中使用的标题，最好是大的标题。然后添加手机噱头。

<h1 class="suppressed-on-mobile">John Smith</h1> 
<div class="mobile-heading">John</div>

CSS：

.mobile-heading { 
    display: none; 
} 

@media screen and (max-width: 400px) { 
    .suppressed-on-mobile { 
    display: none; 
    } 

    .mobile-heading { 
    display: block; 
    font-size: 150%; 
    /* etc... */ 
    } 
}

这样，文本浏览器，搜索引擎，屏幕阅读器等知道要显示的内容。

搜索引擎不分析content属性，所以你不应该在CSS规则中有实际的内容。

来源

2013-06-29 18:47:52 Yogu

对于移动通过mediaqueries，您可以为<h1>一个hudge word-spacing，white:space:nowrap;和overflow:hidden欢送屏幕那些额外的词困扰着你:)。

来源

2013-06-29 19:01:10

无需修改标记。 –

h1：在{}之前为seo工作吗？

回答

相关问题