ขอบเขตการบรรยาย•วิ�วิ�ฒนาการของ Hypertext•ควิามหมายของค�าวิ�า Hypertext และ

Hypermedia•แบบจำ�าลองและองค�ประกอบของระบบ

Hypertext•ประโยชน�ของระบบ Hypertext•ป�ญหา และ แนวิทางแก!ไขระบบ

Hypertext

วิ�วิ�ฒนาการของไฮเปอร�เท$กซ์�

ไฮเปอร�เท$กซ์�ได้!ถื(อก�าเน�ด้เก�ด้ข)*นมาก�อนท+, Blaise pascal น�กวิ�ทยาศาสตร�ชาวิฝร�,งเศส จำะค�ด้เคร(,องบวิกลบเลข

ป0 ค.ศ .1965 ภายหล�งการค�ด้ค!นคอมพิ�วิเตอร� ได้!ม+การน�าเคร(,องม(อMEMEX (Memory Extender) มาประย3กต�ใช!ก�บคอมพิ�วิเตอร� โด้ยน�าข!อควิามมาเช(,อมโยงระหวิ�างก�น เร+ยกวิ�า ไฮเปอร�เท$กซ์�” ”

ป0 ค.ศ .1985 บ . ซ์+รอกซ์� ได้!ค�ด้ค!นวิ�ธี+การเช(,อมโยงไฮเปอร�เท$กซ์�แบบใหม�โด้ยสามารถืน�าภาพิมาประกอบการเช(,อมโยงได้!ด้!วิย

ควิามหมายของค�าวิ�าHypertext และ Hypermedia

“ไฮเปอร์�เท็กซ์�” หมายถื)ง การผสมผสานระหวิ�างข!อควิามหร(อภาษาธีรรมชาต�ก�บกระบวินการทางคอมพิ�วิเตอร� อาจำกล�าวิอ+กน�ยหน),งวิ�า “ไฮเปอร�เท$กซ์�” หมายถื)ง ข!อควิามหร(อกล3�มของข!อควิามท+,ถื8กเช(,อมโยงเข!าด้!วิยก�นโด้ยม+การน�าเสนอแบบปฏิ�ส�มพิ�นธี� โด้ยการน�าข!อควิามท+,ใช!มาเป:นจำ3ด้เช(,อมโยง ซ์),งจำะม+ล�กษณะเด้�นกวิ�าข!อควิามอ(,น เช�น การข+ด้เส!นใต! การเน!นด้!วิยส+ ต�วิหนาหร(อต�วิเอ+ยง เป:นต!น

ความหมายของ“ ไฮเปอร์�ม�เดี�ย ”

ในระบบม�ลต�ม+เด้+ย ได้!น�าหล�กการของไฮเปอร�เท$กซ์� มาเป:นส�วินหน),งของการน�าเสนอ จำากเด้�มท+,เช(,อมโยงเฉพิาะต�วิอ�กษรหร(อข!อควิาม มาเป:นการเช(,อมโยงโด้ยการใช! ภาพิน�,ง เส+ยง และวิ�ด้+โอ โด้ยเร+ยกก�นวิ�า “ ไฮเปอร�ม+เด้+ย ”(Hypermedia) โด้ยแสด้งควิามส�มพิ�นธี�ของแบบจำ�าลองได้!ด้�งร8ป

ม�ลต�ม+เด้+ย(Multimedia)

ไฮเปอร�ม+เด้+ย(Hypermedia)

ไฮเปอร�เท$กซ์�(Hypertext)

แบบจำ�าลองและองค�ปร์ะกอบของร์ะบบไฮเปอร์�เท็กซ์�

แบบจำ�าลองร์ะบบไฮเปอร์�เท็กซ์�แบบจำ�าลองของระบบไฮเปอร�เท$กซ์�อธี�บายถื)งล�กษณะและขอบเขตของงานท+,ได้!ออกแบบไวิ! ส�วินใหญ�แบบจำ�าลองจำะอธี�บายถื)งส�มพิ�นธี�ระหวิ�างล�งค�(Links ) ก�บ โหนด้ (Node) ซ์),งแสด้งได้!ด้�งร8ป

NodeNode NodeNode

NodeNode

Link

Link

Link

• พอยต์� (Point) หมายถื)ง กล3�มค�า หร(อ วิล+ ท+,เป:นข!อควิามพิ�เศษท+,แสด้งวิ�าม+การเช(,อมโยงเก�ด้ข)*น เช�น การข+ด้เส!นใต! การเน!นด้!วิยส+หร(อต�วิหนา เพิ(,อท�าให!ร8 !วิ�าเป:น พิอยต� เม(,อผ8!อ�านเล(,อนเคอร�เซ์อร�มาถื)งพิอยต� เคอร�เซ์อร�จำะเปล+,ยนเป:นส�ญล�กษณ�อ(,น เช�น ร8ปม(อ

องค�ปร์ะกอบของร์ะบบไฮเปอร์� เท็กซ์� ประกอบด้!วิย

qqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqq

พอยต์� (Point)

• โหนดี (Node) หมายถื)ง กล3�มค�าของข!อม8ลท+,ส�มพิ�นธี�ก�นหร(อเป:นเร(,องเด้+ยวิก�นซ์),งถื8กจำ�ด้ไวิ!เป:นกล3�มเด้+ยวิ ซ์),งภายในโหนด้น�*นอาจำม+พิอยต�อย8�มากกวิ�าหน),งพิอยต�ก$ได้! ควิามยาวิของโหนด้น�*นไม�สามารถืระบ3ตายต�วิได้! โหนด้หน),งโหนด้ อาจำเปร+ยบเท+ยบได้!ก�บเน(*อหาข!อม8ลท+,เข+ยนข)*นมาอย8�บนกระด้าษแผ�นเด้+ยวิก�น

qqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqq

โหนดี (Node)

• ล!งค� (Link) หมายถื)ง การเช(,อมโยงเอกสารจำากต!นทางไปปลายทาง จำ�าแนกล�งค�ออกได้!เป:น 3 ชน�ด้ ประกอบด้!วิย

1 .ล�งค�ชน�ด้อ!างถื)ง (Referential Link)ใช!ส�าหร�บเช(,อมโยงโด้ยอ!างถื)งโด้ยตรงระหวิ�างจำ3ด้สองจำ3ด้ ต�วิอย�าง

เช�น ป3=มท+,ม+ข!อควิามล�งค�ไปข!างหน!า(Forward)หร(อย!อนกล�บ(Backward)2. ล�งค�ชน�ด้แผนภ8ม� (Organization Link)ม+ควิามคล!ายคล)งก�บล�งค�ชน�ด้อ!างถื)งจำะแตกต�างก�นท+,เป:นการ

เช(,อมโยงระหวิ�างโหนด้ด้!วิยก�นในล�กษณะท+,เป:นโครงสร!างไฮราค+,3. ล�งค�ชน�ด้ค+ย�เวิ�ร�ด้ (Keyword Link)เป:นการน�ากล3�มค�าหร(อวิล+ต�างๆ ท+,ม+ควิามหมายและส�มพิ�นธี�ระหวิ�างก�นมาเช(,อมโยงด้!วิยวิ�ธี+การเด้+ยวิก�บการล�งค�ชน�ด้อ!างถื)งหร(อแผนภ8ม�

• โคร์งสร์#างของ Hypertext แบ$งเป%น 2 ชน!ดี ค'อ (1) ชน�ด้ท+,ม+โครงสร!างแน�นอน (Structured Hypertext)

แบ�งย�อยเป:น 2 ชน�ด้ ได้!แก�1 . โครงสร!างชน�ด้เร+ยงล�าด้�บ ( Sequential Structured

Hypertext ) จำะม+การจำ�ด้เร+ยงเน(*อหาไวิ!อย�างเป:นระเบ+ยบ ด้�งน�*นการจำะเข!าถื)งข!อม8ล ต!องผ�านโหนด้ท+,อย8�ก�อน

ตามล�าด้�บ2. โครงสร!างชน�ด้จำด้หมาย (Structured Hypertext

for Mail ) ผ8!ออกแบบต!องวิ�เคราะห�เน(*อหาอย�างละเอ+ยด้ และจำ�ด้ควิามส�มพิ�นธี�ของเน(*อหาท�*งหมด้ และม+การก�าหนด้โหนด้หล�กและโหนด้ท+,เป:นส�วินขยายด้!วิย

(2) ชน�ด้ท+,ไม�ม+โครงสร!างท+,แน�นอน (Unstructured Hypertext)

เป:นการเช(,อมโยงโหนด้ในล�กษณะของการส3�มจำากโหนด้หน),งไปย�งโหนด้อ(,นๆ ภายในโหนด้จำะม+การจำ�ด้เร+ยงไวิ!อย�างเป:นระเบ+ยบ

• โคร์งสร์#างไฮร์าค�( (Hierarchies Structure) โครงสร!างไฮราค+, เป:นการผสมผสานของโครงสร!างระบบไฮ

เปอร�เท$กซ์� 2 ชน�ด้ด้!วิยก�น ได้!แก� ชน�ด้ท+,ไม�ม+โครงสร!างท+,แน�นอนก�บชน�ด้ท+,ม+โครงสร!างแน�นอน โด้ยใช!หล�กการ

เด้+ยวิก�นก�บระบบการจำ�ด้การฐานข!อม8ล(DBMS:)โด้ยการรวิบรวิมเน(*อหาท�*งหมด้แล!วิแตกออกเป:นเน(*อหาย�อยเป:น แบบ

โครงสร!างต!นไม! (Tree Diagram)แบ�งย�อยเป:น 3 ประเภทได้!แก�

• ชน�ด้จำ�าก�ด้ควิามส�มพิ�นธี�(Strict Hierarchy)• ชน�ด้ไม�จำ�าก�ด้ควิามส�มพิ�นธี� (Compromised

Hierarchy)• ชน�ด้ซ์!อน (Overlapping Hierarchy )

ล)กษณะของไฮเปอร์�เท็กซ์�แบบเน',อหาส)มพ)นธ์�ชน!ดีจำ�าก)ดีความส)มพ)นธ์�

ล)กษณะของไฮเปอร์�เท็กซ์�แบบเน',อหาส)มพ)นธ์�ชน!ดีไม$จำ�าก)ดีความส)มพ)นธ์�

ล)กษณะของไฮเปอร์�เท็กซ์�แบบเน',อหาส)มพ)นธ์�ชน!ดีซ์#อน

ล)กษณะของไฮเปอร์�เท็กซ์�แบบม�โคร์งสร์#างชน!ดีเร์�ยงล�าดี)บเป%นเส#นต์ร์ง

ล)กษณะของไฮเปอร์�เท็กซ์�แบบม�โคร์งสร์#างชน!ดีจำดีหมาย

ล)กษณะของไฮเปอร์�เท็กซ์�แบบไม$ม�โคร์งสร์#าง

ปร์ะโยชน�ของร์ะบบไฮเปอร์�เท็กซ์�

ประโยชน�ของระบบไฮเปอร�เท$กซ์� นอกจำากจำะ สามารถืบร�หารจำ�ด้การ เช(,อมโยง และต�ด้ต�อข!อม8ลเพิ(,อ

ส(,อควิามหมายอย�างม+ปฏิ�ส�มพิ�นธี�ในสภาพิแวิด้ล!อมท+, เหมาะสม และย�งสามารถืท�าให!ผ8!ใช!เล(อกใช!เส!นทางท+,

สะด้วิกและรวิด้เร$วิ ไม�วิ�าจำะไปข!างหน!าหร(อย!อนกล�บใน เส!นทางเด้�มได้! และย�งสามารถืเข!าถื)งข!อม8ลได้!อย�าง

สะด้วิกและรวิด้เร$วิท�*งน+*เน(,องจำากการท�างานของระบบไฮ เปอร�เท$กซ์�จำะม+การเช(,อมโยงท+,ไม�เป:นในแนวิเส!นตรง

เป:นต!น

ป�ญหาและแนวิทางแก!ไขระบบไฮเปอร�เท$กซ์�

ป�ญหาท+,เก+,ยวิก�บระบบไฮเปอร�เท$กซ์� ส�วินใหญ�ท+,พิบม�กจำะเก+,ยวิข!องก�บผ8!ใช!งานท+,ม�กจำะหลงทางเข!าไปต�ด้อย8�ในวิ�งวิน และการแสด้งผลของข!อม8ลท+,พิบเจำอน�*นม+มากจำนเก�นไป โด้ยเฉพิาะก�บระบบท+,ได้!ออกแบบไวิ!ย�งไม�ด้+พิอด้�งน�*นแนวิทางแก!ไข ค(อการค!นหาวิ�ธี+การด้�ด้แปลงให!เหมาะสมก�บการน�าเสนอข!อม8ล (Presentation )การน�าทาง(Navigation ) เพิ(,อช�วิยให!ผ8!ใช!สามารถืควิบค3มการท�างานได้!อย�างอ�สระและม+ประส�ทธี�ผลมากย�,งข)*น โด้ยเร+ยกวิ�ธี+การน+*วิ�า (Adaptive Hypertext/ Hypermedia Systems)

ภาพแสดีงร์/ปแบบ Conditional Text

ภาพแสดีงร์/ปแบบ Stretch text หร์'อ Menu Popup

ภาพแสดีงแสดีงร์/ปแบบ Page Variants

ภาพแสดีงร์/ปแบบ Fragment Variants

ภาพแสดีงร์/ปแบบ Frame - Based

การด้�ด้แปลงให!เหมาะสมก�บการน�าทาง

• Annotations เป:นวิ�ธี+การเช(,อมโยงโด้ยใช!ค�าอธี�บายประกอบ ข!อควิาม ไอคอน

• Ordering or Link Sorting เป:นวิ�ธี+การเช(,อมโยงโด้ยการเร+ยงล�าด้�บต�วิเช(,อมโยงได้!ใหม�

• Direct Guidance เป:นวิ�ธี+การเช(,อมโยงโด้ยใช!เคร(,องช�วิยน�าทาง

• Hiding เป:นวิ�ธี+การเช(,อมโยงโด้ยการซ์�อนเร!นข!อม8ล• Mapping เป:นวิ�ธี+การเช(,อมโยงโด้ยตามรอยแผนท+,