1. World Wide Web และ Web Browsers ภาควิชาวิทยาการคอมพิวเตอร์ มหาวิทยาลัย บูรพา

2. เนื้อหา WWW คืออะไร ประโยชน์ของ WWW Web Browsers การใช้บริการ WWW

3. WWW : World Wide Web เป็นระบบการเผยแพร่ข่าวสารข้อมูลในระบบเครือข่ายอินเทอร์เน็ต โดยการเชื่อมโยงและโอนย้ายข้อมูลจากแหล่งข้อมูลทีเรียกว่า Web Server ข้อมูลใน World Wide Web เป็นได้ทั้งข้อความ รูปภาพและเสียง การเชื่อมโยงใน WWW มีลักษณะของ Hyperlink และ Hypermedia โดยใช้โปรโตคอล HTTP (HyperText Transfer Protocal)

4. ความเป็นมาของ WWW พัฒนาที่ สถาบัน CERN เมืองเจนีวา สวิตเซอร์แลนด์ ซึ่งเป็นห้องปฏิบัติการทางฟิสิกส์ ค . ศ . 1989 Tim Berners-Lee ได้พัฒนาการนำเสนอเอกสาร ในรูปแบบที่เรียกว่า Hypertext ( รูปแบบเอกสารในลักษณะของ Help ในปัจจุบัน ) Tim สร้าง Web Software ชุดแรกในเดือนตุลาคม ค . ศ . 1991 World Wide Web ได้ถูกเผยแพร่ครั้งแรกนอก CERN ในระบบเครือข่ายอินเทอร์เน็ตในฤดูร้อนปี ค . ศ . 1991

5. HYPERTEXT Hypertext มีลักษณะเหมือนข้อความปกติ สามารถจัดเก็บ อ่าน ค้นหาหรือแก้ไขได้ Hypertext เป็นองค์ประกอบที่สำคัญบน Web ซึ่งผู้ใช้สามารถใช้งานในลักษณะการโต้ตอบได้ Hypertext เป็นการเชื่อโยงข่าวสารโดยมี ตัวชี้ ( links) ลักษณะสำคัญคือสามารถเชื่อมโยงข้อความจากข้อความหนึ่งไปยังอีกข้อความหนึ่งได้

6. ตัวอย่าง Hypertext The Department of Computer Sciences, founded in 1962, is the oldest CS department in the country. It offers bachelors, masters, and doctoral degrees and has about 400 undergraduates and 120 full-time graduate students. The department has active student chapters of the ACM and of the UPE Computing Sciences Honor Society.

7. HYPERLINK เอกสารต่าง ๆใน WWW สามารถเชื่อโยงหรือติดต่อไปยังเอกสารอื่นๆ ทั้งที่อยู่ภายในแฟ้มเอกสารเดียวกัน หรือต่างแฟ้ม หรือต่างเครื่องคอมพิวเตอร์ ในการเชื่อมโยงเอกสารนั้นจะทำให้สามารถค้นหาสารสนเทศได้อย่างอิสระ Hypertext link จะเรียกว่า Hyperlinks Hyperlinks สามารถสร้าง Web ที่ซับซ้อนได้

8. HYPERMEDIA Hypermedia = Hypertext + Multimedia เอกสาร Hypermedia นอกจากจะมีการเชื่อมโยงข้อความแล้ว ยังมี การเชื่อโยง ในรูปแบบอื่นอีกได้แก่ภาพ (Images) เสียง (Sound) ภาพเคลื่อนไหว (Animation) และ ภาพยนต์ (movies)

9. รหัสสืบค้น URLs : Uniform Resource Locators การเชื่อมโยงข้อมูลของ WWW ถูกกำหนดโดยรหัสสืบค้น URL คำสั่งในการติดต่อกับ Server ที่มีบริการหลากหลาย โปรโตคอล ตัวอย่างเช่น gopher, ftp, telnet และ news รูปแบบมาตราฐานของคำสั่งเพื่อใช้สืบค้น เรียกว่า URL protocol :// ชื่อโฮสต์ / path / ชื่อไฟล์ p rotocol เป็นการระบุชนิดโปรโตคอล ชื่อโฮสต์ กำหนดชื่อโฮสต์คอมพิวเตอร์ที่ต้องการติดต่อ Path / ชื่อไฟล์ แสดงชื่อไดเรคทอรีและชื่อแฟ้มเอกสาร รูปแบบมาตราฐานของ WWW คือขึ้นต้นด้วย http:// ตัวอย่างเช่น http://www.nectec.or.th

10. โปรโตคอล ใน WWW โกเฟอร์ gopher://gopher host gopher://gopher.nectec.or.th ถ่ายโอนแฟ้ม ftp://ftp host ftp://ftp.nectec.or.th/pub/ ftp://192.150.251.33 เปิดแฟ้ม file://host/path/file file://c|index.html

11. โปรโตคอล ใน WWW( ต่อ ) อ่านข่าวยูสเน็ต news://host name news://news.nectec.or.th news://soc.culture.thai เข้าใช้เครื่องระยะไกล telnet://host name telnet://nwg.nectec.or.th ใช้บริการ Hypertext http://host name http:/ /bucc4 .buu.ac.th

12. HTTP : Hypertext Tranfer Protoc o l HTTP เป็นโปรโตคอลที่ใช้เชื่อมโยงข้อมูลกับแหล่งข้อมูล บน WWW เมื่อผู้ใช้คลิกเมาส์ ณ ตำแหน่งข้อมูลที่กำหนดไว้เป็นตัวเชื่อมโยง ก็จะเกิดการเชื่อมโยงไปยังแฟ้มข้อมูลที่กำหนดไว้

13. Web Server (Web Site) คือเครื่องคอมพิวเตอร์ระบบ UNIX หรือ Windows N T หรือ Windows 95 ที่มีโปรแกรมจัดการทำให้เครื่องดังกล่าวทำหน้าที่เป็นผู้ให้บริการ (Server) คอยให้บริการข้อมูลกับผู้ที่มาติดต่อโดยผ่านระบบเครือข่าย Internet หรือ เครือข่าย Intranet

14. Web Server Software IIS : Internet Information Server Netscape Communication Server Apache Web Personal Microsoft Fontpage Server

15. Web Browsers เป็นโปรแกรมที่ทำหน้าที่แปลคำสั่งและข้อมูลที่อยู่ในรูปของภาษา HTML ให้กลายมาเป็นรูปแบบการแสดงข้อมูลบนจอภาพตามรูปแบบ คำสั่งที่กำหนดไว้ ติดตั้งบนเครื่องที่จะขอใช้บริการ WWW (WWW Client Program)

16. Web Browser 2 กลุ่มใหญ่ บราวเซอร์แบบ graphic Mode( ใช้งานแบบ Hypermedia) Mosaic -Netscape Microsoft Internet Explo r er บราวเซอร์แบบ Text mode( ใช้งานแบบ Hypertext) Lynx และ DosLynx โดยมหาวิทยาลัยแคนซัส สหรัฐอเมริกา อยู่ที่ ftp2.cc.ukans.edu

17. Web browser features ลักษณะสำคัญของ Web browsers ที่ใช้งานในปัจจุบัน Mouse-driven graphical interface สามารถแสดงเอกสารแบบ Hypertext และ Hypermedia สามารถแสดงข้อความตามชนิดของ fonts และตัวอักษรลักษณะพิเศษเช่นตัวหนา ตัวเอียง สามารถจัดรูปแบบของเอกสารที่จะแสดงเช่น paragraph, lists สนับสนุนการใช้เสียงและวิดีโอ สนับสนุนบริการต่างๆ บนเครือข่ายเช่น ftp, telnet, gopher สามารจัดเก็บรหัสสืบค้น URLs และเรียกใช้งานได้

18. การใช้งาน Web browser Web browser โดยทั่วไปมีการทำงานแบบ pull-down menus Location fields ใช้กำหนด URL ของเอกสารที่ต้องการแสดง Viewing area เป็นบริเวณที่ใช้แสดงข้อมูลในเอกสารปัจจุบัน ซึ่งในเอกสารจะแสดงข้อมูลข่าวสารทั้งข้อความ ภาพ ภาพเคลื่อไหว เสียง วิดีโอ รวมทั้ง การเชื่อมโยงไปยังแหล่งข้อมูลต่างๆใน WWW

19. Windows history Browser จะมีการจัดเก็บเอกสารที่เราได้เรียกดูไว้ ในขณะที่เรากำลังใช้งาน แหล่งเชื่อมโยงเอกสารที่เราเคยอ่านจะจัดเก็บไว้ใน history window สามารถเรียกใช้งานได้จากเมนูหลัก Window และเมนูย่อย History

20. Hotlists, Bookmarks, Favorites Hotlists/Bookmarks/Favorites ใช้สำหรับจัดเก็บที่อยู่ในรูปแบบ URL ของ Website ที่เคยเรียกดู ซึ่งมีประโยชน์สำหรับการเรียกดูในภายหลัง และทำให้เราไม่ต้องจดจำชื่อ Website นั้น เราสามารถเพิ่มหรือลบที่อยู่ของ Website ที่จัดเก็บไว้ใน Hotlists/Bookmarks/Favorites ได้โดยง่าย

21. Web browser : Mosaic Mosaic เป็นโปรแกรม Web browser ตัวแรกที่พัฒนาโดย Marc Andreessen และเพื่อน ที่ National Center for Supercomputing Application(NCSA) มหาวิทยาลัยอิลลินอยส์ โดยใช้เวลา 4 เดือนในช่วงปลายปี ค . ศ . 1992 ถึงต้นปี ค . ศ . 1993 โปรแกรม Mosaic รุ่นแรก พัฒนาเสร็จต้นปี 1993 ได้ถูกแจกจ่ายให้ผู้ใช้อย่างรวดเร็ว โดยไม่เสียค่าใช้จ่าย จึงกลายเป็นโปรแกรมยอดนิยมทันที เนื่องจากมีลักษณะการใช้งานเป็น point-and-click Multimedia interface Mosaic เป็นมาตราฐานของ Web browser

22. Web browsers: Netscape Navigator Marc Andreessen เป็นผู้ก่อตั้งบริษัท Netscape Communications Corporation Netscape เวอร์ชันแรก ใช้งานในเดือนตุลาคม ค . ศ . 1994 มีการทำงานแบบ Continuous document streaming สามารใช้งานได้บน MS Windows, Apple Macintosh และ X-Windows บน UNIX ปัจจุบัน Netscape เป็นผู้พัฒนามาตราฐานใหม่ ๆของภาษา HTML เวอร์ชันใหม่ เรียกว่า Netscape Communicator

23. การใช้งาน Netscape เป็นโปรแกรม Web browser ทีนิยมใช้ในปัจจุบัน ใช้งานง่าย สามารถถ่ายโอนโปรแกรมได้ฟรีจากอินเทอร์เน็ต http://home.netscape.com/ การเรียกใช้ สามารถทำได้โดยการ double-click ที่ไอคอน ของ Netscape หรือเรียกจาก start icon โดยจะเข้าสู่ Netscape home page

24. หน้าตาของโปรแกรม Netscape Netscape home page เหมือนโปรแกรม windows ทั่วไป ประกอบด้วย Title bar, Menu bar, Toolbar นอกจากนี้ยังมี Location box เพื่อให้แสดงชื่อ web site ที่กำลังใช้งาน มีปุ่ม 6 ปุ่มที่จะแสดงข่าวสารให้ใช้งานด้วนรวดเร็ว

25. ปุ่มคำสั่งทูลบาร์ Back -- ใช้แสดงข้อมูลย้อนหลังหนึ่งหน้า Forward -- ใช้แสดงข้อมูลหน้าถัดไปหนึ่งหน้า Home -- ใช้แสดงข้อมูลที่เป็นโฮมเพจ Reload -- เป็นคำสั่งสำหรับโหลดข้อมูลปัจจุบันจากแหล่งข้อมูลซ้ำ Images -- เป็นคำสั่งสำหรับการโอนย้ายรูปภาพ Open -- เป็นคำสั่งสำหรับเปิดแฟ้มข้อมูลหรือเชื่อมโยงกับ Web server Print -- เป็นคำสั่งสำหรับพิมพ์แฟ้มข้อมูลที่เปิดอยู่ออกทางเครื่องพิมพ์ Find -- เป็นคำสั่งค้นหาคำบนเว็บเพจ Stop -- เป็นคำสั่งเพื่อหยุดการเชื่อโยงกับ Web server

26. Home page ของ Netscape มีสัญลักษณ์เป็นรูปเรือ Vikings และมีเมนูที่มีลักษณะของ hyperlink ให้เลือกใช้ ถ้าต้องการเชื่อมโยงไปที่ใดให้เลือกคลิกที่เมนูได้ตามต้องการ ขณะที่โปรแกรมกำลังโหลดข้อมูลที่สัญลักษณ์ตัว N จะมีรูปดาวหางกำลังวิ่ง

27. Mosaic and Netscape need TCP/IP ทั้ง Mosaic และ Netscape ( เหมือน Web browser อื่นๆ ) จะต้องทำงานบน Internet node สำหรับ PC workstation ที่ใช้ในการเชื่อมต่อหรือเป็น node ของอินเทอร์เน็ตจะต้องติดตั้ง TCP/IP

28. Web browser: Lynx Lynx เป็น browser ที่แสดงผลเป็นข้อความ (Text mode) ไม่มีกราฟฟิก ไม่มี เสียง Lynx ทำงานบน Internet node Lynx เหมาะกับการใช้งานในลักษณะที่เป็น teminal โดยเชื่อม PCs หรือ MACs เข้ากับเครือข่ายอินเทอร์เน็ต โดยผ่านโมเด็ม พัฒนาโดย Academic Computing Service, University of Kansas ดูรายละเอียดที่ http://www.cc.ukans.edu/ about lynx/about lynx.html

29. Web browser: Microsoft’s Internet Explorer พัฒนาขึ้นเพื่อใช้งานบนระบบปฏิบัติการ Windows 95 สนับสนุนมาตราฐานของ HTML ใหม่ๆเช่น Marquees, AVI(Audio Video Interleave) inline video clips, selectable fonts, background sounds สนับสนุนการใช้งานแบบ SSL(Secure Sockets Layer) และ RSA encrytion technology สนับสนุน VRML(Virtual Reality Modelling Language)

30. Web page Web page คือข้อมูลที่อยู่บน Web server จะมีข้อมูลต่างๆ ที่เจ้าของระบบจัดเตรียมไว้ เพื่อให้ผู้ใช้อินเทอร์เน็ตเข้ามาดู เพื่อประชาสัมพันธ์กิจกรรมต่างๆของเจ้าของ Web site

31. Home page คืออะไร Home Page คือ หน้าหนังสืออิเล็กทรอนิกส์บน World Wide Web ที่เสนอข้อมูลใดๆ ที่เจ้าของ Home Page ต้องการจะใส่ลงไปในหน้าหนังสืออิเล็กทรอนิกส์นั้นเช่น ข้อมูลแนะนำตัวเอง ซึ่งอาจเป็นบุคคลหรือองค์กรที่ต้องการให้ผู้อื่นได้รับทราบ หรือข้อมูลที่ น่าสนใจ เป็นต้น ซึ่งใน Home Page หนึ่งๆ อาจมีหลายหน้าจอ (Page) ได้ และ Page หนึ่งๆ เหล่านี้จะมีฐานะเป็น Web Page และมีนามสกุลเป็น .htm หรือ .html ข้อมูลที่แสดงก็เป็นได้ทั้งข้อความ เสียง ภาพนิ่ง และภาพเคลื่อนไหว และข้อมูลที่นำเสนอสามารถเชื่อมโยงในรูปของ Hypertext คือ โยง (link) ไปยัง Page อื่นที่จะให้ข้อมูลนั้นๆ ในระดับลึกลงไปได้เรื่อยๆ

32. ส่วนประกอบของ Homepage 1 . ส่วน Header ประกอบด้วย ชื่อหน่วยงาน ตราหรือสัญลักษณ์ของหน่วยงาน หน้าที่หรือวัตถุประสงค์ของหน่วยงาน 2. ส่วน Body ประกอบด้วย เส้นแบ่งข้อความ รายการของหัวข้อหรือเนื้อหา ภาพประกอบ ปุ่มหรือ icon

33. ส่วนประกอบของ Homepage 3. ส่วน footer ประกอบด้วย email address ของผู้สร้าง (webmaster) และหน่วยงาน วันเวลาที่สร้างและปรับปรุงข้อมูล คำประกาศลิขสิทธิ์ ตราหรือสัญลักษณ์ของหน่วยงาน คำประกาศหรือเจตนารมย์ของหน่วยงาน

34. การเตรียมข้อมูลใน Web page เขียนโปรแกรมด้วยภาษา HTML (Hypertext Markup Language) ใช้โปรแกรมประเภท HTML Editor หรือ HTML Authoring Tool ช่วยสร้างเอกสารที่มีอยู่แล้วให้เป็นภาษา HTML

35. โปรแกรมช่วยสร้างเอกสาร HTML : WWW Authoring Tool โปรแกรมที่ช่วยผู้ใช้สร้าง Web page ได้อย่างรวดเร็ว WWW Authoring Tool สามารถสร้างเอกสาร HTML โดยไม่ต้องเขียนคำสั่ง HTML เอง เช่น Internet Assistant ของ Microsoft Microsoft Front Page ของ Microsoft ขอดูข้อมูลที่ http://www.microsoft.com/ WebAuthor ของบริษัท Quarterdeck ทำงานร่วมกับ MS Word 6.0 ขอดูข้อมูลที่ http://www.qdeck.com/ MS Office 97

36. โปรแกรมช่วยสร้างเอกสาร HTML : HTML Editors เป็นโปรแกรม Editor ที่สร้างขึ้นมาเพื่อใช้สำหรับเขียนภาษา HTML โดยเฉพาะ มีคำสั่งหลักของภาษา HTML ให้เลือกใช้ HoTMetal Pro http://ftp.ncsa.uiuc.edu/Web/html/htometal HotDogs Super NotePad

37. HTML : Hypertext Markup Language แฟ้มข้อมูลข่าวสารบน WWW ถูกจัดรูปแบบด้วยภาษา HTML แฟ้มคำสั่ง HTML เป็น Text File ที่มีนามสกุล html หรือ htm คำสั่งแต่ละคำสั่งกำกับด้วย tag เช่น <html> <head> <title>………………..……</title> </head> <body>…………… </body> </html>

38. Advanced Features ของ HTML Clickable image Maps Table Forms Processing Forms, Input, Checkboxes, Style Sheets Uniform Resource Naming Commercialization

39. ตัวอย่าง HTML Document และผลลัพธ์ <html> <head> <title>My Documents/index.html</title> </head> <body> <h1>My Home Page</h1> <hr> <h2>E-mail</h2> click <a href=“mailto:seree@bucc.buu.ac.th”> Mail To Seree</a> </body> </html>

40. ตัวอย่าง ผลลัพธ์

41. ประโยชน์ของ HTML เพื่อเผยแพร่ข้อมูลในรูปวารสารอิเล็กทรอนิกส์ เพื่อการตลาด เผยแพร่ โฆษณา จำหน่ายสินค้า เพื่อความบันเทิง เพื่อการเรียนการสอน เพื่อการสำรวจ วิจัย นำเสนอสิ่งพิมพ์

42. การเปิด Web site เลือกเมนู File เลือกคำสั่ง Open Location พิมพ์ที่อยู่ของ Web site ที่ต้องการ ในกรณีต้องการเปลี่ยน Web site ให้พิมพ์ที่อยู่ของ Web site ที่ต้องการในช่อง Location ที่อยู่ใต้แถบเครื่องมือ

43. การค้นหาข้อมูลใน Web site ติดต่อโดยตรงกับ Web server ที่สนใจ เ ริ่มที่ home page เจาะเข้าหา Web page ที่สนใจ สืบค้นข้อมูลผ่าน Search engine สืบค้นผ่าน Catalog ที่เป็น Home page ของ Web server ที่สำคัญๆ

44. Search Engine เป็นโปรแกรมสืบค้นรายละเอียดหรือข้อมูลบน WWW ในระบบ Windows ช่วยค้นสิ่งที่ต้องการได้อย่างรวดเร็ว โปรแกรมที่นิยมใช้ได้แก่ Yahoo, AltaVista, Lycos, Web crawer

45. การเรียกใช้ Search engine ที่ช่อง Location พิมพ์รหัส URL ของ Search engine ที่ต้องการ ในโปรแกรม Netscape จะมีปุ่มให้เลือกใช้โปรแกรม Search engine ที่ต้องการได้ทันที

46. Search engine ที่สำคัญ Yahoo http://www.yahoo.com Alta Vista http://www.altavista.com Lycos http://www.lycos.com Infoseek http://www.infoseek.com Exite http://www.excite.com Web crawler http://www.wencrawler.com Shareware http://www.shareware.com

47. เทคนิคการใช้ Web Browser เปิดหลายหน้าต่างพร้อมกัน ระหว่างโหลดกราฟิกให้เลื่อนดูข้อความก่อน ถ้าคอยข้อมูลนานให้หยุดแล้วลองเรียกใหม่อีกครั้ง ดูข้อความอย่างเดียวเร็วที่สุด เก็บ Web site ที่ชอบใส่ book Mark เอาไว้

48. การบันทึกแฟ้มรูปภาพจาก Web site ใช้โปรแกรมเบราว์เซอร์วิ่งไปยัง Web site ที่ต้องการ เลื่อนเมาส์พอยน์เตอร์ไปที่ภาพที่ต้องการแล้วคลิกเมาส์ปุ่มขวา จากนั้นเมนูจะปรากฏ ให้คลิกคำสั่ง Save Image As เมื่อไดอะล็อกบล็อกปรากฏ ให้คลิกโฟลเดอร์ที่ใช้เก็บไฟล์รูปภาพ จากนั้นคลิกปุ่ม Save

49. การบันทึก Web page เก็บเป็นไฟล์ไว้ เรียกโปรแกรมเบราว์เซอร์ พิมพ์ที่อยู่ Web site ที่ต้องการ คลิกเมนู File คลิกคำสั่ง Save As เลือกโฟลเดอร์ที่ใช้เก็บไฟล์ คลิกปุ่ม Save เครื่องจะเก็บเป็นแฟ้มที่มีนามสกุลเป็น html หรือ htm

50. วิธีเรียกดูไฟล์ Web page ที่เก็บไว้ เรียกโปรแกรมเบราว์เซอร์ คลิกเมนู File คลิกคำสั่ง Open File เลือกโฟลเดอร์ ( ไดเร็คทอรี ) ที่เก็บไฟล์เอาไว้ คลิกชื่อไฟล์ Web page ที่ต้องการอ่าน คลิกปุ่ม Open

51. วิธีพิมพ์ Web page คลิกเมนู File คลิกคำสั่ง Print Preview คลิกปุ่ม Zoom In เพื่อดูรายละเอียดของงาน คลิกปุ่ม Print คลิกปุ่ม OK

52. การติดตั้ง WWW Home Page จ้างศูนย์บริการหรือผู้เชี่ยวชาญ โดยสร้างเป็น Home Page ที่ WWW Site ของศูนย์บริการ เช่น http://www.inet.co.th/~seree http://www.ksc.net.th ตั้ง W eb Site ขึ้นมาเองสำหรับองค์กร ต่อเครือข่ายในองค์กรเป็นโหนดของอินเทอร์เน็ต ติดตั้งโปรแกรม WWW Server บนโฮสต์ขององค์กร

53. จะใช้บริการ WWW จากที่บ้านได้อย่างไร ? มีบัญชีผู้ใช้ที่ศูนย์บริการอินเทอร์เน็ตและหมายเลขโทรศัพท์ที่ศูนย์บริการ เครื่องพีซี โมเด็มและสายโทรศัพท์ที่บ้าน ระบบปฏิบัติการ Windows 95 โปรแกรมบราวเซอร์เช่น Netscape

54. Web Site ที่น่าสนใจ Http://www.hotmail.com http://www.disney.com http://www.whitehouse.com http://www.cnn.com http://www.microsoft.com http://www.khstar.com

55. สรุป WWW เปิดโอกาสทองทางธุรกิจในรูปแบบใหม่ แหล่งข้อมูลข่าวสารมหาศาลสำหรับบุคคลและองค์กร ทั้งภาครัฐและภาคเอกชนจะได้รับประโยชน์มหาศาล โลกข้อมูลข่าวสารไร้พรมแดน The new source of power is not money in the hands of the few, but information in the hands of the many. --Jonh Naisbittt