Penggunaan tag judul html h

Penggunaan tag H, terutama penggunaan H1, selalu menjadi masalah kontroversial dan juga merupakan pertanyaan yang layak untuk penelitian kami. Berdasarkan pengalaman pendahulu saya, saya menulis artikel ini berdasarkan pemahaman saya tentang t tag, berharap ini akan membantu semua orang. APA ITU H TAG?

W3C menunjukkan bahwa tag H1-H6 dapat menentukan judul. H1 mendefinisikan gelar terbesar. H6 mendefinisikan judul terkecil.

H1, H2, H3, H4, H5, H6, sebagai tag judul dan berkurang sesuai dengan kepentingan. Saya pikir perlu untuk mengikuti prinsip -prinsip seperti itu, yang dapat membuat hubungan hierarkis halaman lebih jelas, dan memungkinkan mesin pencari untuk merangkak dengan lebih baik dan menganalisis konten topik halaman, dll. Untuk pemahaman yang lebih baik, silakan lihat kode berikut:

 <hody> <h1> Judul tingkat pertama </h1> <p> Paragraf </p> <hv> <h2> Judul tingkat kedua </h2> <p> ... </p> <h3

Gaya default browser juga berkurang berdasarkan kepentingan, dan ukuran font berubah dari besar ke kecil dari H1 ke H6. Ada beberapa perbedaan gaya di browser yang berbeda. Karena perbedaan ini, kami biasanya menggunakan CSS untuk menyatukannya dalam tata letak.

Saat ini, banyak situs web (termasuk situs web terkenal seperti Taobao, Sina, Sohu) suka menggunakan H1 pada logo, seperti yang ditunjukkan pada gambar:

Bukan tanpa alasan bagi semua orang untuk menggunakan ini, tetapi pada kenyataannya ada cukup banyak keuntungan: itu merangkum konten seluruh halaman, dan logo sangat dekat dengan tubuh, yang membuatnya nyaman bagi mesin pencari untuk mengambil topik tercepat, dan dalam hal semantik, itu juga lebih akurat.

Tentu saja, tidak semua situs web menggunakan H1 pada logo. Penggunaan Netease adalah contoh yang lebih istimewa:

Netease mengatur tampilan: Tidak ada gaya untuk menyembunyikannya, yang tidak hanya memecahkan kontradiksi tidak tahu di mana harus menempatkan H1, tetapi juga memainkan peran optimasi SEO, yang dapat dikatakan membunuh dua burung dengan satu batu.

Dan beranda Tencent H1 adalah berita utama, seperti yang ditunjukkan pada gambar:

Dari contoh di atas, kita dapat melihat bahwa penggunaan H1 berbeda untuk situs web utama. Di mana harus meletakkannya di H1? Itu selalu menjadi masalah yang kontroversial, tetapi saya tidak berpikir ada jawaban mutlak untuk di mana harus meletakkannya. Saya pikir itu harus dipertimbangkan berdasarkan faktor -faktor seperti posisi, jenis, dan kebiasaan pencarian pengguna dari halaman web. Misalnya, untuk situs web berita, Anda dapat menempatkan H1 di berita utama; Untuk situs web portal yang komprehensif, Anda dapat menempatkan H1 di logo; Jika situs web perusahaan juga dapat menempatkan H1 pada logo, karena pengguna umumnya suka mencari nama perusahaan; Jika ada slogan situs web, Anda juga dapat menempatkan H1 pada slogan, yang juga merupakan pilihan yang baik. Singkatnya, memilih yang paling sesuai adalah yang terbaik.

Mengenai H2, saya biasanya suka menggunakannya di kolom besar beranda, seperti yang ditunjukkan pada gambar:

Untuk halaman konten, saya lebih terbiasa memberikan H2 ke judul artikel, dan judul kolom diwakili oleh H3, seperti yang ditunjukkan pada gambar:

H3 sebagian besar digunakan untuk judul kolom, seperti yang ditunjukkan pada gambar:

Tag H yang digunakan di beranda produk R&F tidak hanya memiliki hubungan hierarkis yang jelas, tetapi juga menyoroti pentingnya konten produk, yang juga sangat bermanfaat bagi mesin pencari.

Contoh berikut juga sangat menarik, seperti yang ditunjukkan pada gambar:

Judul kolom menggunakan H2, dan judul berita menggunakan H1. Jika perintah mereka terbalik menurut hubungan hierarkis, itu tidak salah. Ketika benar -benar menggunakan tag H, kami juga dapat mendefinisikannya berdasarkan pentingnya konten. Oleh karena itu, hanya dengan secara fleksibel menerapkan teori -teori dasar yang dapat dimaksimalkan.

Dari contoh -contoh di atas, tidak sulit untuk melihat bahwa penggunaan tag H sangat fleksibel dan tidak terbatas pada penggunaan ini. Dalam aplikasi kami, kami hanya perlu mengikuti prinsip mengurangi kepentingan dan belajar dari satu contoh dan menerapkannya pada aspek lain. Hal yang sama berlaku untuk H4-H6.

Berdasarkan pemahaman dan penerapan tag H oleh bahan referensi, pakar produksi front-end, situs web terkenal, dll., Saya telah merangkum spesifikasi berikut, berharap dapat memberi Anda beberapa nilai referensi.

H1 Judul Tingkat Pertama

Ini mewakili prioritas utama, dan posisinya sama pentingnya dengan posisi kata kunci di halaman. Ini umumnya digunakan dalam judul atau tajuk situs web, dan beberapa situs web besar juga digunakan dalam logo. Meskipun kode H1 dapat ditulis secara multipel, mereka sebenarnya unik secara semantik. Yang terbaik adalah hanya muncul sekali atau tidak di halaman.

Judul H2 Level 2

Ini terutama muncul dalam judul artikel dan judul kolom konten utama halaman. Struktur tiga kolom umumnya di tengah, dan struktur dua kolom umumnya berada di sisi penting. Dapat digunakan dengan H3.

Judul Level Tiga H3

Sidebar halaman utama umum. H4 adalah tambahan dan muncul tidak terlalu sering.

Hubungan level halaman tidak bisa terlalu dalam, jadi H4, H5, H6 umumnya tampak lebih sedikit.