เรื่อง การเชื่อมโยง

การสร้างจุดเชื่อมโยง (Hyperlink)

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

1. การเชื่อมโยงภายในเว็บเพจเดียวกัน 2. การเชื่อมโยงภายในเว็บไซต์เดียวกัน 3. การเชื่อมโยงไปยังเว็บไซต์อื่น 4. การเชื่อมโยงไปยังอีเมลล์ 5. การเชื่อมโยงไฟล์ดาวน์โหลด 6. การเชื่อมโยงโดย Map Link

1. การเชื่อมโยงภายในเว็บเพจเดียวกัน
การกำหนดเป้าหมายการเชื่อมโยง ในกรณีที่เว็บเพจมีเนื้อหายาวมาก ๆ แสดงผลไม่พอกับจอภาพ ผู้อ่านจะต้องเลื่อนหน้าจอเพื่อดูข้อมูลด้านล่าง ทำให้ไม่สะดวกและใช้เวลาในการเลื่อนดูเนื้อหา ผู้ออกแบบเว็บเพจควรกำหนดการเชื่อมโยงโดยสร้างเป็นหัวเรื่องแยกไว้ต่างหาก เมื่อผู้อ่านต้องการทราบข้อมูลเรื่องนั้น สามารถคลิกที่หัวเรื่องและเชื่อมโยงไปยังเนื้อเรื่องนั้นทันที ลักษณะเหมือนการทำสารบัญไว้ในหน้าเดียวกัน
หลักการการเชื่อมโยงในหน้าเว็บเพจเดียวกัน ต้องกำหนดจุดเป้าหมาย (Anchor Point) ว่าจะให้เชื่อมโยงไปที่ตำแหน่งใดของหน้า ซึ่งมีขั้นตอนดังนี้

1.1 คลิกที่รูปภาพ ตาราง หรือข้อความที่ต้องการจะเป็นจุดเป้าหมาย
1.2 เลือกคำสั่ง Insert > Name Anchor หรือใช้แป้น < Ctrl > + < Alt > + < A > หรือใช้เครื่องมือบนกลุ่มเครื่องมือ Common รูปสมอเรือ จะได้หน้าต่าง Name Anchor

1.3 ตั้งชื่อจุดเป้าหมาย (ไม่ควรเว้นวรรค ควรตั้งชื่อสั้นเพื่อให้จำได้ง่าย)
1.4 คลิก OK จะปรากฏรูปสมอเรือกำกับอยู่ที่จุดเป้าหมาย

1.5 พิมพ์ข้อความ รูปภาพหรือตำแหน่งที่จะทำการเชื่อมโยง
1.6 ระบายแถบสีข้อความนั้นที่ต้องการทำการทำการเชื่อมโยง
1.7 ไปที่ Properties ในช่อง Link พิมพ์เครื่องหมาย # ตามด้วยชื่อ Anchor ที่ได้สร้างไว้แล้ว

1.8 กดแป้น Enter จะได้ข้อความที่เป็นจุดเชื่อมโยง สังเกตข้อความจะขีดเส้นใต้และเปลี่ยนเป็นจุดลิงก์สีน้ำเงิน
1.9 บันทึกเว็บเพจ ทดสอบโดยกดแป้น F12 เพื่อดูตัวอย่างด้วยเว็บเบราว์เซอร์
1.10 เมื่อเลื่อนเมาส์ไปตรงจุดลิงค์ เมาส์จะเป็นรูปมือ คลิกเมาส์จะเลื่อนไปยังจุดเป้าหมาย

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

2.1 เลือกข้อความ รูปภาพ ตารางหรือวัตถุที่ใช้เป็นจุดเชื่อมโยง
2.2 ไปที่ Properties ในช่อง Link ถ้าจำชื่อไฟล์ได้ให้พิมพ์ชื่อไฟล์ลงไปในช่อง Link ได้เลย แนะนำสำหรับการเลือกไฟล์ควรใช้ปุ่มสัญลักษณ์รูปแฟ้มสีเหลือง (Browse) เลือกไฟล์ที่ต้องการเพื่อป้องกันการเชื่อมโยงผิดพลาด
2.3 จะได้หน้าต่าง Select File ให้เลือกไฟล์ที่ต้องการแล้วคลิก OK
2.4 ชื่อไฟล์ที่ลิงค์ก็จะปรากฏอยู่ในช่องลิงค์

2.5 บันทึกไฟล์ และแสดงผลบนเว็บเบราเซอร์ด้วยแป้น F12
2.6 ลองคลิกที่ตำแหน่งที่กำหนดการเชื่อมโยง บราวเซอร์จะแสดงผลหน้าเว็บที่ถูกลิงค์ไปทันที ทั้งนี้สามารถระบุ Target =_blank เพื่อเปิดหน้าต่างใหม่ในการแสดงผล

3. การเชื่อมโยงไปยังเว็บไซต์อื่น
การเชื่อมโยงไปยังเว็บไซต์อื่น เป็นการเชื่อมโยงไปยังเว็บไซต์ที่อยู่ภายนอก ซึ่งต้องเชื่อมต่ออินเทอร์เน็ต จึงจะสามารถเปิดเว็บไซต์นั้นได้ มีขั้นตอนดังนี้

3.1 ระบายแถบสีคลุมข้อความที่ใช้เป็นจุดลิงค์
3.2 สังเกตที่แถบ Properties จะเห็นช่องรายการ Link
3.3 พิมพ์ชื่อเว็บไซต์ที่ต้องการเชื่อมโยง โดยต้องขึ้นต้นด้วย http:// และตามด้วยชื่อตามด้วย เช่น http://www.weeonline.in.th ทั้งนี้สามารถระบุ Target =_blank เพื่อเปิดหน้าต่างใหม่ในการแสดงผล
3.4 คลิกในพื้นที่ทำงาน เพื่อยืนยันการกำหนดลิงค์ หรือ Enter

3.5 บันทึกเว็บเพจ และแสดงผลบนเว็บเบราเซอร์ด้วยแป้น F12
3.6 ลองคลิกที่ตำแหน่งที่กำหนดการเชื่อมโยง บราวเซอร์จะแสดงผลหน้าเว็บที่ถูกลิงค์ไปทันที

4. การเชื่อมโยงไปยังอีเมลล์
การเชื่อมโยงไปยังอีเมลล์ คือ การสร้างอีเมลล์แอดเดรสไว้สำหรับให้ผู้ต้องการจะติดต่อได้พิมพ์จดหมายส่งมาได้ทันที โดยไม่ต้องเสียเวลาพิมพ์อีเมลล์แอดเดรสอีก โดยปกติจะอยู่ในเว็บเพจหน้า”ติดต่อเรา” หรือ “Contact Us” เป็นต้น ขั้นตอนมีดังนี้

4.1 เลือกข้อความหรือภาพที่จะสร้างไฮเปอร์ลิงค์เพื่อส่งอีเมลล์
4.2 พิมพ์ mailto: อีเมลล์แอดเดรส  เช่น mailto:Webmaster
4.3.คลิกเมนู Insert > หรือคลิกปุ่ม “รูปซองจดหมาย”
4.4 จะปรากฎหน้าต่าง Email Link ดังนี้
4.4.1 ช่อง Text จะเป็นข้อความที่ปรากฎในเว็บเพจเพื่อให้ผู้ใช้คลิก
4.4.2 ช่อง email ให้ใส่อีเมล์ที่ต้องการติดต่อ เช่น wee2k@hotmail.com
4.5 คลิกปุ่ม OK

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

5. การเชื่อมโยงไฟล์ดาวน์โหลด
การทำลิงค์เชื่อมไฟล์ดาวน์โหลด สามารถทำได้หลายฟอร์แมต ทั้งไฟล์สกุล HTML และอื่นๆ โดยไฟล์อื่นๆ จะทำงานในลักษณะ Download ไฟล์ ขั้นตอนมีดังนี้

1.1 ระบายแถบสีคลุมข้อความที่ใช้เป็นจุดลิงค์
1.2 สังเกตที่แถบ Properties จะเห็นช่องรายการ Link
1.3 พิมพ์ชื่อไฟล์และตำแหน่งไฟล์ที่ต้องการให้ลิงค์ ซึ่งชื่อไฟล์อาจจะเป็นไฟล์ .html หรือ ไฟล์ใดๆ ก็ได้ โดยจะต้องระบุ "นามสกุล" ของไฟล์ด้วยเสมอ แนะนำสำหรับการเลือกไฟล์ควรใช้ปุ่มสัญลักษณ์รูปแฟ้มสีเหลือง (Browse) เลือกไฟล์เพื่อป้องกันความผิดพลาด
1.4 เมื่อกำหนดชื่อไฟล์ที่ต้องการลิงค์จากรายการ Link เรียบร้อยแล้ว ให้นำเมาส์มาคลิกในพื้นที่ทำงาน เพื่อยืนยันการกำหนดลิงค์ หรือคลิกบันทึกเว็บเพจ

หมายเหตุ ระวังเรื่องพิมพ์ชื่อไฟล์ตัวพิมพ์ใหญ่ ตัวพิมพ์เล็ก ถือว่าเป็นคนละไฟล์

6. การเชื่อมโยงโดย Map Link
Map Link เป็นการสร้างจุด (Hot Spot) บนรูปภาพ โดยการแบ่งรูปภาพออกเป็นบริเวณย่อยเฉพาะบางส่วนของรูปภาพเพื่อกำหนดให้เป็นลิงค์ไปยังปลายทางที่แตกต่างกัน เนื่องจากในภาพสามารถมีได้หลายลิงค์ด้วยกัน เช่น คลิกที่ลิงค์บริเวณด้านบนหรือด้านล่างของภาพก็จะไปยังปลายทางหนึ่ง เป็นต้น

การเชื่อมโยงแบบ Map Link มีวิธีดังนี้

6.1 คลิกเลือกรูปที่ต้องการสร้างลิงค์
6.2 เลือกเครื่องมือใน Properties Inspector ดังรูป
ซึ่งประกอบด้วยเครื่องมือ 3 แบบ คือ

6.2.1  แบบสีเหลี่ยมใช้สร้างรูปสี่เหลี่ยม วิธีใช้คือให้คลิกที่รูปค้างไว้แล้วลากให้เป็นขนาดที่ต้องการ สามารถใช้ pointer แก้ไขขนาดของ hot spot ได้โดยคลิกที่มุมของ Hot spot ที่วาดไว้
6.2.2  แบบวงกลมใช้สร้างรูปวงกลม วิธีใช้คือให้คลิกที่รูปค้างไว้แล้วลากให้เป็นขนาดที่ต้องการ สามารถใช้ pointer แก้ไขขนาดของ hot spot ได้โดยคลิกที่จุด 4 จุดรอบ Hot spot ที่สร้างไว้
6.2.3  แบบโพลีกอน ใช้สร้าง Hot spot แบบไม่มีรูปทรงแน่นอน วิธีใช้ให้คลิกไปตามจุดของรูปที่เราต้องการ การแก้ไขตำแหน่งของจุดก็ให้ใช้ pointer คลิกจุดที่ต้องการแก้ไข 
6.3 วาดบริเวณที่ต้องการให้เป็นลิงค์ เมื่อวาด hot spot เสร็จแล้ว Property inspector จะเปลี่ยนไปดังรูปด้านล่าง

6.4 พิมพ์ชื่อเว็บเพจปลายทางลงในช่องลิงค์ (Link) หรือเลือกไฟล์ที่จะลิงค์ไป การเขียน Alt text ให้กับ image map นั้นเป็นเรื่องจำเป็นเพราะผู้ชมจะทราบได้ว่าตรงนี้เป็น Hot spot สามารถลิงค์ไปได้ และรู้ข้อมูลคร่าวๆว่า Hot spot นี้จะลิงค์ไปที่ใด
6.5 สามารถสร้าง Hot spot กี่อันในรูปก็ได้โดยทำตามขั้นตอนข้างต้น
6.6 สามารถกลับมาแก้ไข Hot spot กี่ครั้งก็ได้โดยการ คลิกที่ pointer จากนั้นคลิกที่ hot spot ที่ต้องการแก้ไข

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

1. _blank เป็นการเปิดเว็บเพจปลายทางในวินโดว์ใหม่
2._parent เป็นการแสดงเว็บเพจในเฟรมที่ครอบอยู่ในเฟรมปัจจุบัน (ในกรณีที่มีการใช้เฟรม)
3._self เป็นการแสดงเว็บเพจในเฟรมเดิมของลิงค์
4._top เป็นการแสดงเว็บเพจในวินโดว์เดิม โดยยกเลิกเฟรมที่ครอบอยู่ทั้งหมด

              การกำหนดคุณสมบัติการเชื่อมโยง
การเชื่อมโยงที่กำหนดไว้ใน Properties เป็นคุณสมบัติที่ตั้งค่าไว้ใน Page Properties ซึ่งสามารถกำหนดคุณสมบัติการเชื่อมโยง ดังนี้

1. คลิกขวาที่หน้าเว็บเพจ แล้วเลือกคำสั่ง Page Properties จากเมนูลัด หรือเลือกคำสั่ง Modify > Page Properties จะได้หน้าต่าง Page Properties
2. คลิกที่คำสั่ง Links ที่ Category เลือกคุณสมบัติต่าง ๆ ด้านขวามือ

2.1 Link Font รูปแบบตัวอักษรที่จะทำเป็นลิงค์ ตัวหนา ตัวเอน
2.2 Size ขนาดรูปแบบตัวอักษร
2.3 Link Color เลือกสี
2.4 Visited Links เลือกสีลิงค์ที่ถูกชมไปแล้ว
2.5 Rollover Links เลือกสีลิงค์เมื่อลากเมาส์ผ่าน
2.6 Active Links เลือกสีลิงค์ที่คลิก
2.7 Underline Style ลักษณะการขีดเส้นใต้ข้อความที่เป็นลิงค์

              การยกเลิกการเชื่อมโยง
สามารถยกเลิกการเชื่อมได้ ตามขั้นตอนดังนี้

1. คลิกเมาส์ ณ จุดลิงค์เดิม
2. ในช่อง Link ลบรายชื่อไฟล์ออกจากรายการ Link
3. คลิก Enter และบันทึกเว็บเพจ