Computer >> คอมพิวเตอร์ >  >> การเขียนโปรแกรม >> HTML

ความแตกต่างระหว่าง และ ใน HTML คืออะไร

ตัวหนา (aka ตัวหนา) ถือเป็นการเน้นหนักในการพิมพ์ ใน HTML สมัยใหม่ มีองค์ประกอบ HTML สององค์ประกอบที่โดยค่าเริ่มต้นจะใช้น้ำหนักแบบอักษรตัวหนา (เรียกอีกอย่างว่า “ตัวหนา”) กับองค์ประกอบข้อความ (ในเบราว์เซอร์ส่วนใหญ่)

คุณสามารถใช้ <strong> แท็กหรือ <b> แท็กเช่นนี้:

<p>The strong tag is used to <strong>emphasize</strong> text.</p>

<p>The b tag is used to <b>emphasize</b> text.</p>

ใน HTML สมัยใหม่ (HTML5) ทั้ง <strong> และ <b> ถือเป็นความหมายและถูกต้อง แม้ว่าทั้งคู่จะมีรูปแบบการนำเสนอที่เป็นตัวหนาเหมือนกันในเบราว์เซอร์สมัยใหม่ แต่ก็ไม่ได้มีความหมายหรือจุดประสงค์เดียวกัน

แล้วการใช้ strong กับ b ต่างกันอย่างไร และคุณควรใช้อันไหนเพื่ออะไร

  • The <strong> องค์ประกอบใช้สำหรับเนื้อหาที่มีความสำคัญอย่างยิ่ง (เช่นคำเตือน)
  • The <b> องค์ประกอบใช้เพื่อดึงดูดความสนใจ โดยไม่บอกความสำคัญ

ตัวอย่างการใช้ <b> :

The Spanish word <b>idioma</b> means “language”. It originates from Greek.

ในตัวอย่างข้างต้น ฉันในฐานะนักพิมพ์ตัวอักษร ตัดสินใจที่จะเน้นคำว่า idioma ไม่ใช่เพราะมัน ยอดเยี่ยม สำคัญ แต่เนื่องจากเป็นคำต่างประเทศที่ไม่ใช่ภาษาอังกฤษ ฉันจึงอยากโดดเด่นจากข้อความที่อยู่รอบๆ เป็นการตัดสินใจแบบมีสไตล์มากกว่าที่จะต้องทำเพื่อสื่อความหมาย

ดังนั้น หากคุณต้องการดึงความสนใจไปที่บางสิ่ง โดยไม่มีความหมายเฉพาะเจาะจงเบื้องหลัง <b> ในอดีต (ก่อน HTML5) จะถูกต้องในการใช้งาน ที่กล่าวว่าในยุคปัจจุบัน เราไม่ได้ใช้ HTML สำหรับการนำเสนอ เราใช้ CSS ซึ่งเป็นสาเหตุที่ผมไม่ใช้ <b>

ตัวอย่างการใช้ <strong> :

In 2020, <strong>security</strong> and <strong>performance</strong> are are
crucial for your SEO.

ในตัวอย่างข้างต้น ฉันตัดสินใจเน้นย้ำถึงความปลอดภัย และประสิทธิภาพ เพราะหัวข้อเหล่านั้นมีความสำคัญอย่างยิ่งต่อ SEO (และ UX) ของเว็บไซต์ของคุณ

โดยค่าเริ่มต้น <strong> และ <b> จะใช้รูปแบบตัวหนาแบบเดียวกันกับข้อความในเบราว์เซอร์ส่วนใหญ่ ซึ่งทำให้เข้าใจได้ค่อนข้างมาก ทำไมต้องทำให้เหมือนกันทั้งๆ ที่เป็นเครื่องมือที่แตกต่างกันสำหรับกรณีการใช้งานที่แตกต่างกัน

ฉันเห็นด้วยกับคุณ. มันน่ารำคาญ

นี่คือเหตุผลที่คุณอาจต้องการแทนที่ค่าเริ่มต้นของเบราว์เซอร์และใช้รูปแบบที่แตกต่างกันไป

วิธีที่ดีในการแยกแยะระหว่าง <strong> และ <b> การนำเสนอคือการใช้น้ำหนักแบบอักษร 500 ถึง 900 (ขึ้นอยู่กับตระกูลแบบอักษร) กับ <strong> ของคุณ องค์ประกอบด้วย CSS ชอบสิ่งนี้:

strong {
  font-weight: 700;
}

แล้วใช้สไตล์อื่นสำหรับ <b> , เช่น:

b {
  font-weight: 400;
  color: green;
}

ด้านบนนี้ไม่ใช่คำแนะนำรูปแบบ แต่เป็นตัวอย่างของวิธีที่คุณสามารถจดจำได้ง่ายขึ้นว่าคุณเคยใช้รูปแบบใดในการดูหน้าที่แสดงผลในเบราว์เซอร์ของคุณ

หากคุณใช้มาร์กดาวน์

หากคุณพยายามแปลง <b> หรือ <strong> ในการมาร์กดาวน์ในตัวแปลง HTML เป็น Markdown เช่น Browserling คุณจะสังเกตเห็นว่าทั้งคู่ได้รับ ** ** เดียวกัน — ซึ่งแสดงผลเป็น <strong> ในเบราว์เซอร์

แล้วให้อะไร?

ฉันไม่แน่ใจ. ฉันไม่พบคู่มือ markdown ที่แสดงวิธีการแสดง <b> ไปยังเบราว์เซอร์เมื่อใช้ markdown อย่างน้อยก็ไม่ใช้ไวยากรณ์ markdown

ไม่ต้องกังวล คุณยังสามารถใช้ไวยากรณ์ HTML ได้โดยตรงในไฟล์ markdown (ยกเว้นกรณีที่คุณใช้เวอร์ชันเก่า) ดังนั้นหากต้องการหรือจำเป็นต้องใช้ <b> แทน <strong> คุณสามารถเพิ่มได้ดังนี้:

Here is a line of text inside a <b>markdown</b> file which automatically gets wrapped by paragraph tags

ฉันกำลังเขียนบทช่วยสอนนี้ในมาร์กดาวน์ ตอนนี้ฉันจะเน้นข้อความนี้ ด้วย <b> องค์ประกอบ. หากคุณทำเครื่องหมายและเลือกย่อหน้านี้แล้วคลิก "ตรวจสอบ" คุณจะเห็นว่าใช้ <b> จริงๆ ธาตุ

สำคัญกับสิ่งที่คุณใช้จริงหรือไม่

เห็นได้ชัดว่าไม่ใช่ปัญหาชีวิตหรือความตาย หรือเบราว์เซอร์สมัยใหม่จะไม่แสดง <b> และ <strong> ด้วยสไตล์ตัวหนาแบบเดียวกัน

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

โดยสรุป:

  • <b> ใช้เพื่อดึงความสนใจไปยังข้อความเฉพาะ
  • <strong> ใช้สำหรับข้อความสำคัญ
  • หากมีข้อสงสัย ให้ใช้ <strong> .

หลักการที่ดีคือการหลีกเลี่ยงการเน้นย้ำในทางที่ผิด เมื่อคุณพยายามเน้นมากเกินไป การเน้นจะสูญเสียพลังไป ถ้าเน้นทุกอย่างก็ไม่เน้นอะไร (ฉันกำลังดูคุณอยู่ เว็บไซต์แลนดิ้งเพจการตลาดทั่วไป)