55
World Wide Web World Wide Web แแแ แแแ Web Browsers Web Browsers แแแแแแแแแแแแแแแ แแแแแแแแแแแ แแแแแแแแแแแ แแแแแ

08 W3 Browser

Embed Size (px)

Citation preview

Page 1: 08 W3 Browser

World Wide Web World Wide Web และและ Web BrowsersWeb Browsers

ภาควิ�ชาวิ�ทยาการคอมพิ�วิเตอร�

มหาวิ�ทยาล�ย บู�รพิา

Page 2: 08 W3 Browser

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

Page 3: 08 W3 Browser

WWW : WWW : World Wide We World Wide Webb เป�น์ระบบการเผยแพร�ข�าวสารข�อมู�ลใน์ระบบเคืร�อ

ข�ายอ�น์เทอร เน์"ต โดยการเช�%อมูโยงและโอน์ย�าย ข�อมู�ลจากแหล�งข�อมู�ลท(เร(ยกว�า Web Server

ข�อมู�ลใน์ World Wide Web เป�น์ได�ท)*ง ข�อคืวามู ร�ปภาพและเส(ยง

การเช�%อมูโยงใน์ WWW มู(ล)กษณะของ Hyperlink และ Hypermedia โดยใช�

โปรโตคือล HTTP (HyperText TransferProtocal)

Page 4: 08 W3 Browser

ควิามเป็�นื้มาของ ควิามเป็�นื้มาของ WWWWWW พ)ฒน์าท(% สถาบ)น์ CERN เมู�องเจน์(วา สว�ตเซอร

แลน์ด ซ1%งเป�น์ห�องปฏิ�บ)ต�การทางฟิ4ส�กส คื.ศ - . 1989 Tim Berners Lee ได�พ)ฒน์าการ

น์7าเสน์อเอกสาร ใน์ร�ปแบบท(%เร(ยกว�า Hypertext( ร�ปแบบเอกสารใน์ล)กษณะของ Help ใน์ป8จจ9บ)น์ )

Tim สร�าง Web Software ช9ดแรกใน์เด�อน์ ต9ลาคืมู คื.ศ . 1991

World Wide Web ได�ถ�กเผยแพร�คืร)*งแรกน์อกCERN ใน์ระบบเคืร�อข�ายอ�น์เทอร เน์"ตใน์ฤด�

ร�อน์ป; คื.ศ . 1991

Page 5: 08 W3 Browser

HYPERTEXTHYPERTEXTHypertext มู(ล)กษณะเหมู�อน์ข�อคืวามูปกต�

สามูารถจ)ดเก"บ อ�าน์ คื�น์หาหร�อแก�ไขได�Hypertext เป�น์องคื ประกอบท(%ส7าคื)ญบน์ Web

ซ1%งผ��ใช�สามูารถใช�งาน์ใน์ล)กษณะการโต�ตอบได�Hypertext เป�น์การเช�%อโยงข�าวสารโดยมู( ต)วช(*

(links)ล)กษณะส7าคื)ญคื�อสามูารถเช�%อมูโยงข�อคืวามูจาก

ข�อคืวามูหน์1%งไปย)งอ(กข�อคืวามูหน์1%งได�

Page 6: 08 W3 Browser

ต�วิอย าง ต�วิอย าง HypertextHypertext

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.

Page 7: 08 W3 Browser

HYPERLINKHYPERLINK เอกสารต�าง ๆใน์ WWW สามูารถเช�%อโยงหร�อ

ต�ดต�อไปย)งเอกสารอ�%น์ๆ ท)*งท(%อย��ภายใน์แฟิ>มู เอกสารเด(ยวก)น์ หร�อต�างแฟิ>มู หร�อต�างเคืร�%อง

คือมูพ�วเตอร ใน์การเช�%อมูโยงเอกสารน์)*น์จะท7าให�สามูารถ

คื�น์หาสารสน์เทศได�อย�างอ�สระHypertext link จะเร(ยกว�า HyperlinksHyperlinks สามูารถสร�าง Web ท(%ซ)บซ�อน์

ได�

Page 8: 08 W3 Browser

HYPERMEDIAHYPERMEDIAHypermedia = Hypertext +

Multimedia เอกสาร Hypermedia น์อกจากจะมู(

การเช�%อมูโยงข�อคืวามูแล�ว ย)งมู(การเช�%อโยง ใน์ร�ปแบบอ�%น์อ(กได�แก�ภาพ(Images) เส(ยง (Sound) ภาพ

เคืล�%อน์ไหว (Animation) และ ภาพยน์ต (movies)

Page 9: 08 W3 Browser

รห�สส�บูค"นื้ รห�สส�บูค"นื้ URLs : Uniform URLs : Uniform Resource LocatorsResource Locators การเช�%อมูโยงข�อมู�ลของWWW ถ�กก7าหน์ดโดยรห)สส�บคื�น์URL

คื7าส)%งใน์การต�ดต�อก)บ Server ท(%มู(บร�การหลากหลาย โปรโตคือล ต)วอย�างเช�น์

gopher, ftp, telnet และ news ร�ปแบบมูาตราฐาน์ของคื7าส)%งเพ�%อใช�ส�บคื�น์ เร(ยกว�า URL

protocol://ช�%อโฮสต /path/ช�%อไฟิล p rotocol เป�น์การระบ9ชน์�ดโปรโตคือล ช�%อโฮสต ก7าหน์ดช�%อโฮสต คือมูพ�วเตอร ท(%ต�องการต�ดต�อ Path/ช�%อไฟิล แสดงช�%อไดเรคืทอร(และช�%อแฟิ>มูเอกสาร

ร�ปแบบมูาตราฐาน์ของ WWW คื�อข1*น์ต�น์ด�วย http:// ต)วอย�างเช�น์ http://www.nectec.or.th

Page 10: 08 W3 Browser

โป็รโตคอล ในื้ โป็รโตคอล ในื้ WWWWWW โกเฟิอร gopher://gopher host

gopher://gopher.nectec.or.thถ�ายโอน์แฟิ>มู ftp://ftp host

ftp://ftp.nectec.or.th/pub/ ftp://192.150.251.33

เป4ดแฟิ>มู file://host/path/file file://c|index.html

Page 11: 08 W3 Browser

โป็รโตคอล ในื้ โป็รโตคอล ในื้ WWW(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

Page 12: 08 W3 Browser

HTTP : Hypertext HTTP : Hypertext Tranfer Protoc Tranfer Protocooll

HTTP เป�น์โปรโตคือลท(%ใช�เช�%อมูโยง ข�อมู�ลก)บแหล�งข�อมู�ล บน์ WWW

เมู�%อผ��ใช�คืล�กเมูาส ณ ต7าแหน์�งข�อมู�ลท(% ก7าหน์ดไว�เป�น์ต)วเช�%อมูโยง ก"จะเก�ดการ

เช�%อมูโยงไปย)งแฟิ>มูข�อมู�ลท(%ก7าหน์ดไว�

Page 13: 08 W3 Browser

Web Server (Web Site)Web Server (Web Site)

คื�อเคืร�%องคือมูพ�วเตอร ระบบ UNIX หร�อ Windows NT หร�อ Windows 95 ท(%มู(โปรแกรมูจ)ดการท7าให�เคืร�%องด)งกล�าวท7า

หน์�าท(%เป�น์ผ��ให�บร�การ (Server) คือยให�บร�การข�อมู�ลก)บผ��ท(%มูาต�ดต�อโดยผ�าน์

ระบบเคืร�อข�าย Internet หร�อ เคืร�อข�ายIntranet

Page 14: 08 W3 Browser

Web Server SoftwareWeb Server Software IIS : Internet Information

Server Netscape Communication

ServerApache Web Personal Microsoft Fontpage Server

Page 15: 08 W3 Browser

Web Browsers เป�น์โปรแกรมูท(%ท7าหน์�าท(%แปลคื7าส)%งและ

ข�อมู�ลท(%อย��ใน์ร�ปของภาษา HTML ให�กลายมูาเป�น์ร�ปแบบการแสดงข�อมู�ลบน์

จอภาพตามูร�ปแบบ คื7าส)%งท(%ก7าหน์ดไว� ต�ดต)*งบน์เคืร�%องท(%จะขอใช�บร�การ

WWW (WWW Client Program)

Page 16: 08 W3 Browser

Web Browser 2 Web Browser 2 กล% มใหญ่ กล% มใหญ่ บราวเซอร แบบ graphic Mode( ใช�งาน์แบบ

Hypermedia) Mosaic -Netscape Microsoft Internet Explorer

บราวเซอร แบบ Text mode( ใช�งาน์แบบHypertext) Lynx และ DosLynx โดยมูหาว�ทยาล)ยแคืน์ซ)ส

สหร)ฐอเมูร�กา อย��ท(% ftp2.cc.ukans.edu

Page 17: 08 W3 Browser

Web browser featuresWeb browser features ล)กษณะส7าคื)ญของ Web browsers ท(%ใช�งาน์ใน์

ป8จจ9บ)น์ Mouse-driven graphical interface สามูารถแสดงเอกสารแบบ Hypertext และ

Hypermedia สามูารถแสดงข�อคืวามูตามูชน์�ดของ fonts และต)วอ)กษร

ล)กษณะพ�เศษเช�น์ต)วหน์า ต)วเอ(ยง สามูารถจ)ดร�ปแบบของเอกสารท(%จะแสดงเช�น์

paragraph, lists สน์)บสน์9น์การใช�เส(ยงและว�ด(โอ สน์)บสน์9น์บร�การต�างๆ บน์เคืร�อข�ายเช�น์ ftp, telnet,

gopher สามูารจ)ดเก"บรห)สส�บคื�น์ URLs และเร(ยกใช�งาน์ได�

Page 18: 08 W3 Browser

การใช"งานื้ การใช"งานื้ Web browserWeb browser Web browser โดยท)%วไปมู(การท7างาน์

แบบ pull-down menusLocation fields ใช�ก7าหน์ด URL ของ

เอกสารท(%ต�องการแสดงViewing area เป�น์บร�เวณท(%ใช�แสดง

ข�อมู�ลใน์เอกสารป8จจ9บ)น์ ซ1%งใน์เอกสารจะ แสดงข�อมู�ลข�าวสารท)*งข�อคืวามู ภาพ ภาพ

เคืล�%อไหว เส(ยง ว�ด(โอ รวมูท)*ง การเช�%อมู โยงไปย)งแหล�งข�อมู�ลต�างๆใน์ WWW

Page 19: 08 W3 Browser

Windows historyWindows history Browser จะมู(การจ)ดเก"บเอกสารท(%เราได�

เร(ยกด�ไว� ใน์ขณะท(%เราก7าล)งใช�งาน์แหล�งเช�%อมูโยงเอกสารท(%เราเคืยอ�าน์จะจ)ด

เก"บไว�ใน์ history windowสามูารถเร(ยกใช�งาน์ได�จากเมูน์�หล)ก

Window และเมูน์�ย�อย History

Page 20: 08 W3 Browser

Hotlists, Bookmarks, Hotlists, Bookmarks, FavoritesFavorites Hotlists/Bookmarks/Favorites ใช�

ส7าหร)บจ)ดเก"บท(%อย��ใน์ร�ปแบบ URL ของWebsite ท(%เคืยเร(ยกด� ซ1%งมู(ประโยชน์

ส7าหร)บการเร(ยกด�ใน์ภายหล)ง และท7าให�เราไมู� ต�องจดจ7าช�%อ Website น์)*น์

เราสามูารถเพ�%มูหร�อลบท(%อย��ของ Website ท(%จ)ดเก"บไว�ใน์ Hotlists/Bookmarks/Favorites ได�โดยง�าย

Page 21: 08 W3 Browser

Web browser : MosaicWeb browser : Mosaic Mosaic เป�น์โปรแกรมู Web browser ต)วแรกท(%

พ)ฒน์าโดยMarc Andreessen และเพ�%อน์ ท(%National Center for Supercomputing Application(NCSA) มูหาว�ทยาล)ยอ�ลล�น์อยส โดยใช�

เวลา 4 เด�อน์ใน์ช�วงปลายป; คื.ศ . 1992 ถ1งต�น์ป; คื.ศ .1993

โปรแกรมู Mosaic ร9 �น์แรกพ)ฒน์าเสร"จต�น์ป; 1993 ได�ถ�กแจกจ�ายให�ผ��ใช�อย�างรวดเร"ว โดยไมู�

เส(ยคื�าใช�จ�าย จ1งกลายเป�น์โปรแกรมูยอดน์�ยมูท)น์ท( เน์�%องจากมู(ล)กษณะการใช�งาน์เป�น์ - - point and click

Multimedia interface Mosaic เป�น์มูาตราฐาน์ของ Web browser

Page 22: 08 W3 Browser

Web browsers: Web browsers: Netscape NavigatorNetscape Navigator Marc Andreessen เป�น์ผ��ก�อต)*งบร�ษ)ท

Netscape Communications Corporation Netscape เวอร ช)น์แรก ใช�งาน์ใน์เด�อน์ต9ลาคืมู คื.ศ .1994

มู(การท7างาน์แบบ Continuous document streaming

สามูารใช�งาน์ได�บน์ MS Windows, Apple Macintosh และ X-Windows บน์ UNIX

ป8จจ9บ)น์ Netscape เป�น์ผ��พ)ฒน์ามูาตราฐาน์ใหมู� ๆ ของภาษา HTML

เวอร ช)น์ใหมู� เร(ยกว�า Netscape Communicator

Page 23: 08 W3 Browser

การใช"งานื้ การใช"งานื้ NetscapeNetscape เป�น์โปรแกรมู Web browser ท(น์�ยมูใช�ใน์ป8จจ9บ)น์ ใช�งาน์ง�าย สามูารถถ�ายโอน์โปรแกรมูได�ฟิร(จากอ�น์เทอร เน์"ต

http://home.netscape.com/ การเร(ยกใช� สามูารถท7าได�โดยการ double-click

ท(%ไอคือน์ ของ Netscape หร�อเร(ยกจาก start icon โดยจะเข�าส�� Netscape home page

Page 24: 08 W3 Browser

หนื้"าตาของโป็รแกรม หนื้"าตาของโป็รแกรมNetscapeNetscape Netscape home page เหมู�อน์

โปรแกรมู windows ท)%วไป ประกอบด�วย Title bar, Menu bar,

Toolbar น์อกจากน์(*ย)งมู( Location box เพ�%อให�

แสดงช�%อ web site ท(%ก7าล)งใช�งาน์ มู(ป9Aมู 6 ป9Aมูท(%จะแสดงข�าวสารให�ใช�งาน์ด�วน์

รวดเร"ว

Page 25: 08 W3 Browser

ป็%'มค(าส�)งท�ลบูาร�ป็%'มค(าส�)งท�ลบูาร� -- Back ใช�แสดงข�อมู�ลย�อน์หล)งหน์1%งหน์�า -- Forward ใช�แสดงข�อมู�ลหน์�าถ)ดไปหน์1%งหน์�า -- Home ใช�แสดงข�อมู�ลท(%เป�น์โฮมูเพจ -- Reload เป�น์คื7าส)%งส7าหร)บโหลดข�อมู�ลป8จจ9บ)น์จากแหล�ง

ข�อมู�ลซ7*า -- Images เป�น์คื7าส)%งส7าหร)บการโอน์ย�ายร�ปภาพ -- Open เป�น์คื7าส)%งส7าหร)บเป4ดแฟิ>มูข�อมู�ลหร�อเช�%อมูโยง

ก)บ Web server -- Print เป�น์คื7าส)%งส7าหร)บพ�มูพ แฟิ>มูข�อมู�ลท(%เป4ดอย��ออก

ทางเคืร�%องพ�มูพ --Find เป�น์คื7าส)%งคื�น์หาคื7าบน์เว"บเพจ -- Stop เป�น์คื7าส)%งเพ�%อหย9ดการเช�%อโยงก)บ Web server

Page 26: 08 W3 Browser

Home pageHome page ของ ของNetscapeNetscape มู(ส)ญล)กษณ เป�น์ร�ปเร�อ Vikings และมู(

เมูน์�ท(%มู(ล)กษณะของ hyperlink ให�เล�อกใช�

ถ�าต�องการเช�%อมูโยงไปท(%ใดให�เล�อกคืล�กท(%เมูน์�ได�ตามูต�องการ

ขณะท(%โปรแกรมูก7าล)งโหลดข�อมู�ลท(% ส)ญล)กษณ ต)ว N จะมู(ร�ปดาวหางก7าล)งว�%ง

Page 27: 08 W3 Browser

Mosaic and Netscape Mosaic and Netscape need TCP/IPneed TCP/IP ท)*ง Mosaic และ Netscape

(เหมู�อน์Web browser อ�%น์ๆ ) จะต�อง ท7างาน์บน์ Internet node

ส7าหร)บ PC workstation ท(%ใช�ใน์การ เช�%อมูต�อหร�อเป�น์ node ของอ�น์เทอร เน์"ต

จะต�องต�ดต)*ง TCP/IP

Page 28: 08 W3 Browser

Web browser: LynxWeb browser: Lynx Lynx เป�น์ browser ท(%แสดงผลเป�น์ข�อคืวามู

(Text mode) ไมู�มู(กราฟิฟิ4ก ไมู�มู( เส(ยง Lynx ท7างาน์บน์ Internet node Lynx เหมูาะก)บการใช�งาน์ใน์ล)กษณะท(%เป�น์

teminal โดยเช�%อมู PCs หร�อ MACs เข�าก)บ เคืร�อข�ายอ�น์เทอร เน์"ต โดยผ�าน์โมูเด"มู

พ)ฒน์าโดย Academic Computing Service, University of Kansas

ด�รายละเอ(ยดท(% http://www.cc.ukans.edu/ about

lynx/about lynx.html

Page 29: 08 W3 Browser

Web browser: Web browser: Microsoft’s Internet Microsoft’s Internet ExplorerExplorer พ)ฒน์าข1*น์เพ�%อใช�งาน์บน์ระบบปฏิ�บ)ต�การ Windows

95 สน์)บสน์9น์มูาตราฐาน์ของ HTML ใหมู�ๆ เช�น์

Marquees, AVI(Audio Video Interleave) inline video clips, selectable fonts, background sounds

สน์)บสน์9น์การใช�งาน์แบบSSL(Secure Sockets Layer) และ RSA encrytion technology

สน์)บสน์9น์ VRML(Virtual Reality Modelling Language)

Page 30: 08 W3 Browser

Web pageWeb page

Web page คื�อข�อมู�ลท(%อย��บน์ Web server

จะมู(ข�อมู�ลต�างๆ ท(%เจ�าของระบบจ)ดเตร(ยมูไว� เพ�%อให�ผ��ใช�อ�น์เทอร เน์"ตเข�ามูาด� เพ�%อประชาส)มูพ)น์ธ์ ก�จกรรมูต�างๆของ

เจ�าของ Web site

Page 31: 08 W3 Browser

Home page Home page ค�ออะไรค�ออะไร Home Page คื�อ หน์�าหน์)งส�ออ�เล"กทรอน์�กส บน์

World Wide Web ท(%เสน์อข�อมู�ลใดๆ ท(%เจ�าของ Ho me Page ต�องการจะใส�ลงไปใน์หน์�าหน์)งส�อ

อ�เล"กทรอน์�กส น์)*น์เช�น์ ข�อมู�ลแน์ะน์7าต)วเอง ซ1%งอาจเป�น์ บ9คืคืลหร�อองคื กรท(%ต�องการให�ผ��อ�%น์ได�ร)บทราบ หร�อ

ข�อมู�ลท(% น์�าสน์ใจ เป�น์ต�น์ ซ1%งใน์ Home Page หน์1%งๆ อาจมู(หลายหน์�าจอ (Page) ได� และ Page หน์1%งๆ เหล�าน์(*

จะมู(ฐาน์ะเป�น์ Web Page และมู(น์ามูสก9ลเป�น์ .htm หร�อ .html ข�อมู�ลท(%แสดงก"เป�น์ได�ท)*งข�อคืวามู เส(ยง

ภาพน์�%ง และภาพเคืล�%อน์ไหว และข�อมู�ลท(%น์7าเสน์อสามูารถเช�%อมูโยงใน์ร�ปของ Hypertext คื�อ โยง (link) ไปย)ง

Page อ�%น์ท(%จะให�ข�อมู�ลน์)*น์ๆ ใน์ระด)บล1กลงไปได�เร�%อยๆ

Page 32: 08 W3 Browser

ส วินื้ป็ระกอบูของ ส วินื้ป็ระกอบูของ HomepageHomepage 1. ส�วน์ Header ประกอบด�วย

ช�%อหน์�วยงาน์ ตราหร�อส)ญล)กษณ ของหน์�วยงาน์ หน์�าท(%หร�อว)ตถ9ประสงคื ของหน์�วยงาน์

2. ส�วน์ Body ประกอบด�วย เส�น์แบ�งข�อคืวามู รายการของห)วข�อหร�อเน์�*อหา ภาพประกอบ ป9Aมูหร�อ icon

Page 33: 08 W3 Browser

ส วินื้ป็ระกอบูของ ส วินื้ป็ระกอบูของ HomepageHomepage3. ส�วน์ footer ประกอบด�วย

email address ของผ��สร�าง(webmaster) และหน์�วยงาน์

ว)น์เวลาท(%สร�างและปร)บปร9งข�อมู�ล คื7าประกาศล�ขส�ทธ์�C ตราหร�อส)ญล)กษณ ของหน์�วยงาน์ คื7าประกาศหร�อเจตน์ารมูย ของหน์�วยงาน์

Page 34: 08 W3 Browser

การเตร+ยมข"อม�ลในื้ การเตร+ยมข"อม�ลในื้ Web Web pagepage เข(ยน์โปรแกรมูด�วยภาษา HTML

(Hypertext Markup Language) ใช�โปรแกรมูประเภท HTML Editor

หร�อ HTML Authoring Tool ช�วย สร�างเอกสารท(%มู(อย��แล�วให�เป�น์ภาษา

HTML

Page 35: 08 W3 Browser

โป็รแกรมช วิยสร"างเอกสารโป็รแกรมช วิยสร"างเอกสาร HTMLHTML : WWW Authoring : WWW Authoring ToolTool

โปรแกรมูท(%ช�วยผ��ใช�สร�าง Web pageได�อย�างรวดเร"ว

WWW Authoring Tool สามูารถสร�างเอกสาร HTML โดยไมู�ต�องเข(ยน์คื7าส)%ง HTML เอง เช�น์

Internet Assistant ของ Microsoft Microsoft Front Page ของ Microsoft

ขอด�ข�อมู�ลท(% http://www.microsoft.com/ WebAuthor ของบร�ษ)ท Quarterdeck ท7างาน์ร�วมูก)บ

MS Word 6.0 ขอด�ข�อมู�ลท(% http://www.qdeck.com/

MS Office 97

Page 36: 08 W3 Browser

โป็รแกรมช วิยสร"างเอกสาร โป็รแกรมช วิยสร"างเอกสารHTMLHTML: HTML Editors: HTML Editors เป�น์โปรแกรมู Editor ท(%สร�างข1*น์มูาเพ�%อใช�

ส7าหร)บเข(ยน์ภาษา HTML โดยเฉพาะมู(คื7าส)%งหล)กของภาษา HTML ให�เล�อกใช�

HoTMetal Prohttp://ftp.ncsa.uiuc.edu/Web/html/

htometal HotDogs Super NotePad

Page 37: 08 W3 Browser

HTML : Hypertext HTML : Hypertext Markup LanguageMarkup Language

แฟิ>มูข�อมู�ลข�าวสารบน์ WWW ถ�กจ)ดร�ปแบบ ด�วยภาษา HTML

แฟิ>มูคื7าส)%ง HTML เป�น์ Text File ท(%มู(น์ามูสก9ลhtml หร�อ htm– คื7าส)%งแต�ละคื7าส)%งก7าก)บด�วย tag เช�น์<html>

<head> <title>………………..……</title></head> <body>…………… </body></html>

Page 38: 08 W3 Browser

Advanced Features Advanced Features ของ ของHTMLHTML Clickable image MapsTable Forms Processing

Forms, Input, Checkboxes, StyleSheets

Uniform Resource NamingCommercialization

Page 39: 08 W3 Browser

ต�วิอย าง ต�วิอย าง HTML Document 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:[email protected]”>

Mail To Seree</a></body></html>

Page 40: 08 W3 Browser

ต�วิอย าง ผลล�พิธ์� ต�วิอย าง ผลล�พิธ์�

Page 41: 08 W3 Browser

ป็ระโยชนื้�ของ ป็ระโยชนื้�ของ HTMLHTML เพ�%อเผยแพร�ข�อมู�ลใน์ร�ปวารสาร

อ�เล"กทรอน์�กส เพ�%อการตลาด เผยแพร� โฆษณา จ7าหน์�าย

ส�น์คื�า เพ�%อคืวามูบ)น์เท�ง เพ�%อการเร(ยน์การสอน์ เพ�%อการส7ารวจ ว�จ)ยน์7าเสน์อส�%งพ�มูพ

Page 42: 08 W3 Browser

การเป็.ด การเป็.ด Web siteWeb site เล�อกเมูน์� File เล�อกคื7าส)%ง Open Location พ�มูพ ท(%อย��ของ Web site ท(%ต�องการ ใน์กรณ(ต�องการเปล(%ยน์ Web site ให�

พ�มูพ ท(%อย��ของ Web siteท(%ต�องการใน์ ช�อง Location ท(%อย��ใต�แถบเคืร�%องมู�อ

Page 43: 08 W3 Browser

การค"นื้หาข"อม�ลในื้ การค"นื้หาข"อม�ลในื้ Web siteWeb site

ต�ดต�อโดยตรงก)บ Web server ท(%สน์ใจ เ ร�%มูท(% home page เจาะเข�าหา Web page ท(%สน์ใจ

ส�บคื�น์ข�อมู�ลผ�าน์ Search engine ส�บคื�น์ผ�าน์ Catalog ท(%เป�น์ Home

page ของ Web server ท(%ส7าคื)ญๆ

Page 44: 08 W3 Browser

Search EngineSearch Engine

เป�น์โปรแกรมูส�บคื�น์รายละเอ(ยดหร�อ ข�อมู�ลบน์ WWW ใน์ระบบWindows

ช�วยคื�น์ส�%งท(%ต�องการได�อย�างรวดเร"ว โปรแกรมูท(%น์�ยมูใช�ได�แก� Yahoo,

AltaVista, Lycos, Web crawer

Page 45: 08 W3 Browser

การเร+ยกใช" การเร+ยกใช" Search engineSearch engine ท(%ช�อง Location พ�มูพ รห)ส URL ของ

Search engine ท(%ต�องการ ใน์โปรแกรมู Netscape จะมู(ป9Aมูให�เล�อก

ใช�โปรแกรมู Search engine ท(%ต�องการได�ท)น์ท(

Page 46: 08 W3 Browser

Search engine 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

Page 47: 08 W3 Browser

เทคนื้�คการใช" เทคนื้�คการใช" Web BrowserWeb Browser เป4ดหลายหน์�าต�างพร�อมูก)น์ ระหว�างโหลดกราฟิ4กให�เล�%อน์ด�ข�อคืวามูก�อน์ ถ�าคือยข�อมู�ลน์าน์ให�หย9ดแล�วลองเร(ยกใหมู�

อ(กคืร)*ง ด�ข�อคืวามูอย�างเด(ยวเร"วท(%ส9ด เก"บ Web site ท(%ชอบใส� book Mark

เอาไว�

Page 48: 08 W3 Browser

การบู�นื้ท0กแฟ้2มร�ป็ภาพิจาก การบู�นื้ท0กแฟ้2มร�ป็ภาพิจาก Web Web sitesite ใช�โปรแกรมูเบราว เซอร ว�%งไปย)ง Web site ท(%

ต�องการ เล�%อน์เมูาส พอยน์ เตอร ไปท(%ภาพท(%ต�องการแล�วคืล�ก

เมูาส ป9Aมูขวา จากน์)*น์เมูน์�จะปรากฏิ ให�คืล�กคื7าส)%ง Save Image

As เมู�%อไดอะล"อกบล"อกปรากฏิ ให�คืล�กโฟิลเดอร ท(%ใช�

เก"บไฟิล ร�ปภาพ จากน์)*น์คืล�กป9Aมู Save

Page 49: 08 W3 Browser

การบู�นื้ท0ก การบู�นื้ท0ก Web page Web page เก4บูเก4บูเป็�นื้ไฟ้ล�ไวิ"เป็�นื้ไฟ้ล�ไวิ" เร(ยกโปรแกรมูเบราว เซอร พ�มูพ ท(%อย�� Web site ท(%ต�องการ คืล�กเมูน์� File คืล�กคื7าส)%ง Save As เล�อกโฟิลเดอร ท(%ใช�เก"บไฟิล คืล�กป9Aมู Save เคืร�%องจะเก"บเป�น์แฟิ>มูท(%มู(

น์ามูสก9ลเป�น์ html หร�อ htm

Page 50: 08 W3 Browser

วิ�ธ์+เร+ยกด�ไฟ้ล� วิ�ธ์+เร+ยกด�ไฟ้ล� Web page Web page ท+)ท+)เก4บูไวิ"เก4บูไวิ" เร(ยกโปรแกรมูเบราว เซอร คืล�กเมูน์� File คืล�กคื7าส)%ง Open File เล�อกโฟิลเดอร (ไดเร"คืทอร()ท(%เก"บไฟิล เอา

ไว� คืล�กช�%อไฟิล Web page ท(%ต�องการอ�าน์ คืล�กป9Aมู Open

Page 51: 08 W3 Browser

วิ�ธ์+พิ�มพิ� วิ�ธ์+พิ�มพิ� Web pageWeb page

คืล�กเมูน์� File คืล�กคื7าส)%ง Print Preview คืล�กป9Aมู Zoom In เพ�%อด�รายละเอ(ยด

ของงาน์ คืล�กป9Aมู Print คืล�กป9Aมู OK

Page 52: 08 W3 Browser

การต�ดต��ง การต�ดต��ง WWW Home WWW Home PagePage จ�างศ�น์ย บร�การหร�อผ��เช(%ยวชาญ โดยสร�างเป�น์

Home Page ท(% WWW Site ของศ�น์ย บร�การ เช�น์

– http://www.inet.co.th/~seree– http://www.ksc.net.th

ต)*ง Web Site ข1*น์มูาเองส7าหร)บองคื กร– ต�อเคืร�อข�ายใน์องคื กรเป�น์โหน์ดของอ�น์เทอร เน์"ต– ต�ดต)*งโปรแกรมู WWW Server บน์โฮสต ของ

องคื กร

Page 53: 08 W3 Browser

จะใช"บูร�การ จะใช"บูร�การ WWW WWW จากท+)บู"านื้ได"จากท+)บู"านื้ได"อย างไรอย างไร??มู(บ)ญช(ผ��ใช�ท(%ศ�น์ย บร�การอ�น์เทอร เน์"ต

และหมูายเลขโทรศ)พท ท(%ศ�น์ย บร�การ เคืร�%องพ(ซ( โมูเด"มูและสายโทรศ)พท ท(%บ�าน์ ระบบปฏิ�บ)ต�การ Windows 95 โปรแกรมูบราวเซอร เช�น์ Netscape

Page 54: 08 W3 Browser

Web Site Web Site ท+)นื้ าสนื้ใจท+)นื้ าสนื้ใจHttp://www.hotmail.comhttp://www.disney.comhttp://www.whitehouse.comhttp://www.cnn.comhttp://www.microsoft.comhttp://www.khstar.com

Page 55: 08 W3 Browser

สร%ป็สร%ป็WWW เป4ดโอกาสทองทางธ์9รก�จใน์ร�ป

แบบใหมู�แหล�งข�อมู�ลข�าวสารมูหาศาลส7าหร)บบ9คืคืล

และองคื กร ท)*งภาคืร)ฐและภาคืเอกชน์จะได�ร)บประโยชน์

มูหาศาล โลกข�อมู�ลข�าวสารไร�พรมูแดน์

The new source of power is not money in the hands of the few, but information in the hands of the many.

--Jonh Naisbittt