ปฏิบัติการการพัฒนาออกแบบและการเขียนโปรแกรมเว็บเพจ

ปฎบตการการพฒนาการออกแบบและ

การเขยนโปรแกรมเวบเพจ

Webpage Design and Programming Workshop (7152306)

อ.สธารตน ชาวนาฟาง

สาขาวศวกรรมซอฟตแวร คณะวทยาศาสตรและเทคโนโลย

มหาวทยาลยราชภฎนครปฐม

บทท 1 เทคโนโลยอนเตอรเนตและเทคโนโลยทเกยวกบเวบเพจ

Webpage Design and Programming Workshop (7152306)

อาจารยสธารตน ชาวนาฟาง

สาขาวศวกรรมซอฟตแวร มหาวทยาลยราชภฏนครปฐม

ความหมายของอนเทอรเนต (Internet)

• หมายถงเครอขายคอมพวเตอรทเชอมตอกนเปนจ านวนมาก

ครอบคลมไปทวโลก อาศยโครงสรางระบบสอสารโทรคมนาคมเปน

ตวกลางในการแลกเปลยนขอมล

• โดยมขอก าหนดวาทกเครอขายทเชอมตอถงกนจะตองอยภายใต

มาตรฐานของการเชอมตอ TCP/IP

พฒนาการของอนเทอรเนต

• พฒนามาจาก ARPAnet ภายใตหนวยงานโครงการวจยขนสงของประเทศสหรฐอเมรกา

• ARPAnet ตงขนเพอสนบสนนงานวจยทางดานทหาร มการเชอมตอครงแรกป พ.ศ. 2512 โดยใชมนคอมพวเตอรเปนเครองคอมพวเตอรแมขาย (host) และมเครองคอมพวเตอรทใชระบบปฏบตการตางกน ตอมาแบงออกเปน เครอขายวจย และเครอขายกองทพ

พฒนาการของอนเทอรเนต (ตอ)

• ประเทศไทย เรมเชอมโยงเขาสระบบอนเทอรเนตตงแตป พ.ศ. 2532 โดยมหาวทยาลยสงขลานครนทรตอเชอมโยงเพอสงไปรษณย

อเลกทรอนกสกบประเทศออสเตรเลย

รปแบบเชอมตออนเทอรเนต

• การท างานอยภายใต HTTP • โดยโปรโตคอล จะเปนตวก าหนดวธการสงขอมล ระหวางเครอง

คอมพวเตอรทเปน Client และ Server

ชอและเลขทอยไอพ

• คอมพวเตอรทกเครองทตออยบนอนเทอรเนตจะม IP address ซงตองไมซ ากน และมการก าหนดชอแทนเลขทอยไอพ เรยกวา โดเมน

• เชน npru.ac.th มเลขทอยไอพ 203.108.2.71 ก าหนดใหมการใชระบบชอโดเมนมเปน npru.ac.th

ชอและเลขทอยไอพ (ตอ)


ประเภทของโดเมน

1. โดเมนเนมระดบบนสด (Top-Level Domains)

เปนการก าหนดชอใหมความหมายในการบอกประเภทของ

องคการหรอชอของประเทศ แบงออกเปน 2 ประเภท คอ

1.1 Organization Domains 1.2 Geographical Domains


1.1 Organization Domains คอโดเมนเนมระดบสงสดซงแสดงถงองคการ

Domain Name ความหมาย com เครอขายของเอกชน edu เครอขายของหนวยงานการศกษา gov เครอขายของหนวยงานรฐบาล mil เครอขายของหนวยงานทหาร net เครอขายของผใหบรการอนเตอรเนต org เครอขายขององคการทไมมงหวงก าไร


1.2 Geographical Domains คอโดเมนเนมระดบสงสด แบงตามลกษณะภมศาสตรหรอประเทศ

Domain Name ความหมาย au ออสเตรเลย ca แคนาดา cn สาธารณรฐประชาชนจน dk เดนมารก jp ญปน nz นวซแลนด th ไทย us สหรฐอเมรกา


โดยหลกทวไปของการจดตามนามสกลตาง สามารถแบงไดคราวๆ ดงน .com ส าหรบเวบไซตทเกยวกบธรกจการคา .net ใชกบเวบไซตขององคกรใดทท างานเกยวของกบ Internet หรอ Network .org ใชส าหรบเวบไซตองคกรทไมหวงผลก าไร .info ใชส าหรบเวบไซตทน าเสนอขอมลเปนหลก .co.th ส าหรบบรษททจดทะเบยนในไทย .in.th ส าหรบหนวยงานทกประเภท และบคคลทวไป .ac.th ส าหรบสถาบนการศกษ .go.th ส าหรบการใชของภาครฐบาล .net.th ส าหรบนตบคคลผไดรบใบอนญาตประกอบกจการโทรคมนาคม .or.th ส าหรบองคกรทไมแสวงผลก าไร .mi.th ส าหรบหนวยงานทางทหาร


2. โดเมนเนมในประเทศไทย ประเทศไทย ใช .th เปนโดเมนประจ าประเทศ

Domain Name ความหมาย or องคการไมแสวงผลก าไร ac สถาบนการศกษา go หนวยงานราชการ co หนวยงานเอกชน net องคการทใหบรการเครอขาย

การประยกตใชงานอนเทอรเนต

• ไปรษณยอเลกทรอนกส (Electronic Mail: E-mail) • การโอนยายแฟมขอมลระหวางกน (File Transfer Protocol: FTP) • การใชเครองคอมพวเตอรในทหางไกล (telnet) • การเรยกคนขอมลขาวสาร (search engine) • การอานจากกลมขาว (usenet) • การสนทนาบนเครอขาย (chat) • การบรการสถานวทยและโทรทศนบนเครอขาย

• การบรการบนอนเทอรเนต

อนเทอรเนตกบผลกระทบตอสงคมไทย

1. ผลกระทบทางดานบวก • สามารถไดรบความรและขอมลขาวสารมากยงขน

• ท าใหสามารถตดตอสอสารถงกนไดสะดวกและรวดเรว

• ไมตองเสยคาใชจายสง เปนตน

อนเทอรเนตกบผลกระทบตอสงคมไทย (ตอ)

2. ผลกระทบทางดานลบ • เยาวชนไดรบขอมลหรอภาพในทางทไมด และขอมลบางอยางกไมเหมาะกบ

เยาวชน

• ขอมลบางอยางอาจเปนขอมลเทจ อาจถกหลอกลวง

• อนเทอรเนตเปนระบบอสระ ไมมเจาของ ท าใหการควบคมกระท าไดยาก

• มขอมลทมผลเสยเผยแพรอยปรมาณมาก

• ไมมระบบจดการขอมลทด ท าใหการคนหากระท าไดไมดเทาทควร

• เปนสถานททใชตดตอสอสาร เพอกอเหตราย เชน การวางระเบด หรอลอลวง

ผอนไปกระท าช าเรา

• ท าใหเสยสขภาพ เวลาทใชอนเทอรเนตเปนเวลานานๆ

• เปนตน

เวบเทคโนโลย (Web Technology)

คอบรการรปแบบหนงของการใหบรการอนเตอรเนต

ส าหรบผพฒนาเวบหรอผทตองการเขยนโปรแกรม

เพอตดตอสอสารผานเวบหรออนเตอรเนต



1. Web 1.0 • การใชในยคตนๆ ยงไมเปนทแพรหลาย

• เปนการสงขาวสารกนในระหวางหนวยงานการศกษา (เนองจากโลก

ออนไลนยงอยในลกษณะวงจ ากด)

• มการแสดงเนอหาเปนขอความเปนหลกโดยมภาพนง (ขนาดเลก) เปน

สวนประกอบ การแสดงผลในขณะนนกยงคงตองใชเวลาคอนขางมาก

• การใชงานสวนใหญจะเปนในลกษณะของการรบสงขาวสารผานอเมล


1. Web 1.0

• เปนการสอสารทางเดยว (One-way Communication) หรอ “Read-Only” • ผเขาชมท าไดเพยงรบขอมลจากเนอหาของเวบไซตทางเดยวเทานน ไมม

โอกาสในการแสดงความคดเหน หรอมการโตตอบกนระหวางเจาของ

เวบไซตกบผเขาชมเวบไซตได


2. Web 2.0 • Web 2.0 ไดปฎวตจาก read only ไปสกระบวนการเผยแพรขอมล แสดง

ความคดเหนเพมเตมและรวมกนใหขอมล เพอใหเกดการตอบสนองตอ

ความตองการมากข น

• “Read – Write - Collaborate” ในยค Web 2.0 เปนการแบงปนความร แลกเปลยนความคดเหนซงกนและกน มากกวาทจะเปนเพยงการน าเสนอ

ขอมลผานเวบไซตเพยงอยางเดยว

• เชน การใหคะแนนเนอหา การแนะน าบทความใหกบผอน ฯลฯ


2. Web 2.0


3. Web 3.0 • มการปรบปรงและแกไข Web 2.0 เนองจากมเนอหาจ านวนมากซงสงผล คอ

ปญหาในการคนหาและเขาถงขอมล

• จงมความจ าเปนทจะตองหาแนวคดหรอวธการในการจดการขอมลใหเปน

ระบบและมการเชอมโยงถงกน โดยแนวคดดงกลาวนนเปนทมาของการ

พฒนาไปสยค Web 3.0 นนเอง


3. Web 3.0 • “Read – Write – Execute” เปนการคาดการณลกษณะของการแสดงเนอหา

และการโตตอบกนระหวางเจาของเวบไซต

• หรอ Web 3.0 คอ “Read – Write – Relate” สามารถหาความสมพนธและการเชอมโยง ขอมลตางๆ ได

• ผเขาชมเวบไซตสามารถอาน เขยน และท าการจดการเนอหาและปรบแตง

แกไขขอมลหรอระบบไดอยางอสระ


3. Web 3.0

• มการพฒนาใหกลายเปน Semantic Web ซงเปนการสรางเครอขายของขอมล

• มลกษณะของ Artificial intelligence (AI) ท าใหสามารถตอบสนองผใชงานไดอยางชาญฉลาด ซงสามารถเขาใจความตองการของผใชมากข น

• เชน Search Engine Google


4. Web 4.0 • หรอ “A Symbiotic web” คอเวบทท างานแบบ AI ทฉลาดมากยงข น • คอมพวเตอรสามารถคดได มความฉลาดมากข นในการอานทงเนอหา

ขอความ และรปภาพหรอวดโอ สามารถทจะตอบสนองหรตดสนใจไดวาจะ

load ขอมลอะไร จากไหน ทจะใหประสทธภาพดทสดมาใหผใชงานกอนกอน

• มรปแบบการน ามาแสดงทรวดเรว จะท าใหเวบหรอขอมลตางๆ สามารถ

ท างานไดแทบจะทก Device หรออาจจะชวยระบตวตนทแทจรงของผใชเอง

Education

ปฏิบัติการการพัฒนาออกแบบและการเขียนโปรแกรมเว็บเพจ