我试图在博客上使用<h1>标签作为帖子标题,但遇到了一个问题。标题带有超链接。

案例1:

<h1> <a href=""> xyz </a> </h1>


<a href=""> <h1> xyz</h1> </a> 


在SEO方面哪个更好?

#1 楼

如果您使用的是HTML5,则只需选择一个即可。它们等效。就个人而言,我不会在这里这样做,因为在外部使用<h1>标记可以更轻松地在源代码中进行扫描。完全是错误的。它不是有效的代码,并且在某种程度上不利于您的搜索优化[插入关于任何单一攻击实际上对任何事物有多大影响的标准免责声明,等等。]

评论


我有一个问题:

hello

// 5个字符

hello

// 5个字符或google将其读取为12个字符?

– hfarazm
16年7月19日在13:40



#2 楼

就SEO而言,它们是相同的。 (通常,块级元素包含内联元素,反之亦然,因此您应该使用第一个示例,但它不会影响SEO。)

评论


实际上,根据HTML规范,内联元素不得包含block元素。

–心怀不满的山羊
2011年10月3日在15:03

@DisgruntledGoat不完全是。 Doctype需要考虑。

– Su'
2011年10月3日16:07

@Su'哪些文档类型允许内联元素中包含块元素?

–心怀不满的山羊
2011年10月3日23:17

@DisgruntledGoat HTML5允许链接(以前只是内联元素)链接到标题和段落标签等块元素。这是doctype重要的地方。如果您使用的是HTML5,则务必使用模式

。否则,请使用

的传统模式。 Google会同等地注意这两种方法,但是除非您具有正确的doctype(HTML5),否则某些浏览器可能无法很好地配合非标准模式使用。

–蒂娜·贝尔·万斯(Tina Bell Vance)
2012年6月20日12:31

因此以上内容也适用于命名锚标签。是不是除了

Introduction

以外,最好有

Introduction



–贾巴尔(Jayapal Chandran)
13年8月23日在7:34

#3 楼

它们在html5中都是正确的,html允许内联元素中使用块元素。这对SEO也没有影响,在两种情况下,文本都包装在标题中,因此仍保持相同的值。
这不是对有效性的选择,而是用户界面中的首选项:

如果将标头包裹在锚点周围,则会创建一个较大的锚点,只有文本是可单击的。 />我在jsFiddle.net上为您提供了一个示例

#4 楼

我发现对于案例2,href插入内容经常与我页面的其余部分不一致。但这可能是我在.css中设置边距的方式。因此,我希望案例1。

#5 楼

这里所说的很有见地,谢谢大家。让我们再加一个分数:将微数据等添加到方程式中。

假设我们已经

<h1 itemprop="name"><a href="http://goldenage.com/maths.html"
itemprop="url">Mathematics in The Muslim Golden Age</a></h1>



竞争

<a href="http://goldenage.com/maths.html" itemprop="url"><h1
itemprop="name">Mathematics in The Muslim Golden Age</h1></a>


对我来说,“不管表现如何”,示例2都更有意义。因为链接永远不是名称的一部分。区别归结为innerHTML和textContent(即DOMwise)之间的区别。通过innerHTML进行查看时,锚点会妨碍您。如果采用textContent,标签将被剥离。所以这也提出了一个问题:innerHTML或textContent。
http://thenewcode.com/617/How-To-Add-Microdata-To-Your-Blog

#6 楼

<h1> <a href=""> xyz </a> </h1>这个例子是正确的。

评论


在HTML5下都是正确的

–西蒙·海特(Simon Hayter)♦
13年5月3日在18:16

#7 楼

出于SEO目的,应避免使用块级链接-从马口中:
https://www.seroundtable.com/block-level-links-google-seo-16369.html

更新:
从链接中摘录...

具有其他人所说的任何一种链接构造都可以很好地进行链接。但是,出于SEO的目的,您应保持锚文本的整洁,以便Google可以更好地解释锚并分配适当的相关性。

John Mueller(Google网站管理员趋势分析师)接着说...


这种用法对我们来说很好(Google)-我们仍然可以选择链接,并且
可以将您的文本作为锚点与之关联。
解析HTML非常灵活,因此您甚至可以在HTML4中使用此
。也就是说,越清晰地使锚文本成为
,我们就越容易理解链接的上下文,因此我
不一定总是使用整个段落作为所有内部链接。


TL; DR
对于SEO,请不要使用块级链接。

评论


希望您能更新您的答案,它部分显示了两个示例为何与其他人所说的不相同。

–Rob
17年5月26日在12:24



#8 楼

如果目的是要在链接中包含其他可点击的元素(例如图片等),并且仍然使用html <5进行验证,则可以使用javascript:

<div onclick="if (this.getElementsByTagName('a')[0]) location=this.getElementsByTagName('a')[0].href;">
<img src="/foo" alt="" />
<h1>
<a href="#">
linked-heading
</a>
</h1>
</div>


else,简单地:

<h1 onclick="if (this.getElementsByTagName('a')[0]) location=this.getElementsByTagName('a')[0].href;">
<a href="#">
linked-heading
</a>
</h1>


cursor:pointer添加到父元素的cs中以完成技巧。

评论


内联JavaScript?我们回到1999年吗? ;)

–马丁(Martijn)
15年6月22日在11:20

你为什么还要这么做?只需将标头包裹在锚点中即可。这只是不好的做法

–马丁(Martijn)
15年6月22日在11:21



仔细阅读注释,您会发现答案拼写在那里;)Html 4.01实际上早于1999年。当您尝试在该doctype下验证您的建议时,会出现以下错误:在此不允许元素“ H1”(...)导致此消息的一个可能原因是,您试图将一个块级元素(例如“

”或“

”)放入一个内联元素(例如“ ”,“ ”或“ ”)。”当然,不必一定要关心验证者说的是什么,因此在评论的开头就加上了“ if”。

– Lucian Davidescu
2015年6月22日在16:04



最近发表