การใช้ SEO <i> ในองค์ประกอบส่วนหัวเป็นเรื่องที่ผิดหรือไม่


11

ในการสร้างเว็บไซต์ที่เป็นมิตรกับผู้ใช้ฉันต้องใช้แบบอักษร Font Awesome ใน<h>องค์ประกอบเช่นนี้:

<h2>
<i style="color: rgb(102, 149, 45); vertical-align: inherit;" class="fa fa-gear"></i>
 Performance
</h2>

อันที่จริงนี่คือบทความทบทวน มันก็โอเคที่จะนำอักษรเหล่านี้ (หรือ<i>องค์ประกอบ) ใน HTML ภายในขององค์ประกอบส่วนหัวเช่น<h1>, <h2>, <h3>ฯลฯ ?

โปรดระบุแหล่งที่มาของคุณหรือเอกสารบางอย่างเช่นกันเพราะเป็นสิ่งสำคัญสำหรับฉัน ฉันไม่ต้องการทำผิดพลาดเกี่ยวกับหัวข้อนี้


3
ดีกว่าที่จะใช้<span>สำหรับ FontAwesome การใช้<i>การใช้โง่<h2><span class="fa fa-gear"> </span></h2>ก็จะใช้ได้เช่นกัน
Simon Hayter

คำตอบ:


11

ฉันจะบอกว่ามันจะไม่เป็นอันตรายมากและจะไม่เพิ่มอะไร iฉันชอบที่จะเก็บแท็กส่วนหัวของฉันที่สะอาดและจะไม่เพิ่ม สไตล์อินไลน์จะเป็นปัญหาที่ใหญ่กว่าซึ่งไม่ใช่ปัญหาใหญ่จริงๆ

แทนที่จะทำสิ่งนี้คุณสามารถเพิ่มไอคอนรูปเฟืองใน H2 ได้โดยตรง:

h2.Geared:before{
    display: inline-block;
    color: rgb(102, 149, 45); 
    font-family: "FontAwesome";
    content: "\f013"; /*The actual character FontAwesome uses */
}

<h2 class="Geared">This text will have the gear</h2>

3
ผู้ใช้ควรใช้ CSS และไม่ขยาย HTML ในขณะที่การออกแบบแท็กส่วนหัวจะไม่ทำให้เกิดการเผาไหม้หัวใจ HTML จะป่อง
Closnoc

1
ฉันไม่เห็นด้วยในระดับหนึ่ง เพราะคุณทั้งคู่มองข้ามความจริงที่ว่าแค่ลด HTML ลง แต่เพิ่ม CSS เพราะอันที่จริงคุณเพิ่มมากกว่าลดลง หากคุณใช้งานน้อยกว่าไบต์ให้ใช้ SASS และใช้บรรทัดเอกพจน์ใน CSS ดังนี้: .h2.geared:before, .fa-gear:before,.fa-cog:before{content:"\f013"}นอกจากนี้จะไม่มีอะไรผิดปกติกับการใช้ที่<h2>Title <span class="fa fa-gear"> <span></h2>ถูกต้องทั้งหมดและจะไม่เป็นอันตรายต่อ SEO ในเวลาอันสั้น
Simon Hayter

แม้ว่าชื่อคลาสจะเลือกไม่ดี แต่คุณสามารถเปลี่ยนเกียร์เป็นไอคอนอื่นได้โดยไม่ต้องเปลี่ยน CSS ทั้งหมด คุณสามารถเปลี่ยนรูปลักษณ์ด้วย css ซึ่งจะวางไว้ในสไตล์ชีท ฉันก็เห็นด้วยกับข้อเสนอแนะของคุณไม่ว่าจะเป็น IMO ที่ไม่ดี
Martijn

การแนะนำว่า html และ css สามารถลดได้โดยใช้ sass นั้นไร้สาระ Sass ขยายเป็น css ดังนั้นจึงไม่ช่วยประหยัดแบนด์วิดท์เพียงพิมพ์ นั่นมีค่าแน่นอน แต่ไม่เกี่ยวข้องกับการสนทนาในมือ
เนท

6

Google ไม่สนใจว่าแท็กใดที่คุณใช้ในปัจจุบัน Google ใส่ใจว่าหน้าเว็บมีลักษณะอย่างไรต่อผู้ใช้ มันสนใจเกี่ยวกับข้อความที่มีขนาดใหญ่ มันสนใจเกี่ยวกับข้อความที่โดดเด่น มันสนใจเกี่ยวกับข้อความที่ถูกซ่อนอยู่ การทดสอบ SEO ล่าสุดแสดงให้เห็นว่าไม่มีความแตกต่างระหว่างการใช้<div>แท็กที่มีสไตล์เพื่อให้ดูเหมือนกับหัวเรื่องและการใช้<h1>แท็กเท่าที่ Google เกี่ยวข้อง

ฉันขมวดคิ้วเมื่อใช้แท็กสำหรับตัวเอียงมากกว่าใช้ CSS มันผสมผสานความหมายและการนำเสนอ อย่างไรก็ตามจากมุมมองของ SEO ไม่ควรมีผลกระทบเชิงลบหรือเชิงบวก


นี่คือคำตอบ <i> เป็นองค์ประกอบ HTML มาตรฐานและจะไม่มีผลกับ SEO ของคุณ นอกจากนี้สไตล์ CSS จะไม่ส่งผลต่อ SEO ยกเว้นในกรณีที่ใช้เพื่อซ่อนเนื้อหา กุญแจสำคัญที่สุดจะเป็นเนื้อหาเนื้อหาเนื้อหาเสมอ
Rob

-1

ใช่มันเป็นความคิดที่ไม่ดี ใช้<h>แท็กคำชี้แจงที่ชัดเจนนี่เป็นหนึ่งในกฎของ Google


2
คำตอบนี้ไม่ถูกต้อง
John Conde

1
ฉันไม่เคยได้ยิน<h>แท็กปล่อยให้คนเดียววิ่งข้ามกฎจาก Google เพื่อใช้งาน คุณสามารถลิงค์ไปยังเอกสารบางอย่างได้หรือไม่?
Stephen Ostermiller
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.