html5:章节元素中的标题 – 文档概要和SEO影响

前端之家收集整理的这篇文章主要介绍了html5:章节元素中的标题 – 文档概要和SEO影响前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
html5规范 says

The outline for a sectioning content element or a sectioning root element consists of a list of one or more potentially nested sections. A section is a container that corresponds to some nodes in the original DOM tree. Each section can have one heading associated with it,and can contain any number of further nested sections. The algorithm for the outline also associates each node in the DOM tree with a particular section and potentially a heading.

并且同样的推理似乎应用于html5 document outline algorithm

我一直在使用HTML5 outliner(h5o)[link]工具检查我的网站的大纲,但是我很难实现一个清晰的大纲,没有超负荷的无用的标题,因为这样的事实,如< nav>或< footer>将出现在你的大纲,但会这样做’未命名’,除非你给他们一个明确的h1-h6标题

这似乎对导航或页脚等东西似乎是过度的。

一个解决方案是用div替换这些元素,但是这似乎打败了使用html5的整个目的。

另一个,我已经试过我的网站[link],是设置所有切片元素的标题,然后使用CSS隐藏其中的一些标题(再次,基本上< nav>和< footer&以及一些< section>元素。下面是一个例子:

<nav id="content-nav">
    <h2 class="hidden">Post navigation</h2>
    <ul>
        <li class="alignleft"><?PHP next_post_link('&#8592; <strong>Next Post</strong><br />%link') ?></li>
        <li class="alignright"><?PHP prevIoUs_post_link('<strong>PrevIoUs Post</strong> &#8594;<br />%link') ?></li>
    </ul>
</nav>

这导致一个很好的显示网站,但我看到的问题是谷歌排名。在其关于“隐藏文字链接”的网站站长工具帮助项目[link]中,Google清楚地说明:

Hiding text or links in your content can cause your site to be perceived as untrustworthy since it presents information to search engines differently than to visitors. Text (such as excessive keywords) can be hidden in several ways,including: […] Using CSS to hide text…

有些人可能会觉得Google喜欢他们使用隐藏文字的事实并不重要,但我的大多数访问者来自Google搜索,我不想因为选择使用此设置而受到惩罚。

任何人都可以提供有关这个问题的建议?

解决方法

Another,which I’ve tentatively tried on my site,is to set headings for all sectioning elements and then use CSS to hide the headings for some of theme (again,basically <nav> and <footer>,as well as some <section> elements.

这正是我的方式,实际上没有建立一个HTML5网站,但有趣的足够I looked into this a while back

标题”或部分标题,非常适合创建结构或文档大纲(如大纲上所示)。它们对Assisted Technology用户也非常有用,他们可以通过“标签”通过标题而基本上找到他们的方式,而不必“听”一切,并尝试找出你可能会放在哪里。您的搜索框。

这就是为什么我看到标题/标题应该在那里,即使他们被隐藏的视觉用户视图(和东西的SE;))

不是所有的CSS隐藏方法都是一样的

OK所以我知道我们不能注销SE,所以你选择隐藏标题的方式是重要的,因为你希望他们可以为AT(辅助技术)用户..显示:无;是不可靠的(一些屏幕阅读器不读他们),你不能“标签”找到它们 – visibility:hidden;不会删除空格,你仍然无法“tab”查找

那么隐藏方法

..真的很酷的一个,发现Drupal社区的成员..使用剪辑:rect();保持大家快乐的财产

.my-hidden-element {
  position: absolute;
  clip: rect(1px 1px 1px 1px); /* IE6 & 7 */
  clip: rect(1px,1px,1px);
}

对于Google来说,即使开始提出标记,它们也不会难以根据剪辑属性“全部禁止/惩罚”,我认为这是一切,如果你可以证明一个合法用法隐藏一个元素 – 应该没有问题..事实上,在这种情况下,额外的标题理论上应该帮助他们“查找结构” – 所以我真的觉得这不是最大的麻烦。

我的想法

我绝对认为我们应该根据HTML5 recs标题部分,它比任何代码元素或类名称更语义,但我也100%认为我们应该能够隐藏他们从视觉查看器,因为没有点显示标题搜索此网站”,如果您的视觉用户可以看到有一个搜索框有;) – 该标题只对非视觉用户和SE的帮助,以帮助他们查找文档的区域..理论上应该帮助SE / Google关闭那个区域他们不应该需要索引一个搜索框..所以他们将不得不去工作他们的AI,你不认为)

我的感觉是去与这一点,并明确为什么你这样做,那么如果你的网站被任何机会标记(我认为是不太可能的,将是一个手动审查),你可以解释清楚为什么你在做它..只要那些隐藏的标题不是“垃圾”,那么我认为它会落入相同的类别,“图像替换”

1很好的问题!

原文链接:https://www.f2er.com/html5/169479.html

猜你在找的HTML5相关文章