Skip to main content

การเพิ่มลิงก์ไปยังเว็บเพจ

Anonim

หนึ่งใน differentiators หลักระหว่างเว็บไซต์และรูปแบบอื่น ๆ ของสื่อการสื่อสารเป็นความคิดของ "การเชื่อมโยง" หรือเชื่อมโยงหลายมิติที่พวกเขาเป็นที่รู้จักกันในแง่การออกแบบเว็บ

นอกเหนือจากการช่วยในการทำเว็บสิ่งที่เป็นอยู่ในปัจจุบันการเชื่อมโยงและรูปภาพต่างๆได้อย่างง่ายดายมากที่สุดโดยการเพิ่มสิ่งต่างๆบนหน้าเว็บ Thankfully รายการเหล่านี้ง่ายต่อการเพิ่ม (เพียงสองแท็กพื้นฐาน HTML) และพวกเขาสามารถนำความตื่นเต้นและการโต้ตอบกับสิ่งที่จะเป็นอย่างอื่นหน้าเว็บข้อความธรรมดา ในบทความนี้คุณจะได้เรียนรู้เกี่ยวกับแท็ก (anchor) ซึ่งเป็นองค์ประกอบ HTML จริงที่ใช้เพื่อเพิ่มลิงก์ไปยังหน้าเว็บไซต์

การเพิ่มลิงก์

ลิงก์เรียกว่า anchor ใน HTML ดังนั้นแท็กจึงเป็นแท็ก A โดยปกติแล้วผู้คนเพียง แต่อ้างถึงข้อมูลเพิ่มเติมเหล่านี้ว่า "ลิงก์" แต่ส่วนที่ยึดเป็นสิ่งที่ถูกเพิ่มเข้าไปในหน้าใด ๆ

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

href attribute หมายถึง "hypertext reference" และมีจุดประสงค์เพื่อกำหนด URL ที่คุณต้องการให้ลิงก์นั้นไปที่ หากไม่มีข้อมูลนี้การเชื่อมโยงจะไม่มีประโยชน์ - จะบอกเบราว์เซอร์ว่าผู้ใช้ควรได้รับที่อื่น แต่จะไม่มีข้อมูลปลายทางสำหรับที่ที่ "ที่ไหนสักแห่ง" ควรเป็น แท็กนี้และแอตทริบิวต์นี้จับมือกัน

ตัวอย่างเช่นในการสร้างลิงก์ข้อความคุณจะเขียน:

ข้อความที่จะเป็นลิงค์

ดังนั้นเพื่อเชื่อมโยงไปยังหน้าแรกของ About.com Web Design / HTML คุณจะต้องเขียน:

LifeWire

คุณสามารถเชื่อมโยงเกือบทุกอย่างในหน้า HTML รวมทั้งภาพ เพียงล้อมรอบองค์ประกอบ HTML หรือองค์ประกอบที่คุณต้องการเชื่อมโยงกับ

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

HTML5 ทำให้สามารถเชื่อมโยงองค์ประกอบระดับบล็อกเช่นย่อหน้าและ DIV องค์ประกอบ คุณสามารถเพิ่มแท็ก anchor ลงในพื้นที่ขนาดใหญ่เช่นรายการ division หรือ definition และพื้นที่ทั้งหมดจะ "คลิกได้" วิธีนี้สามารถเป็นประโยชน์อย่างยิ่งเมื่อพยายามสร้างพื้นที่ที่มีขนาดใหญ่และเป็นมิตรกับการตีในเว็บไซต์

บางสิ่งที่ต้องจำเมื่อเพิ่มลิงค์

  • สุดท้าย คือแท็ก จำเป็นต้องใช้. หากคุณลืมใส่ไว้ทุกอย่างที่ลิงก์ต่อไปนี้จะเชื่อมโยงกันจนกว่าลิงก์อื่นจะปิดแท็ก
  • โดยส่วนใหญ่แล้วจะเป็นการดีที่จะเชื่อมโยงรูปภาพเดี่ยวและช่วงเวลาสั้น ๆ ของข้อความแทนที่จะเป็นข้อความขนาดใหญ่ ลิงค์สามารถเพิ่มสีและขีดเส้นใต้สไตล์ให้กับหน้าเว็บของคุณซึ่งอาจอ่านได้ยาก แน่นอนคุณสามารถใช้ CSS เพื่อเปลี่ยนรูปแบบลิงก์เหล่านี้และแก้ไขสีหรือลบเส้นใต้ แต่ก็ยังดีที่จะต้องคำนึงถึงความเป็นจริงนี้
  • ตรวจสอบให้แน่ใจว่าได้ตรวจสอบลิงก์ของคุณเพื่อไม่ให้เกิดความเสียหาย Link Rot สามารถทำให้ทั้งผู้ใช้และเครื่องมือค้นหาพิจารณาไซต์ของคุณไม่ถูกต้อง ใช้ตัวตรวจสอบลิงก์เป็นประจำเพื่อยืนยันลิงก์บนหน้าเว็บของคุณ โดยเฉพาะอย่างยิ่งเมื่อคุณลิงก์ไปยังไซต์ของบุคคลที่สาม (ไซต์ที่คุณไม่ได้จัดการ) และอาจทำให้หน้าเว็บเพจของคุณเปลี่ยนไปโดยไม่ทำให้เกิดการเชื่อมโยงที่ตายไป ตัวตรวจสอบการเชื่อมโยงจะพบลิงก์ที่เสียไปเหล่านี้เพื่อให้คุณสามารถทำการอัปเดตที่จำเป็นได้
  • หลีกเลี่ยงข้อความเช่น "คลิกที่นี่" ในลิงก์ของคุณ โปรดจำไว้ว่าคนที่มีหน้าจอสัมผัสไม่สามารถ "คลิก" เพื่อให้ข้อความรู้สึกเหมือนเป็นผลิตภัณฑ์ในยุคที่ผ่านมาและจริงๆแล้วไม่มีความเกี่ยวข้องกับเว็บศูนย์กลางหลายอุปกรณ์ในปัจจุบัน

ประเภทลิงก์ที่น่าสนใจอื่น ๆ

สร้างลิงก์มาตรฐานไปยังเอกสารอื่น แต่มีลิงก์ประเภทอื่น ๆ ที่คุณอาจสนใจ:

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