“การเชื่อมโยงบนเว็บเพจ”
การเชื่อมโยง (Hyperlink) เป็นการสร้างจุดเชื่อมโยงจากหน้าเว็บเพจที่ผู้ชมเว็บไซต์กำลังชมอยู่ในปัจจุบัน ไปยังเว็บเพจอื่นที่เกี่ยวข้อง ด้วยการคลิกที่จุดเชื่อมโยงซึ่งอาจเป็นข้อความ (Hypertext Link) หรือรูปภาพ (Image Link
ลักษณะของจุดเชื่อมโยงที่เป็นข้อความ (Hypertext Link) 3 รูปแบบ ดังนี้
รูปแบบที่ 1 ข้อความที่เชื่อมโยงแบบ Navigation Bar เป็นการจัดกลุ่มของเว็บเพจที่สัมพันธ์กัน หรือเป็นเพจย่อยของหน้าเว็บนั้นๆ เช่น ในหน้า Home Page แสดง Navigation Bar ประกอบด้วยรายชื่อกลุ่มเพจย่อย คือ Service, Member และ About Us เป็นต้น
รูปแบบที่ 2 ข้อความเชื่อมโยงที่แทรกอยู่ภายในข้อมูล (รวมถึงจุดเชื่อมโยงที่เป็นรูปภาพด้วย) ข้อความเชื่อมโยงลักษณะนี้จะปะปนอยู่กับข้อมูลบนหน้าเว็บ แต่ให้สังเกตว่า ที่ข้อความจะถูกขีดเส้นใต้ไว้ เมื่อผู้ชมเว็บไซต์คลิกที่ข้อความ ก็จะเชื่อมโยงไปยังเว็บเพจอื่น ซึ่งรายละเอียดที่เกี่ยวข้องกับข้อความดังกล่าว
รูปแบบที่ 3 ข้อความเชื่อมโยงเพื่อบอกให้ผู้ชมคลิกดูรายละเอียดเพิ่มเติม โดยจะแสดงข้อมูลของสินค้าเพียงคร่าวๆ แต่จะแสดงข้อความ เช่น “คลิกเพื่อดูรายละเอียด” หรือ “ยังมีต่อ....” ไว้ตอนท้ายของข้อมูลดังกล่าว
เพื่อให้ผู้ชมเป็นผู้ตัดสินใจเองว่าต้องการเข้าไปชมข้อมูลหรือไม่
1.1 การเลือกใช้คำอธิบายข้อความเชื่อมโยง
คำอธิบายข้อความเชื่อมโยง เป็นคำหรือข้อความที่บอกให้ผู้ชมทราบว่า หากต้องการรายละเอียดข้อมูลเพิ่มเติมให้คลิกที่ข้อความนี้เพื่อเชื่อมโยงไปยังเว็บเพจที่เกี่ยวข้องได้ ซึ่งการออกแบบข้อความเชื่อมโยงในอดีตมักใช้คำว่า “คลิกที่นี่” หรือ “Click here” แต่การออกแบบที่ดีควรหลีกเลี่ยงการใช้ข้อความลักษณะนี้ เพราะเป็นการระบุวิธีเข้าถึงข้อมูลเฉพาะการแสดงผลบนจอภาพคอมพิวเตอร์ที่ใช้เมาส์เพื่อคลิกชมข้อมูลเท่านั้น ซึ่งในความเป็นจริง เว็บเพจสามารถแสดงผลบนอุปกรณ์อื่นได้หลายชนิด และวิธีการเข้าถึงข้อมูลก็แตกต่างกันไปด้วย
คำอธิบายข้อความเชื่อมโยง เป็นคำหรือข้อความที่บอกให้ผู้ชมทราบว่า หากต้องการรายละเอียดข้อมูลเพิ่มเติมให้คลิกที่ข้อความนี้เพื่อเชื่อมโยงไปยังเว็บเพจที่เกี่ยวข้องได้ ซึ่งการออกแบบข้อความเชื่อมโยงในอดีตมักใช้คำว่า “คลิกที่นี่” หรือ “Click here” แต่การออกแบบที่ดีควรหลีกเลี่ยงการใช้ข้อความลักษณะนี้ เพราะเป็นการระบุวิธีเข้าถึงข้อมูลเฉพาะการแสดงผลบนจอภาพคอมพิวเตอร์ที่ใช้เมาส์เพื่อคลิกชมข้อมูลเท่านั้น ซึ่งในความเป็นจริง เว็บเพจสามารถแสดงผลบนอุปกรณ์อื่นได้หลายชนิด และวิธีการเข้าถึงข้อมูลก็แตกต่างกันไปด้วย
1. การเลือกใช้คำอธิบาย คำที่ใช้ต้องกระชับ ชัดเจน และได้ใจความ เมื่อผู้ชมเว็บไซต์อ่านแล้วต้องทราบทันทีว่าข้อความนี้จะเชื่อมโยงไปยังเว็บเพจที่เกี่ยวข้องกับเรื่องใด
2. ตำแหน่งของจุดเชื่อมโยง ต้องสังเกตเห็นได้ชัดเจน ในกรณีที่ข้อความเชื่อมโยงปะปนกับข้อมูลต้องออกแบบให้ลักษณะของตัวอักษรข้อความเชื่อมโยงแตกต่างจากข้อมูลทั่วไป
3. แสดงทางเลือกให้กับผู้ชม กรณีที่มีรายการข้อมูลเชื่อมโยงแยกย่อยออกไปจำนวนมาก นักพัฒนาเว็บควรแสดงรายการเชื่อมโยงที่เกี่ยวข้องกับข้อมูลในเรื่องนั้นทั้งหมด เพื่อให้ผู้ชมเป็นผู้ตัดสินใจเองว่า ต้องการรับชมข้อมูลหรือสนใจข้อมูลใดบ้าง
ตัวอย่างการจัดกลุ่มข้อความเชื่อมโยงที่สัมพันธ์กันในเว็บ www.searin.org ผู้ชมสามารถเลือกตัดสินใจได้ว่าจะรับชมข้อมูลใดบ้าง
1.2 การสร้าง Link Title
กล่องคำอธิบายข้อความเชื่อมโยง (Link Title) คือ กล่องข้อความที่แสดงรายละเอียดสั้นๆ เกี่ยวกับเว็บเพจหรือเว็บไซต์ที่ข้อความนี้เชื่อมโยงไปถึงกล่องคำอธิบายข้อความเชื่อมโยงจะปรากฏขึ้นเมื่อผู้ชมเว็บไซต์เลื่อนเมาส์ไปวางที่ข้อความเชื่อมโยงนั้นๆ ข้อดีของกล่องคำอธิบายเชื่อมโยง คือ ช่วยลดเวลาในการตัดสินใจของผู้ชมว่า จุดเชื่อมโยงนี้จะเชื่อมโยงไปยังเว็บเพจที่มีข้อมูลที่ตนต้องการหรือไม่
กล่องคำอธิบายข้อความเชื่อมโยง (Link Title) คือ กล่องข้อความที่แสดงรายละเอียดสั้นๆ เกี่ยวกับเว็บเพจหรือเว็บไซต์ที่ข้อความนี้เชื่อมโยงไปถึงกล่องคำอธิบายข้อความเชื่อมโยงจะปรากฏขึ้นเมื่อผู้ชมเว็บไซต์เลื่อนเมาส์ไปวางที่ข้อความเชื่อมโยงนั้นๆ ข้อดีของกล่องคำอธิบายเชื่อมโยง คือ ช่วยลดเวลาในการตัดสินใจของผู้ชมว่า จุดเชื่อมโยงนี้จะเชื่อมโยงไปยังเว็บเพจที่มีข้อมูลที่ตนต้องการหรือไม่
หมายเหตุ การสร้างกล่องคำอธิบายข้อความเชื่อมโยง กระทำได้โดยเพิ่มแอททริบิวต์ “title” ไว้ที่แท็ก <a> ใน HTML เช่น <a herf = www.w3.org/TR/xhtml2/ title=www.w3.org/TR/xhtml2| รายละเอียดของ XHTML 2.0>XHTML เวอร์ชัน 2.0 </a>
อย่างไรก็ตาม ต้องคำนึงถึงเว็บบราวเซอร์ที่รองรับแอททริบิวต์ “title” ของแท็ก <a> ใน HTML ด้วย โดยสามารถแสดงผลในเว็บบราวเซอร์เวอร์ชัน 4.0 ขึ้นไป
หลักการออกแบบกล่องคำอธิบายข้อความที่เชื่อมโยง มีดังนี้
1. ระบุชื่อเว็บเพจหรือเว็บไซต์ที่เชื่อมโยงถึง หากข้อความเชื่อมโยงไปยังข้อมูลที่อยู่ในเว็บไซต์อื่น นักพัฒนาเว็บควรใส่ชื่อเว็บไซต์นั้นลงในกล่องคำอธิบายด้วย ในทำนองเดียวกันถ้าเป็นการเชื่อมโยงภายในไซต์ (Site) ของตนเอง ก็ควรใส่ชื่อเว็บเพจย่อยหรือส่วนของข้อมูลที่อ้างอิง
2. ระบุรายละเอียดของข้อมูล โดยเป็นตัวอย่างข้อมูลที่จะพบในเว็บเพจที่เชื่อมโยงถึง ซึ่งรายละเอียดของข้อมูลควรจะสัมพันธ์กับคำหรือข้อความที่เลือกใช้เป็นจุดเชื่อมโยงด้วย
3. การแจ้งเตือนปัญหาที่ผู้ชมพบในเว็บเพจ บางเว็บเพจผู้ชมอาจต้องสมัครเป็นสมาชิกก่อน จึงจะเข้าไปใช้งานระบบได้ ซึ่งบ่อยครั้งที่ผู้ชมจะต้องเสียเวลากับเว็บเพจเช่นนี้ ดังนั้นนักพัฒนาเว็บควรแจ้งเตือนปัญหาหรือเงื่อนไขนี้ผ่านทางกล่องคำอธิบายด้วย
4. การเลือกใช้คำอธิบายในกล่องข้อมูล ไม่ควรมีความยาวมากเกินไป และไม่จำเป็นต้องใส่กล่องคำอธิบายทุกข้อความเชื่อมโยง เช่น ในข้อความเชื่อมโยงที่เคยกล่าวถึงแล้ว หรือสามารถสื่อความหมายได้ชัดเจนแล้วว่าจะเชื่อมโยงไปยังเว็บเพจที่เกี่ยวข้องกับเรื่องใด
1.3 การใช้สีสำหรับข้อความเชื่อมโยง
เมื่อรายการเชื่องโยงบนหน้าเว็บมีจำนวนมากขึ้น อาจทำให้ผู้ชมเกิดความสับสนว่า เคยคลิกเข้าไปชมข้อมูลจากข้อความเชื่อมโยงใดแล้วบ้าง ดังนั้นจำเป็นอย่างยิ่งที่จะต้องสร้างความแตกต่างให้กับข้อความเชื่อมโยงแต่ละสถานะ โดยแบ่งสถานะของข้อความเชื่อมโยงออกเป็น 2 สถานะหลัก ได้แก่ สถานะปกติ เมื่อยังไม่มีการคลิกชมข้อมูลแต่อย่างใด และสถานะที่ผู้ชมเว็บไซต์ได้คลิกเข้าไปชมข้อมูลแล้ว
หลักการเลือกใช้สีตัวอักษรเพื่อเปลี่ยนสถานะข้อความเชื่อมโยงดังนี้
1.กำหนดสีตัวอักษรในสถานะปกติ สีตัวอักษรสำหรับข้อความเชื่อมโยงในสถานะปกติ ควรใช้โทนสีเข้มเพื่อให้ผู้ชมเว็บไซต์สามารถมองเห็นได้ชัดเจน เช่น น้ำเงินเข้ม ม่วง หรือ ดำ เป็นต้น (ต้องพิจารณาร่วมกับสีพื้นหลังเว็บเพจด้วย)
2.กำหนดสีตัวอักษรในสถานะที่มีการคลิกเชื่อมโยงแล้ว นิยมใช้สีโทนเดียวกับตัวอักษรในสถานะปกติ แต่ระดับความเข้มของสีน้อยกว่า เช่น ในสถานะปกติตัวอักษรเป็นสีน้ำเงินเข้ม ตัวอักษรในสถานะที่ 2 อาจเป็นสีฟ้า อย่างไรก็ตาม อาจใช้โทนสีที่แตกต่างกันก็ได้ เช่น สีน้ำเงินกับสีแดง สีม่วงกับสีส้ม เป็นต้น
หมายเหตุ โทนสีมาตรฐาน ที่ใช้กำหนดสถานะข้อความเชื่อมโยง คือ สถานะปกติ ตัวอักษรเป็นสีน้ำเงิน (ขีดเส้นใต้) และสถานะเมื่อคลิกเชื่อมโยงแล้ว ตัวอักษรเป็นสีม่วงเข้ม
ข้อควรระวังในการออกแบบ ไม่ควรใช้สีข้อความเชื่อมโยงที่หลากหลาย เพราะจะทำให้ผู้ชมเกิดความสับสนและมีโอกาสคลิกชมข้อมูลซ้ำซ้อนสูง ทำให้เสียเวลาอย่างมาก
ตัวอย่างการใช้ข้อความเชื่อมโยงหลากหลายสีในเว็บ www.yenta4.com
(สังเกตจากระดับความเข้มของสีตัวอักษร) ที่ต่างกันอาจทำให้ผู้ชมเกิดความสับสนได้
1.4 Inbound Link
“Inbound Link” เป็นเทคนิคการเพิ่มจำนวนผู้เยี่ยมชมเว็บไซต์ของบริษัท โดยให้เว็บไซต์อื่น (เว็บไซต์ต้นทาง) สร้างการเชื่อมโยงมายังเว็บไซต์ของบริษัทเรา (เว็บไซต์ปลายทาง) ซึ่งนับว่าเป็นการประชาสัมพันธ์เว็บไซต์ของบริษัทโดยอัตโนมัติ “Inbound Link” แบ่งออกเป็น 2 กรณี ดังนี้
กรณีที่ 1 เป็นการประชาสัมพันธ์ให้โดยบริษัทไม่ต้องเสียค่าใช้จ่ายใดๆ ซึ่งอาจเกิดจากเว็บไซต์ของบริษัทมีข้อมูลหรือเนื้อหาที่เกี่ยวข้องกับเรื่องที่เว็บไซต์ต้นทางกล่าวถึงอยู่ เว็บไซต์เหล่านั้นจึงอำนวยความสะดวกให้กับผู้ชมเว็บไซต์ โดยแสดงรายชื่อเว็บไซต์อื่นที่เกี่ยวข้องเพื่อให้ผู้ชมเว็บไซต์เลือกชมเพิ่มเติม
กรณีที่ 2 เป็นการประชาสัมพันธ์โดยขอเช่าพื้นที่โฆษณาเว็บไซต์จากบริษัทที่ให้บริการเช่าพื้นที่โฆษณา
หลักการออกแบบ “Inbound Link” ที่สำคัญมีดังนี้
หลักในการออกแบบสำหรับเว็บไซต์ต้นทาง บางเว็บไซต์อาจไม่ต้องการให้ผู้ชมละทิ้งเว็บไซต์ของบริษัทตน ไม่รับชมข้อมูลของเว็บไซต์ปลายทางที่เชื่อมโยงถึง ก็จะใช้วิธีการแสดงเฉพาะชื่อ URL ของหน้าเว็บ ซึ่งมีข้อมูลที่น่าสนใจหรือเกี่ยวข้องกับเรื่องที่ต้องการไปวางไว้บนเว็บไซต์ แต่ไม่ต้องสร้างจุดเชื่อมโยงเอาไว้ โดยวิธีนี้ผู้ชมที่สนใจก็สามารถคัดลอก URL ไปเปิดในหน้าต่างเว็บบราวเซอร์ใหม่ได้ด้วย