การสร้างจุด Link (Text Link) [Article ID : 104]

การสร้าง Link ในแบบ Text Link

Link หรือ ลิงค์ เป็นจุดเชื่อมโยงที่ปรากฎบนหน้าเว็บ เพื่อให้ผู้ใช้งานเว็บสามารถคลิกหรือกดไปยังหน้าเว็บอื่น ๆ หรือไปยังไฟล์เอกสารอื่น ๆ ได้ ซึ่งวิธีการสร้าง Link หรือ Hyper Link นั้น เราสามารถแบ่งออกได้เป็น 2 แบบ คือ
1. ลิงค์ไปยังไฟล์หรือข้อมูลที่อยู่ภายในเว็บไซต์
2. ลิงค์ไปยังข้อมูล หรือเว็บภายนอก

ซึ่งเรามาดูวิธีการสร้าง Link ทั้ง 2 แบบกัน ดังนี้

การสร้าง Text Link แบบลิงค์ภายในเว็บไซต์

ทำการจัดเตรียมข้อมูลต่าง ๆ ที่ต้องใช้ในการสร้าง Link เสียก่อน เช่น สร้างไฟล์เว็บเพจต่าง ๆ เพื่อรอการสร้างลิงค์ไปหากัน จากนั้นให้ทำการพิมพ์ข้อความตามที่ต้องการกับเว็บเพจของเรา แล้วให้ปฏิบัติตามขั้นตอนต่าง ๆ ดังนี้

1. เลือกข้อความที่ต้องการให้เป็นลิงค์
2. จากนั้นไปที่ Properties Panel Option ที่เขียนว่า Link กดที่ปุ่ม Browse... เพื่อเลือกไฟล์ที่ต้องการลิงค์ไปหา ดังรูป เมื่อเลือกไฟล์ที่ต้องการลิงค์ไปหาได้แล้ว กดที่ปุ่ม OK

3. ข้อความที่เลือกไว้ยังข้อ 1 จะกลายเป็นลิงค์ ดังรูป

การสร้าง Text Link แบบลิงค์ไปภายนอกเว็บไซต์

ทำการเก็บข้อมูล URL ของเว็บที่ต้องการทำลิงค์ไป ซึ่งอาจจะได้มาจากการ Copy ที่ Address Bar ของ Web Browser จากนั้นปฏิบัติ ดังนี้

 ตัวอย่าง URL : http://gmail.com/ 
 

1. เลือกข้อความที่ต้องการให้เป็นลิงค์
2. จากนั้นไปที่ Properties Panel Option ที่เขียนว่า Link ให้ทำการพิมพ์ URL ของเว็บไซต์ที่ต้องการลิงค์ไป ดังรูป จากรูปข้างต้น เป็นการลิงค์ไปที่เว็บ Gmail ซึ่งเป็นเว็บที่อยู่ภายนอกเว็บไซต์ของเรา

3. ข้อความที่เลือกไว้ยังข้อ 1 จะกลายเป็นลิงค์ ดังรูป

คลิปประกอบบทความ

*คลิกที่โลโก้ YouTube เพื่อเข้าดูที่ยูทูปนะครับ จะสามารถขยายจอดูได้

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

About the Author

Mr.Sittichai Raksasuk

Sittichai is a Web Developer and Web Technology Instructor for over 10 yrs. He is also a webmaster of dwthai.com and author jQuery with Dreamweaver (2010). DwThai.Com is a website for web developer using Adobe Dreamweaver.

Contact with him : dwthai@gmail.com

บทความอื่นที่คุณอาจสนใจ

ก้าวแรกของนักพัฒนาเว็บ : ทำความรู้จักกับโปรแกรม Dreamweaver

เรื่อง : ก้าวแรกสู่การเป็นนักพัฒนาเว็บไซต์ เริ่มทำความรู้จักกับโปรแกรม Dreamweaver Dreamweave...  

การกำหนด Properties หรือคุณสมบัติของตาราง

เรื่อง : การกำหนดคุณสมบัติ หรือ Properties ให้แก่ตาราง (Table) ในบทก่อนได้กล่าวถึงการสร้างตารางไปแล้ว และได้อธิบายถึงกา...  

ว่าด้วยเรื่อง Tag Selectors ของ Dreamweaver

เรื่อง : แนะนำการใช้ Tag Selectors ใน Dreamweaver Tag Selectors มีประโยชน์อย่างมากในการใช้งานโปรแกรม ในกา...  

วิธีการสร้างตาราง (Table) ให้แก่เว็บเพจ

เรื่อง : การสร้างตาราง (Table) ด้วย Dreamweaver การสร้างตาราง หรือ Table สำคัญ และมีความจำเป็นอย่างมากในการสร้างเว็บเพ...