Saya mencoba menggunakan <h1>tag di blog saya untuk judul posting dan menemukan satu masalah. Judul hyperlink.

Kasus 1:

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

kasus 2:

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

Mana yang lebih baik dari segi SEO?

Jika Anda menggunakan HTML5 , pilih saja; mereka setara.
HTML5 memang memungkinkan tautan level blok , tetapi dalam kasus Anda tidak ada alasan khusus untuk melakukannya, karena hanya ada satu elemen level blok. Secara pribadi, saya tidak akan melakukannya di sini, karena memiliki <h1>tag di luar akan membuatnya lebih mudah untuk memindai kode sumber.

Hal lain (XHTML, HTML4, dll) dan yang kedua jelas-jelas salah. Itu bukan kode yang valid, dan pada tingkat tertentu itu buruk untuk optimasi pencarian Anda [Masukkan penafian standar tentang seberapa banyak pelanggaran tunggal yang benar-benar memengaruhi apa pun, dll.].

Mereka sama sejauh menyangkut SEO. (Biasanya elemen tingkat blok mengandung elemen sebaris dan bukan sebaliknya, jadi Anda harus menggunakan contoh pertama tetapi tidak akan memengaruhi SEO).

Keduanya benar dalam html5 , html memungkinkan elemen blok dalam elemen sebaris. Ini juga tidak berpengaruh pada SEO, kedua kasus teks dibungkus dalam pos, sehingga tetap memiliki nilai yang sama.

Ini bukan pilihan validitas, tetapi preferensi di Antarmuka Pengguna:

• Jika Anda membungkus tajuk di sekitar jangkar, Anda membuat jangkar besar, hanya teks yang bisa diklik.
• Saat Anda membungkus jangkar di sekitar tajuk, seluruh baris dapat diklik.

Saya telah membuat Anda contoh di jsFiddle.net

Saya menemukan bahwa dengan Kasus 2, hrefsisipan sering tidak sesuai dengan halaman saya yang lain. Tapi itu bisa jadi cara saya mengatur margin saya di saya .css. Jadi saya akan mendukung Kasus 1.

Apa yang dikatakan di sini adalah wawasan, terima kasih semua. Mari kita ambil satu tingkat lagi: menambahkan mikrodata dan semacamnya ke dalam persamaan.

Katakanlah kita punya

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

bersaing dengan

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

Bagi saya, 'terlepas dari kinerjanya', contoh 2 lebih masuk akal. Karena tautan tidak pernah menjadi bagian dari nama. Perbedaan bermuara pada perbedaan antara innerHTML dan textContent, DOMwise. Melihatnya melalui innerHTML, jangkar menghalangi. Jika textContent adalah caranya, tag akan dilucuti. Jadi itu juga mengajukan pertanyaan: innerHTML atau textContent.

Jadi saya akan mengatakan, dengan mempertimbangkan microdata, memiliki jangkar di luar lebih murni.

berdasarkan: http://thenewcode.com/617/How-To-Add-Microdata-To-Your-Blog

<h1> <a href=""> xyz </a> </h1> Contoh ini benar.

Tautan level blok harus dihindari untuk keperluan SEO - dari mulut kuda: https://www.seroundtable.com/block-level-links-google-seo-16369.html

Perbarui: Takeaways dari tautan ...

Memiliki tautan yang menghubungkan, seperti yang dikatakan orang lain, boleh saja untuk menghubungkan. Namun, untuk keperluan SEO, Anda harus menjaga agar anchor text tetap bersih sehingga Google dapat menginterpretasikan anchor dengan lebih baik dan menetapkan relevansi yang sesuai.

John Mueller (Analis Tren Webmaster di Google) selanjutnya mengatakan ...

Penggunaan itu tidak masalah bagi kami (Google) - kami masih akan mengambil tautannya, dan akan dapat mengaitkan teks Anda sebagai jangkar dengan itu. Kami cukup fleksibel dengan parsing HTML, jadi Anda mungkin bisa menggunakan ini dengan HTML4. Yang mengatakan, semakin jelas Anda membuat teks jangkar Anda, semakin mudah bagi kita untuk memahami konteks tautan, jadi saya tidak akan selalu menggunakan seluruh paragraf sebagai jangkar untuk semua tautan internal Anda.

TL; DR Untuk SEO, jangan gunakan tautan tingkat blok.

Jika tujuannya adalah untuk memiliki elemen tambahan yang dapat diklik di dalam tautan (seperti gambar, dll.) Dan masih memvalidasi dengan html <5, Anda dapat melakukannya dengan 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>

selain itu, cukup:

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

tambahkan cursor:pointerke css elemen induk untuk membuat triknya lengkap.