1

บทท 1

การเขยนโปรแกรมบนเครอขายอนเทอรเนต และมาตรฐานทเกยวของ

ลกษณะของการเขยนโปรแกรมจะสามารถแบงไดเปน 2 ประเภท คอ การเขยนโปรแกรมบนวนโดวส (Windows-Based Application) และการเขยนโปรแกรมเวบ (Web-Based Application) ซงในหนงสอเลมนจะไดกลาวถงเฉพาะการเขยนโปรแกรมบนเวบเทานน โดยลกษณะทสาคญกคอ การแสดงผลของโปรแกรมจะอยบนบราวเซอร (Browser) ผใชสามารถเขาถงไดผานทางเครอขายอนเทอรเนต ไมวาจะอยทไหน หรอจะเขาใชงานเมอไรกสามารถใชงานไดตลอดเวลา ซงเปนจดเดนททาใหโปรแกรมบนเวบมเหนอกวาโปรแกรมบนวนโดวส ระบบงานทางธรกจกเรมหนมาพฒนาในลกษณะโปรแกรมเวบมากขนอนเนองมาจากขอดดงกลาวนนเอง เนอหาในบทนจะกลาวถงความรพนฐานในการเขยนโปรแกรมบนอนเทอรเนตเพอทาใหผอานไดเขาใจลกษณะทางานของโปรแกรมกอนทจะเรมเขาสเนอหาของการเขยนโปรแกรม 1.1 หลกการท างานของ WWW

การท างาน World Wide Wed หรอ WWW จะมลกษณะเชนเดยวกบการท างานในลกษณะ ไคลเอ นต-เซรฟเวอร (Client-Server) คอ มลกษณะของการเชอมตอของเครองผใหบรการ (Server) และ เครองผใชบรการ (client) พจารณารปตอไปน

จากรปท 1.1 นการทา งานเรมจากเครองผขอใชบรการ (Client) ซงอาจจะเรยกวาเปนเครองลกทท า งานรองขอ (Request) ใชบรการจากเครองผใหบรการ (Server) ซงอาจจะเรยกวาเปนเครองแม หลงจากเครองผใหบรการทา การจดเตรยมขอมลหรอบรการตามทเครองผขอใชบรการไดรองขอมาก จะทา การตอบกลบ (Response) คนไปยงเครองของผขอใชบรการ โดยปกตเครองแมจะมอยเพยง เครองเดยว ในขณะทเครองลกอาจจะมไดหลาย ๆ เครอง และเครองลกหลาย ๆ เครองนกอาจจะ เขามาขอใชบรการจากเครองแมพรอมกนกได

ในส านกงานตางๆ ไดน าประโยชนของการท างานในลกษณะ Client-Server นไปใชจดการงานตางๆ ภายในส านกงาน พจารณารปตอไปน

2

จากรปท 1.2 เครองแมไดท าการเชอมตอกบเครองพมพ (Printer) ดงนนเครองแมนเราจะ เรยกวา

Print Server คอเปนเครองทใหบรการงานทางดานการพมพ กระบวนการท างานจะเรมตน จากเครองลก ทตองการพมพเอกสารจงไดท าการสงพมพจากเครองลกดงกลาว ขอมลทตองการพมพกจะถกสงมายงเครอง Print Server ซงกจะท าการพมพขอมลออกทางเครองพมพ ขอดของการเชอมตอในลกษณะนกคอ ใน ส านกงานนนกเพยงแตจดหาเครองพมพ 1 เครองเชอมตอกบเครองคอมพวเตอรทจะใชเปน Print Server เมอพนกงานภายในบรษทตองการสงพมพเอกสารใดๆ กสามารถสงงานทเครองลกไดเลย ประหยดงบประมาณทจะตองทา การจดหาเครองพมพใหกบพนกงานทกๆคน

พจารณาตวอยางของการท างานแบบ Client-Server อกตวอยาง ดงรปตอไปน

จากรปท 1.3 กเปนอกตวอยางของการท างานในลกษณะ Client-Server โดยเครองแมท าหนาท

จดเกบขอมลตางๆ ทงหมดของบรษทไวในฐานขอมล ดงนนเครองแมนเรากจะเรยกวา Database Server การท างานกจะเรมจากเครองลกเชนเดยวกน คอ เครองลกอาจจะท าการเพม ลบ แกไข หรอดงขอมลซงจดเกบไวทฐานขอมล ขอดของการเชอมตอแบบนกคอ การจดการขอมลตางๆซงถกจดเกบไวเพยงทเดยวท าใหขอมลมความเปนหนงเดยว (Uniqueness) คอขอมลไมกระจดกระจายและมความถกตอง

จากทง 2 ตวอยางของการท างานของ Client-Server ล าดบถดไปจะกลาวถงลกษณะของการท างานของ WWW ซงกจะมลกษณะการท างานเหมอนกบ 2 ตวอยางทไดอธบายไปแลว พจารณารปตอไปน

3

จากรปท 1.4 เครองแมในทนจะใหบรการตางๆ ทเกยวกบเวบทงหมด ไฟลเวบเพจ รปภาพ หรอ โปรแกรมเวบตาง ๆ จะถกจดเกบไวในเครองนซงเราจะเรยกเครองนวา Web Server สวน เครองลกซงเปนเครองทขอใชบรการเราจะเรยกวา Client เนองจากการแสดงผลจะถกแสดงบน บราวเซอร เชน Internet Explore หรอ URL (Universal Resource Locator) จากโปรแกรม บราวเซอร ซงขอมลจะถกกระทา ผานโปรโตคอล HTTP (Hypertext Transfer Protocol) เครอง Web Server เมอไดรบคา รองขอกจะทา การจดสงหนาเวบเพจนนผานไปทาง Web Browser

1.2 ประเภทของโปรแกรมบนเวบ ในการเขยนโปรแกรมบนเวบสามารถทจะแบงลกษณะการท างานของโปรแกรมไดเปน 2 ประเภท คอ

1. Static Programming 2. Dynamic Programming

Static Programming เปนลกษณะของโปรแกรมบนเวบทไมคอยมการเปลยนแปลง เชน เวบ

ประวตสวนตว, เวบน าเสนอประวตและโครงสรางขององคกร เปนตน ลกษณะเวบประเภทนเมอผพฒนาเวบสรางเวบขนมาแลวหากตองการทจะท าการแกไขขอมลบางอยางนนกจะตองใชโปรแกรมในการสรางเวบเพจ เชน Adobe Dreamweaver, Microsoft FrontPage เปนตน เปดไฟลของหนาเวบนนแลวจงท าการแกไขขอมลทตองการ เมอเสรจแลวกตองท าการบนทกไฟดงกลาว และท าการอพโหลดไฟลขนไปเกบไวท Web Server จะเหนวาลกษณะของโปรแกรมบนเวบประเภทนจะไมมความยดหยนในการจดการ และสรางความยงยากใหแกผพฒนาเวบเพจดวย

ในการพฒนาโปรแกรมบนเวบประเภทนผพฒนาโปรแกรมเพยงแคจดหาเครองคอมพวเตอรและท า การตดตงซอฟตแวรทจะท า ใหเครองคอมพวเตอรเครองนเปนเครองแม (Web Server) เทานน และในการพฒนาโปรแกรมบนเวบ ผพฒนากไมตองมความรในการเขยนโปรแกรม กได เพยงแคสามารถเขยนเวบเพจโดยใชโปรแกรมทใชสรางเวบเพจกเพยงพอแลว

ลกษณะการท างานของโปรแกรมบนเวบประเภทนมลกษณะดงรปตอไปน

4

Dynamic Programming เปนลกษณะของโปรแกรมบนเวบทเกดขนมาเพอแกปญหาความ ไมยดหยนในการจดการขอมลของ Static Programming โดยเหมาะสมส าหรบเวบทตองมการ เปลยนแปลงขอมลอยบอยครงหรอเวบทมการจดเกบขอมล จ านวนมากไกภายในฐานขอมล เชน เวบหนงสอพมพ, เวบแสดงรายละเอยดของสนคา เปนตน

ในการพฒนาโปรแกรมบนเวบประเภทนจะตองอาศยผพฒนาโปรแกรมทมความร ความสามารถในการเขยนโปรแกรม นอกจากนนในสวนของซอฟตแวรทตองตดตงกประกอบไป ดวยซอฟตแวรทใชในการท า ใหเครองคอมพวเตอรมความสามารถเปนเครอง Web Serve, ซอฟตแวรทใชในการแปลโปรแกรมภาษาและฐานขอมล

พจารณาลกษณะการท างานของโปรแกรมเวบประเภทนดงรปตอไปน

จากรปท 1.6 โปรแกรมกจะเรมกระบวนการท างานจากเครองลกท าการรองขอเวบเพจ ซงเวบเพจท

รองขอไดมการเขยนโปรแกรมบนเวบในลกษณะ Dynamic Programming ได ดงนนท เครองแมกจะท าการเรยกซอฟตแวรและโปรแกรมภาษาขนมาเพอแปลโปรแกรมภาษา (Programming Language) ใหเปนภาษาเครอง (Machine Language) เนองจากเครองคอมพวเตอร จะเขาใจเฉพาะภาษาเครองเทานน ถาโปรแกรมทเขยนขนมค าสงทท าการจดการฐานขอมลกจะท า การ เพม ลบ แกไข หรอดงขอมลจากฐานขอมล ซงโดยปกตตวฐานขอมลนจะอยภายในเครองแม หรออาจจะแยกออกมาเปนเครองคอมพวเตอรอกเครองกไดหลงจากนนขนตอนสดทายหลงจากเครองแมท าการประมวลผลเสรจเรยบรอยแลวกจะท าการสงขอมลผลลพธกลบในลกษณะ HTML กลบไป ยงเครองลก หรอเครองทท าการรองของนนเอง

สรป การท างานของ WWW จะมลกษณะเชนเดยวกบการท างานในลกษณะไคลเอนต-เซรฟเวอร (Client-

Server) คอมลกษณะของการเชอมตอของเครองผใหบรการ (Server) และเครองผใชบรการ (Client) ในส านกงานตาง ๆไดนาประโยชนของการทางานในลกษณะ Client-Server นไปใชจดการงานตาง ๆ ภายในส านกงาน เชน Client-Server ในลกษณะของ File Server, Print Server และ Web Server

5

ในการเขยนโปรแกรมบนเวบสามารถทจะแบงลกษณะการท างานโปรแกรมไดเปน 2 ประเภท คอ Static Programming, Dynamic Programming โดย Static Programming เปนลกษณะของโปรแกรมเวบทไมคอยมการเปลยนแปลง เชน เวบประวตสวนตว, เวบนาเสนอประวตและโครงสรางขององคกร เปนตน สวน Dynamic Programming เปนลกษณะของโปรแกรมบนเวบทเกดขนมาเพอแกปญหาความไมยดหยนในการจดการขอมลของ Static Programming โดยเหมาะสาหรบเวบทตองมการเปลยนแปลงขอมลอยบอยครงหรอเวบทมการจดเกบขอมลจ านวนมากไวภายในฐานขอมล เชน เวบหนงสอพมพ, เวบแสดงรายละเอยดของสนคา เปนตน

โปรแกรมภาษา PHP ซงยอมาจากค าวา Personal Home Page ขอดของภาษา PHP มดวยกนหลายขอ เชน เปนโปรแกรมภาษาทสามารถดาวนโหลดไดฟรไมมปญหาเรองลขสทธ , มการแปลภาษาและท าการประมวลผลไดอยางรวดเรว, สามารถท างานไดทงบนระบบปฏบต Windows, Unix, Linux และ Macintosh เปนตน กอนทจะเรมลงมอเขยนโปรแกรมภาษา PHP จะตองเตรยมการตาง ๆ คอ เครองคอมพวเตอรอยางนอย 1 เครอง, ระบบปฏบตการ, โปรแกรม Web Server, PHP Engine, โปรแกรมฐานขอมล, PhpMyAdmin, โปรแกรม Web Authoring และ Editor

1.3 ความรทวไปเกยวกบการออกแบบเวบไซต

โครงสรางระบบเวบ ในระบบเวบนนมโครงสรางการท างานหลายล าดบชนดวยกน หากน ามาเขยนเปน Flow chart แลวนาจะสรปไดรปดงตอไปน

6

โครงสรางระบบเวบ ประกอบไปดวยสวนตางๆ ดงน Web Hosting

เวบโฮสตตง คอผใหบรการรบฝากพนทเกบเวบ สามารถแบงไดสองลกษณะคอ 1. Free Web Hosting เปนเวบโฮสตตงทเปดใหบรการฟร สวนใหญจะมขอจ ากดในการใชงาน

Geocities.com, Cafe150.com, Myfreewebs.net, Myjavaserver.com, 6te.net 2. Commercial Web Hosting เปนเวบโฮสตตงทเปนรปแบบบรษท ทเปนรปแบบเชงการคา

โดยเฉพาะ เชน Hostpacific.com, Ecomsiam.com, Bythailand.com, Hosting.co.th, Porar.com, Chaiyohosting.com, Idc.cattelecom.com โดยผใหบรการเวบโฮสตงในปจจบนมอยางหลากหลาย ขนอยกบวาเราน าเครองเซรฟเวอรไปฝากไวทใด ตวอยางผใหบรการเวบโฮสตงและรบฝากโฮสตตง อาท เชน การสอสารแหงประเทศไทย (CAT), ศนยบรการอนเทอรเนต (ISP), องคกรธรกจ (Office), บาน บานเชา หอพก (Home), สถาบนการศกษา (School, University)

Web Server เวบเซรฟเวอร คอเครองเซรฟเวอรทเกบขอมลตางๆ ของผใชบรการโดยผใหบรการจะตองท าการตดตงโปรแกรมเวบเซรฟเวอรลง บนเครองเซรฟเวอร อาท Apache, IIS, Tomcat, Lighttpd, Zeus โดยโปรแกรมเวบเซรฟเวอรทนยมใชงานในปจจบนสามารถจ าแนกตามประเภทของ ระบบปฏบตการเครอขายได 3 ชนดคอ 1. Windows Server (Windows 2000 Server, Windows Server 2003) 2. Linux Server (RedHat, Fedora, Slackware, CentOS, Debian, Ubuntu, SuSE, Mandriva, Linux-SIS) 3. BSD Server (FreeBSD, OpenBSD, NetBSD)

Web Browser เวบบราวเซอร คอโปรแกรมทใชเรยกเปดใชงานเวบ ตวอยางเวบบราวเซอรทนยมใชงานในปจจบน อาทเชน - Internet Explorer - Mozilla Firefox - Opera - Safari - Google Chrome

Web Site

เวบไซต เปนชอทใชเรยกแทนหนวยงาน องคกร หรอชอผท าเวบไซต ตวอยาง เชน www.kapook.com, www.northbkk.ac.th, www.webmaster.or.th, www.cmsthailand.com, www.Arnut.com, www.dsd.go.th

Home Page โฮมเพจ เปนหนาแรกของเวบไซตเปรยบไดกบหนาปกหนงสอ โดยปกตชอไฟลโฮมเพจจะตงโดยใชชอวา index หรอ default ทงนขนอยกบภาษาทใชพฒนา อาท เชน - index.html, index.htm, default.html กรณพฒนาดวยภาษา HTML

7

- index.shtml กรณพฒนาดวย SSI - index.php กรณพฒนาดวยภาษา PHP - index.asp, default.asp กรณพฒนาดวยภาษา ASP - index.aspx, default.aspx กรณพฒนาดวยภาษา ASP.NET - index.jsp กรณพฒนาดวยภาษา JSP, Servlet - index.cgi, index.py กรณพฒนาดวยภาษา PYTHON - index.cgi, index.pl กรณพฒนาดวยภาษา PERL

Web Page เวบเพจ เปนหนาอนๆ ของเวบไซต การตงชอไฟลจะขนอยกบภาษาทผใช ใชในการพฒนา อาทเชน history.php, structure.php, symbol.php, map.php, contact.php

ตวอยางภาษาทใชในการเขยนโปรแกรมบนอนเทอรเนต

1) ภาษา JAVA JAVA คออะไร?JAVA คอ ภาษาทใชเขยนโปรแกรมชนดหนง ซงในความจรงแลวยงมอกหลายภาษา

ทใชฝกหดการเขยนโปรแกรมไดเชนเดยวกน ยกตวอยางเชน C, C++, COBOL, Delphi, Pascal, Visual Basic, Ruby และ Small Talk ฯลฯ โดยโครงสราง (Structure) และไวยกรณ (Syntax) ของ JAVA จะมลกษณะทคลายคลงกบภาษา C++ แตตดค าสงทยงยากออกไป ดงนนผเรยนทเคยศกษาภาษา C หรอ C++ มากอนจะสามารถท าความเขาใจการเขยนโปรแกรมในภาษา JAVA ไดไมยาก สวนรายละเอยดดานอนๆ ของ JAVA คอ JAVA ถกคดคนและสรางโดย บรษท Sun Microsystems ซงเปนบรษทผขายระบบ Unix (โดยจ าหนายทง Hardware และ Software) ทมชอวา Solaris ซงจดเดนของภาษา JAVA อยทผเขยนโปรแกรมสามารถใชหลกการของ Object-Oriented Programming มาพฒนาโปรแกรมของตนดวย JAVA ไดคะ ภาษา java แตกตางจาก ภาษา C++ อยางไรภาษา java ตางจาก ภาษา C++ ในหลกการท างานของภาษา ในภาษา java source code จะ ถก compile เปน byte code (Intermediate code) ซง byte code เหลาน จะถก interpret เปน machine code และท างานบน virtual machine อกครงในขณะท างาน ในขณะทภาษา C++ source code จะถก compile เปน machine code เลย

คณลกษณะเดนของภาษา Java- ภาษา Java เปนภาษาทสนบสนนการเขยนโปรแกรมเชงวตถแบบสมบรณ- โปรแกรมทเขยนขนโดยใชภาษา Java จะมความสามารถท างานไดในระบบปฏบตการทแตกตางกน ไมจ าเปนตองดดแปลงแกไขโปรแกรม เชน หากเขยนโปรแกรมบนเครอง Sun โปรแกรมนนกสามารถถก compile และ run ไดบนเครองพซธรรมดา- เมอเปรยบเทยบ code ของโปรแกรมทเขยนขนโดยภาษา Java กบ C++ พบวา โปรแกรมทเขยนโดยภาษา Java จะมจ านวน code นอยกวาโปรแกรมทเขยนโดยภาษา C++ ถง 4 เทา และใชเวลาในการเขยนโปรแกรม นอยกวาประมาณ 2 เทา- Java ม security ทง low level และ high level ไดแก electronic signature, public and private key management, access control และ certificates

ซงจะกลาวสรปไดโดยรวมถง ขอดของ java คอ java สามารถ ท างานไดกบทกระบบปฏบตการ โดยอาศยตวกลาง แตขอเสยของ java คอ ชา ดงนน ทานจะสงเกตเหนการใช java ภาษา java เปน ภาษาทนยมกนอยางแพรหลายในการเขยนเวบ

8

2) ภาษา HTML

HTML คอ ? ส าหรบภาษา HTMLนนยอมาจากค าวาHyper Text Markup Language หรอเอกสารทเราเหนกนอย browser นนเอง จดเดนทส าคญทสดของ HTML นนกคอ ความสามารถในการเชอมโยง ขอมลไปยงเอกสารอนได เปนเอกสารทมความสามารถมากกวาเอกสารทวไป และมความสามารถ แบบHypertext คอ สามารถเปดดไดโดย เทกซอดเตอรใดๆ สวนการเชอมโยงขอมลไปยง เอกสารอนๆนน สามารถท าไดโดยการใสสญลกษณพเศษเขาไปในเอกสาร(markup)หรอทเรยกวา แทก(Tag) ซงจะถกอานโดยโปรแกรมเวบบราวเซอรตางๆ เชน IE หรอ Netscape ,Opera ฯลฯ ซงภาษาhtmlนนมรากฐานมาจากภาษาSGML(Standard General Markup Language)ซงเปน อกภาษาหนงทใชในการใชงานอนเตอรเนตในระยะแรกๆ และตอมากไดมการพฒนาภาษาHTMLอย ตลอดเวลา จนกระทงปจจบนนเปนHTML4.แลว ความจรงแลวHTMLนนกไมถงกบเปนภาษา หนงเพราะขาดคณสมบตหลายๆอยาง และภาษา HTML เปนภาษาทมลกษณะของโคด กลาวคอ จะเปนไฟลทเกบขอมลทเปนตวอกษรในมาตรฐานของรหสแอสก (ASCII Code) โดยเขยนอยในรปแบบของเอกสารขอความ จงสามารถก าหนดรปแบบและโครงสรางไดงาย เครองมอพฒนาเวบลกษณะนนบเปนเครองมอพนฐานทสด โดยจะอาศยโปรแกรม Text Editor ตางๆ ทมกตดตงมาพรอมกบระบบปฏบตการ (Operating System; OS) เชนQEdit, Editor, NotePad, WordPad, vi editor, pico editor, SimpleText เปนเครองมอลงรหสสง HTML หรอ ภาษาอนๆ ตามแตลกษณะของเวบทตองการน าเสนอ โดยผพฒนาจะตองมความรเกยวกบการใชงานโปรแกรมเหลาน ความรเกยวกบภาษาพฒนาเวบตางๆ รวมทงความคดจนตนาการ ทตรงกบแผนการพฒนาทก าหนดไวกอนหนา เนองจากผพฒนาจะไมสามารถเหนผลลพธของเวบไดทนทคะแมในปจจบนจะมโปรแกรมชวยเหลอในการพฒนาเวบออกมาอยางมากมาย แตนกพฒนาเวบระดบมออาชพสวนมากกยงเลอกทจะใช Text Editor กลม นอย เนองจากความคนเคยในการลงรหส ความสะดวกในการเรยกใชงาน และแกไขเอกสาร ความสามารถในการควบคมการจดต าแหนงเอกสารเพอการแกไขในภายหนา และทส าคญทสดกคอ ภาษา HTML รวมทงภาษาพฒนาเวบอนๆ ยงมการพฒนาค าสงอยตลอดเวลา การพฒนาเวบดวยวธน จงสามารถลงรหสค าสงใหมๆ ไดตามตองการ ในขณะนโปรแกรมพฒนาเวบอนๆ อาจจะยงไมรจกค าสงใหมๆ เหลาน

แตอยางไรกตามวธน กไมเหมาะส าหรบ ผพฒนาในระดบตน เพราะตองศกษาค าสง HTML และใชเวลาในการพฒนาพอสมควร ในแตละหนาเวบ ตลอดจนไมเหนผลลพธ จากการปอนค าสงทนท ตองเรยกผานโปรแกรมเบราเซอรอกท

3) ภาษา PL /SQL SQL/PL คอ ? PL ยอมาจาก Procedural Language เปนภาษาท Oracle พฒนาขน เพอใหผใช

สามารถพฒนาโปรแกรม ในลกษณะ procedure ได โดยในขณะเดยวกนยงคงสามารถใชค าสง SQL ไดเชนเดม ลกษณะค าสงภาษา SQL จะเปนการสงทละค าสงเดยว แลวใหผลลพธทนท

ขอดของภาษา PL/SQL 1. Control flow การท างานในโปรแกรมไดดวยค าสงตาง ๆ เชน IF statement, Loop ตาง ๆ 2. การเขาถงขอมล สามารถท าไดงายดวยค าสง SQL ธรรมดา

9

3. Portability คอ เขยนโปรแกรมครงเดยว สามารถ port ขาม platform ไดถาตองการยายเครอง ไมจ าเปนตองเขยนใหม สามารถเอา source code เกามาใชไดเลย

4. Tools ตางๆ ของ oracle ใชภาษา PL/SQL ในการเขยนโปรแกรม ท าใหผพฒนาไมตองเรยนร หลายภาษา เพยงแคเรยน PL/SQL อยางเดยว กสามารถพฒนา applications ดวย oracle tools ไดเลย (แตตอง เรยนร features ของ tools นน ๆ เพมเตม)

5. ใชตวแปรได 6. Handle exception ได (exception = error ทเกดระหวางการท างานในโปรแกรม) เชน การหาร

ดวย 0 การน า PL/SQL ไปใชงาน 1. เขยนในรปแบบของ Anonymous Block [DECLARE variable_declaration ;]

BEGIN executable - code ; END; 2. ใชพฒนาเปน Sub Program ส าหรบเรยกใชไดม 3 ลกษณะ 2.1 PROCEDURE เปนโปรแกรมยอยทท างานอะไรบางอยาง โดยสามารถรบ parameter มา

ท างานได 2.2 FUNCTION เปนโปรแกรมยอยทนยมใช เพอหาคาอะไรบางอยาง แลวคน กลบมาเปนชอของ

ตว function เอง 2.3 PACKAGE เปนการรวบรวม PROCEDURE หรอ FUNCTION หลาย ๆ ตว ถาไวดวยกน เพอ

งายตอการควบคมในแง privilege และเปนหมวดหมดขน

ส าหรบภาษา PL/SQL นสวนใหญจะน าไปใชในการท างานในการเกบขอมลทคอนขางทจะมขนตอนเยอะ เพราะ PL/SQL นถกพฒนาขนมาใหสามารถใชงานไดงาย สะดวกและรวดเรว

1.4 ยคของการพฒนาเวบไซต เทคโนโลยส าหรบการพฒนาเวบนน อาจแบงออกไดเปน 3 ยคดวยกน นนกคอ ยคท 1 Static Web เปนการเขยนเวบไซตแบบธรรมดา ใชบราวเซอรเรยกเวบเพจทสรางดวยภาษา HTML ลวนๆ หรออยางมากกมสครปตทางฝงไคลเอนต (Client-side Script) อยาง JavaScript, VBScript หรอใชภาษา Java Applet ซง Static web สวนมากนยมในหมนกเรยนนกศกษาในการสรางโฮมเพจสวนตว หลงจากท าเสรจจะท าการอปโหลดขอมลไปยงเวบไซตทใหบรการพนทเกบ เวบฟร เชน www.geocities.com, www.Thai.net ยคท 2 Dynamic Web พฒนาตอมาจากยคท 1 มการใชสครปตทางฝงเซรฟเวอร (Server-side Script) มาชวยในการเพมความสามารถของเอกสาร HTML ในการตดตอกบองคประกอบอนๆ ทางฝงเซรฟเวอร อยางฐานขอมล หรออาศยพลงในการประมวลผลของเวบเซรฟเวอรเพอท างานบางอยาง เชน Web board, Guestbook, Chat Room, Webmail เทคโนโลยในการพฒนาเวบแบบไดนามกในชวงแรกคอ CGI (Common Gateway Interface) ภาษาทใชเขยนสครปตนเชน C, Perl เปนตน ตอมาไดมเทคโนโลยตางๆ เกดขนมาอกมากมาย ซงท างานในฝงของเซรฟเวอรเชนเดยวกบ CGI นนกคอ ASP (Active Server Pages) ของไมโครซอฟต, JSP (Java Server Page) ทใชภาษา Java ในการพฒนา และ PHP (PHP Hypertext Preprocessor) ซงเปนเทคโนโลยทไดรบความนยมอยางแพรหลายในปจจบน

10

ยคท 3 Web Service เปนรปแบบการบรการยคใหมในวงการเวบ ตวอยาง Web Service เชน Microsoft Passport ทใหบรการตรวจสอบความเปนตวตนจรง (Authentication) ผานเวบ ภาษาทใชเปนตวกลางในการพฒนา Web Service คอ XML (extensible Markup Language) IBM ไดนยามความหมายอยางเปนทางการของ Web Services วา Web Services คอ Web Application ยคใหมทประกอบดวยสวนยอยๆ ทมความสมบรณในตวเอง สามารถตดตง คนหา เรมท างานไดโดยผานหนาเวบ Web Services สามารถท าอะไรกไดตงแตงานงายๆ เชน ดงขอมล จนถงกระบวนการทางธรกจทซบซอน เมอ Web Services ตวใดตวหนงเรมท างาน Web Services ตวอนกสามารถรบรและเรมท างานไดอกดวย

แสดงการเปรยบเทยบระหวาง Static และ Dynamic Web Site

ลกษณะภาษาสครปต ทใชการพฒนาโปรแกรมบนเวบ สามารถแบงได 2 แบบดวยกนคอ - Client-Side Script เปนลกษณะของภาษาทท างานอยบนเครองผใช เชน HTML, JavaScript, VBScript, JScript - Server-Side Script เปนลกษณะของภาษาทท างานบนเครองเซรฟเวอร เชน CGI, ASP, ASP.NET, PHP, JSP, PSP (Python Server Page)

โปรแกรมฐานขอมลทนยมใชบนเวบ - MS Access - MS SQL Server - MySQL

11

- PostgreSQL - mSQL

เครองมอในการสราง & ตกแตง ภาพกราฟกส าหรบเวบ - Adobe Photoshop + Image Ready - Adobe Illustrator - Macromedia Firework MX - Macromedia Flash MX - Corel Draw

เครองมอในการสรางภาพเคลอนไหวส าหรบเวบ - Macromedia Flash - Ulead GIF Animator - SWiSH, SWiSH Max - Xara 3D - Java Applet

โปรแกรมเอดเตอรทใชในการพฒนาเวบ - Edit Plus < PHP, JAVA, HTML - ASPedit < ASP - Web Matrix < ASP.NET, C# - Visual Studito.NET < VB.NET, ASP.NET, C# - Netbeans < JAVA, JSP

เทคโนโลยในการพฒนา Web Application เทคโนโลย / ภาษาทใชพฒนา :: CGI (Common Gateway Interface) / C, C++, Shell Script, Perl, Python, Tcl, Ruby :: ASP (Active Server Page) / VBScript, JScript :: PHP (PHP Hypertext Preprocessor) / PHP Script :: JSP (Java Server Page) / JAVA :: ASP.NET (Active Server Page.NET) / VB.NET, C#, J#

แนวทางในการพฒนาเวบไซต ในปจจบนเครองมอทใชในการพฒนาเวบจะมอย 2 ลกษณะคอ 1. เครองมอประเภท Text Editor เครองมอประเภทนผสรางเวบเพจจะตองรไวยากรณของภาษา ทจะน ามาพฒนา ตวอยางเครองมอประเภทนเชน - ระบบ Windows -> Notepad, Notepad ++, WordPad, EditPlus, NetObject ScriptBuilder, CuteHTML, HotDog, HomeSite - ระบบ Unix, Linux -> Pico, Vi , Emace, ee

12

2. เครองมอชวยสรางเวบแบบส าเรจรป (Web Builder) เครองมอประเภทนผสรางเวบไมจ าเปนตองรแทก HTML กสามารถพฒนาเวบเพจ เปนของตวเองได ดวยเวลาอนรวดเรว ตวอยางเครองมอประเภทน - Macromedia Dreamweaver (นยมมากสด) - Microsoft FrontPage - Adobe Golive - NetObject Fution - Namo Web Editor

3. ใชระบบ CMS (Content Management System) ชวยในการสรางเวบ ตวอยางระบบ CMS เชน PHP-Nuke, PostNuke, Mambo, Joomla!, XOOPS, Modx, Plone, WordPress, Drupal, ฯลฯ (ในคมอเลมนจะแนะน าการสรางเวบดวยวธน)

13

14

มาตรฐานการพฒนาเวบไซต (Web Standard) จากแนวความคดของ WWW ทตองการใหทกคนสามารถจะรบสงขอมลถงกนได โดยไมตองค านงวา

เขาจะใชระบบอะไร เครองอะไร หรออยในโลกใด แตแนวความคดนตองเผชญกบการทาทายจาก Netscape Navigator โดยในตนป 1994 Netscape ไดน าเสนอโปรแกรมทมฟงกชนเพมเตมมากมาย เพอเพมประสทธภาพในการจดการกบเพจ แตความสามารถทเพมขนมานจะใชไดกบเฉพาะ Web Browser ทมฟงกชนสนบสนนเทานนท าใหนกออกแบบเวบเพจไดแตกเปน 2 กลม กลมหนงไมเหนดวยเพราะฟงกชนใหมๆ เหลานจะใชไดเฉพาะกบเบราเซอร Netscape เทานน

ถาหากน าเวบเพจทออกแบบดวย Netscape ไปใชในเบราเซอร Lynx ซงเปน Text-Mode เวบเพจทปรากฏอาจจะดไมรเรองกได แตอกกลมหนงทสนบสนนกเหนวาเปนการเพมสสน และความเขาใจใหกบหนาเวบเพจ และกเปนสทธของผใชทจะเลอกWeb Browser ชนดไหนกได เพอเจะดเวบเพจทมเทคนคเฉพาะตวเชนน ถงแมวาผพฒนาWeb Browser ไมวาจะเปน Netscape และ Internet Explorer จะยอมรบในหลกการพนฐานของ HTML แตทงสองบรษทกยงคงแขงขนในการเพมความสามารถพเศษ และลกเลนในโปรแกรมของตนเอง ซงอยนอกเหนอไปจากมาตรฐาน HTML ทก าหนดไวเดม ตวอยาง เชน ค าสง BLINK ของ Netscape มผลใหขอความกะพรบ และค าสง MARQUEE ทใหขอความไหลวงได ทเปนเชนนเพราะทง Netscape และ Microsoft ตางกตองการจะครองสวนแบงของตลาดใหมากทสด ตางฝายกตางพฒนาWeb Browser ของตนใหมความสามารถทอกฝายไมม ถาหากการแขงขนยงเปนเชนนตอไป พฒนาการของเวบอาจจะไปไดไมไกล สงผลรายโดยตรงตอผเขาใชงาน ทจะตองสบเปลยน Web Browser ในการเขาถงขอมลตางๆ นนเปนสถานการณคอนขางรายแรง จงมการสรางเกณฑมาตรฐาน ทเรยกวา Web Standard ซงถกก าหนดโดยองคกรกลาง เพอวางมาตรฐานใหเปนสากล

Web Standard คอ เทคโนโลยทถกก าหนดขนเพอให Web Browser ในทกคาย ทกรน รองรบเทคโนโลยนรวมกนใหเปนมาตรฐานหลก ทสามารถเปดใชงานหนาเอกสารเวบไดสมบรณและมประสทธภาพ เชนเดยวกน อาจจะมค าถามวา ท าไมตองม มาตรฐานเวบ

จากการทโลกเรมมการใช เวบ Browser เปน Application ในการเขาถงขอมลเอกสารเวบในโลกออนไลน ทเมอกอนในแตละ Browser (ไมวาจะเปน IE, NetScape, Opera, Firefox, Google Chrome และอนๆอก) ตางคนตางพฒนา ตางแยงกนพฒนาเทคโนโลยใหม เพอหวงครองสวนแบงผใช (แตเดมในอดตจะพบวา

15

Browser เปน Applicationทตองซอหามาตดตง)สงผลใหการแสดงผลในแตละ Browserมสภาพทแตกตางกน เกดผลเสยตอผใชทจะเขาถงขอมลในเวบทกเวบไซต หรอทก browser แมกระทงในทก device ทเปดใชงาน

web standard จะม 2 มาตรฐาน คอ 1. W3C (World Wide Web Consortium) Standards กอตงเมอ 1994 เรมตนในการก าหนด

มาตรฐาน html, xml xhtml และ css

W3C หรอ World Wide Web Consortium เปนองคกรระหวางประเทศทท างานดานการพฒนาเทคโนโลยเวบ น าโดยนาย ทม เบรนเนอร ล (Tim Berners-Lee) กอตง W3C ในป ค.ศ.1994 และมองคกรสมาชกมากกวา 450 องคกร ซงรวมถงองคกรอยาง Microsoft, Sun Microsystems และอน ๆ อกมากมาย องคกรนประกอบดวยสถาบน 3 สถาบนคอ MIT ในสหรฐอเมรกา INRIA ในยโรป และ Keio University ในญปน

มาตรฐานของ W3C มอะไรบาง 1. HTML 5.0 : Hyper Text Markup Languageมาตรฐานใหมของภาษา code ทดสน เปนระบบ

มากกวา 4.0 2. SVG 1.1 (Scalable Vector Graphic) 2nd editionภาษาค าสงในการสรางภาพเชงเสน กราฟ

ในรปแบบทางกราฟก 3. CSS3 : Cascading Style Sheetsภาษาค าสง ทสามารถก าหนดคณลกษณะการแสดงผล การตง

คาฟอนต เทคนคพเศษตางๆ 4. DOM : Document Object Model เปนภาษา ในลกษณะค าสงการบรหารจดการแสดงผล 5. Navigation Timing 6. Web Application 7. JavaScript

จดพเศษกคอ HTML 5 ไดพฒนากาวขามขอจ ากดภาษาค าสงไมวาจะเปน XML หรอ XHTML รวมถงไฟล flash สนองตอบในการแสดงผลไดสมบรณโดยไมตองพงพา plug in ใดๆ ผลจากการประกาศ Web Standard ใหม สงผลให Browser จากแบรนดตางๆ ตองท าการปรบ เวอรชนใหม เพอรองรบมาตรฐานน ซงแมจะพงเรมมการใชในบางสวนของมาตรฐานซง Browser หลายรายยงมปญหาในหลายๆดานจากมาตรฐานน

16

ประโยชนทจะไดรบจากการท าตามมาตรฐานเวบ

1. ประโยชนตอซอฟตแวรหรอเครองจกร Search engine สามารถคนหาและท าดรรชนขอมลในเวบไดงายและมประสทธภาพมากขน

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

นกพฒนาทใชมาตรฐานจะสามารถตรวจสอบความถกตองของเอกสาร (validate) ดวยเครองมอทมมากมายในอนเทอรเนตได ซงชวยใหการคนหาขอผดพลาดในเวบของเราไดงายขน

เอกสารทไดมาตรฐานสามารถแปลงไปเปนเอกสารแบบอนไดงาย ท าใหเอกสารนน ๆใชงานไดหลายประโยชนขน

2. ประโยชนตอผใช ผทใชบราวเซอรอน ๆ ทแตกตางไปจากบราวเซอรทว ๆ ไปทเราคนเคยสามารถใชงานเวบของเราได

เชน คนตาบอดทใชบราวเซอรเบรลลหรอ Braille display คนทใชอปกรณพกพาตาง ๆ หรออปกรณอน ๆ ทอาจมในอนาคต ฯลฯ

ส าหรบการท าธรกจแลว การปฏเสธผใชบางกลมสามารถสรางความแตกตางในเรองของรายไดอยางคาดไมถง

3. ความมเสถยรภาพ ขอมลหรอเนอหาตาง ๆ ทท าตามมาตรฐานจะยงสามารถใชไดแมวาเทคโนโลยใหม ๆจะเขามาแทน

และสามารถแสดงผลลพธผานทางบราวเซอรในลกษณะทผใชรบได (ไมนาเกลยดจนเกนไป) เรยกวาเปนการตกยคอยางสวยงาม (degrade gracefully)

เนองจากวา เวบไซตหนง ๆ อาจอยนานและมผพฒนาหลายคน ผทเขามาสานงานตอจะเขาใจงานทมอยไดงายขนหากโคดของเราไดมาตรฐาน

2. ECMA (European Computer Manufacturers Association) Standards กอตงเมอ 1961

ก าหนดมาตรฐานของสารสนเทศและการสอสารเทคโนโลย (ICT) ดาน JavaScript และ Document Object Model และเครองใชไฟฟา (Consumer Electronics : CE)

จดมงหมายของ ECMA คอ เพอพฒนาในการท างานรวมกบทเหมาะสมแหงชาตยโรปและองคการระหวางประเทศมาตรฐานและ

รายงานทางเทคนคเพออ านวยความสะดวกและสรางมาตรฐานการใชเทคโนโลยสารสนเทศการสอสาร ( ICT) และเครองใชไฟฟา (CE)

เพอสงเสรมใหมการใชงานทถกตองของมาตรฐานโดยทมผลกระทบตอสภาพแวดลอมทพวกเขาจะน ามาประยกตใช

ในการเผยแพรมาตรฐานเหลานและรายงานทางเทคนคในรปแบบอเลกทรอนกสและพมพ สงพมพสามารถคดลอกไดอยางอสระโดยผทสนใจโดยไมมขอจ ากด

17

ประโยชนของ Web Standard สงผลใหการใชงาน และขอมลทไดรบ มมาตรฐานเดยวกน ซงหากจะพจารณารายละเอยด กสามารถแยก

ออกเปนสวนๆ ใน 2 ประเภท 1. ดาน Accessibility

หากจะเอาตวผใชงานเปนเกณฑ กคงมองในดานการเขาถงตวขอมลทมความสมดลยในการใชงาน ของคน ผานตวอปกรณตางๆ(คอมพวเตอรตางๆ รวมถงอปกรณพกพาหรอเคลอนท)

1. ประโยชนตอ Application และตวอปกรณ 1.1 เพมโอกาสในการเขาถงเวบไซตดวย bot จาก Search engine ซง bot จะคนหา Tag ค าสง

ในหนาเอกสารเวบทไดก าหนดไว 1.2 Search Engine สามารถคนหาและท าดรรชนขอมลในเวบไดงายขนและมประสทธภาพมากขน 1.3 บราวเซอรทกชนดเขาใจไดงาย ท าใหการเขาถงโครงสรางของเวบและสามารถแสดงผลไดด 1.4 นกพฒนาทใชมาตรฐานสามารถตรวจสอบความถกตองของเอกสารไดดวยการ Validate จาก

เครองมอทมมากมายในอนเตอรเนต และสามารถหาขอผดพลาดภายในเวบไดงายขน 1.5 เพมความคลองตวเอกสารทไดมาตรฐาน W3C จะสามารถแปลงไปเปนเอกสารอน ๆ ไดงาย

และสะดวกตอประโยชนการใชงานทหลากหลาย 2. ประโยชนส าหรบผใชงาน 2.1 ท าใหคนทมองเหนไมชด หรอ สญเสยการมองเหน สามารถทจะมาใชเวบไซตของคณได

อยางไร? คนตาบอดจะใช screen reader ในการอาน text ทอยในหนาเวบเพจ ถาคณใสรปแลว ไมใส alt=”" ตว screen reader กจะไมสามารถอานไดวารปนนคอรปอะไร

2.2 ท าใหเวบไซต สามารถแสดงผลไดอยางถกตองในทกอปกรณ ไมวาจะเปน จอทว จอพดเอ จอคอมพวเตอร จอโปรเจกเตอร

2.3 Web Standards สงผลใหสามารถเขาหนาเอกสารเวบไดทกมมโลก ในทกเวบไซตทเผยแพร

2. ดาน Stability & Flexibility ซงกคอ ความเสถยรตอระบบ และความยดหยนในการแสดงผลของเวบไซต

1. จากความเปนมาตรฐานเดยวกน สงผลใหเวบไซตทกเวบไซต มความเขากนไดกบ Browser และอปกรณทใชแสดงผล ทงรนเกา และเทคโนโลยรนใหมอยางมประสทธภาพ

2. บนมาตรฐานเดยวกน ในการพฒนาขอมล หรอ web application สามารถท าไดตอเนอง แมจะท าโดยคนหลายคนกตาม กสามารถท า หรอพฒนาตอกนได

3. ถกตองตามกฏหมาย ในหลายประเทศ จะมการก าหนดใหผพฒนาเวบ ตองท าเวบใหคนทกคนทมความสามารถเขาถงได แมคนเหลานนจะมความบกพรองในการมองเหนกตาม

ส าหรบในประเทศไทยเอง การตนตวในขอก าหนดของ Web Standard ยงมไมมากนก เมอป 2549 NECTEC เคยก าหนดเงอนไขมาตรฐานเวบไซตของหนวยงานไว ซงหากหนวยงานราชการ หนวยงานทางการศกษา จะพงระวง และศกษาในเรองเหลาน นบวามประโยชนตอเวบไซตขององคกรเปนอยาง

18

มาตรฐานการพฒนาเวบไซตส าหรบเวบไซตตางๆ ในสงกดศนยเทคโนโลยอเลกทรอนกสและคอมพวเตอรแหงชาต

ประกาศ ณ 3 เมษายน พ.ศ. 2549

มาตรฐาน

1. เวบไซตตองสอดคลองกบขอก าหนดของ W3C ในเรองการพฒนาเวบไซตใหทกคนเขาถงได (Web Content Accessibility Guidelines) ระดบ 1.0

2. เวบไซตควรสอดคลองกบขอก าหนดของ W3C ส าหรบ HyperText Markup Language (HTML) ระดบ 4.01

3. หากเวบไซตใดใช Cascading Style Sheets (CSS) เวบไซตเหลานนควรจะสอดคลองกบขอก าหนดของ W3C ส าหรบ CSS ระดบ 1

4. รายละเอยดของมาตรฐานแบงออกเปน 4 ประเภท ไดแก o มาตรฐานการตงชอไฟลและ Directory เปนการก าหนดวธการตงชอทสอความหมาย เขาใจ

ตรงกน สนกระชบ และไมเกดความสบสน ซงจะชวยให Search Engine ใหคาความส าคญของเวบไซตสงสด หากค าส าคญพบเปนชอไฟลและชอ Directory โดยตรง รายละเอยดแสดงในเอกสารแนบ 1

o มาตรฐานทางดานเนอหา เปนการก าหนดมาตรฐานในสวนของโครงสรางขอมล หรอกรอบพนฐานของการน าเสนอเนอหา ทแตละหนวยงานหรอโครงการจะตองน าเสนอบนระบบเครอขายอนเทอรเนต รายละเอยดแสดงในเอกสารแนบ 2

o มาตรฐานทางดานรปแบบการใชภาษาบนเวบ เปนการก าหนดมาตรฐานในสวนของรปแบบของการน าเสนอขอมลของเวบไซต ใหมรปแบบเดยวกน สามารถแสดงผลบนจอเปนอกษรไทยหรออกษรองกฤษไดถกตองกบเวบเบราวเซอร ทท างานตามมาตรฐานเปดทกชนดบนเครองคอมพวเตอร และการน าเสนอขอมลภาษาทถกตองตามหลกภาษา รายละเอยดแสดงในเอกสารแนบ 3

o มาตรฐานทางดานเทคนค เปนการก าหนดมาตรฐานในสวนของการเขยน HTML หรอสวนของโคดทเกยวของ เพอใหเปนเวบไซตททกคน (รวมถงคนพการ) เขาถงได รายละเอยดแสดงในเอกสารแนบ 4

5. เอกสารเวบทกเอกสาร ตองทดสอบความเปน Web Accessibility โดยจะตองไมมขอผดพลาด (Error) เกดขน ทงน ศอ. ยดมาตรฐานการทดสอบตาม Watchfire Corporation Web Accessibility ระดบ 1.0 โดยทดสอบไดท http://webxact.watchhfire.com/

6. แตละเวบยอยภายใตศนยฯ จะตองแกไขเสนเชอมทเสย (Broken Links) ใหแลวเสรจภายใน 2 สปดาห นบจากวนทไดรบแจง และผดแลเวบควรใชเครองมอตรวจลงก ดวยตนเองอยางสม าเสมอ

7. ทกๆ หนาเวบ ควรจะแสดงขอมลตางๆ (ยกเวนหนาเวบอนทราเนต) ดงตอไปน a. ขอมลตดตอหนวยงาน ไดแก ทอย เบอรโทรศพท และอเมล b. เสนเชอมกลบไปยงหนาหลกของศนยฯ c. ค าแถลงการณสงวนลขสทธ

8. แตละเวบยอยภายใตศนยฯ จะตองปฏบตตามขอก าหนดทางดานความมนคงปลอดภยบนเวบทก าหนดโดย ศนยประสานงานการรกษาความปลอดภยคอมพวเตอร ประเทศไทย (ThaiCERT)

19

ค าจ ากดความ 1. การโฆษณาประชาสมพนธ - ใหโฆษณาผลตภณฑ บรการ หรอการอบรมของศนยฯ และของส านกงาน

พฒนาวทยาศาสตรและเทคโนโลยแหงชาต (สวทช.) 2. เวบไซตขององคกรรวม (Partners) - เวบไซตขององคกรอน ทท ากจกรรมรวมกบศนยฯ 3. เวบไซตยอยของศนยฯ - เวบไซตของหนวยงานยอยภายใตสงกดศนยฯ หรอเวบไซตของบรการหรอ

โครงการทบรหารจดการโดยหนวยงานยอยภายใต สงกดศนยฯ 4. หนาเวบ HTML - หนาเวบทมโคด HTML 5. เวบไซตอนทราเนต - เวบไซตทเฉพาะพนกงานของศนยฯ เขาถงไดเทานน 6. เวบไซต - กลมของไฟลเวบ หรอกลมของหนาเวบ

Web Content Accessibility Guidelines 2.0 (WCAG 2.0)

ปญหาของการเขาถงขอมลสารสนเทศส าหรบคนพการ จะแตกตางกนออกไปตามประเภทของความพการ เชน คนพการทางการเหนทใชงานคอมพวเตอร เพอศกษาหาขอมลขาวสารในเวบไซตตางๆ ทมอยมากมายนน คนพการกลมนจ าเปนตองมเครองมอในการอานเวบไซตตางๆ ออกมาเปนเสยง เชน โปรแกรมอานเวบไซต (Voice Browser) หรอโปรแกรมอานจอภาพ (Screen Reader) แตโปรแกรมดงกลาวไมสามารถอานขอมลบนเวบไซตไดครบถวน สวนปญหาของคนพการทางการไดยนคอเวบไซตทประกอบไปดวยขอมลเสยง จะไมสามารถฟงเสยงได ท าใหเกดปญหาเรองการขาดโอกาสในการรบรขาวสาร หรอรบรไดแตไมเทาเทยมกน จากปญหาดงกลาวขางตน จงเปนจดเรมตนใหผพฒนาเวบไซตในตางประเทศ โดยองคกร World Wide Web Consortium (W3C) ใหความส าคญกบการออกแบบเวบไซตแบบ Universal Design (UD) ททกคนเขาถงได และไดก าหนดแนวทางการสรางเวบไซตททกคนเขาถงได

แนวทางการออกแบบเวบไซต ในเวอรชน WCAG 2.0 ทประกาศใชในป 2007 ประเทศไทยจงไดน า WCAG 2.0 มาปรบใชเพอ

ยกระดบการเขาถงเวบไซตใหเปนไปตามหลกสากลได ซงมโครงสรางดงน หลกการ (Principle)

ม 4 หลกการตามวตถประสงคในการออกแบบเวบไซต หลกการท 1 - ผอานตองสามารถรบรเนอหาได หลกการท 2 - องคประกอบตาง ๆ ของการอนเตอรเฟสกบเนอหาจะตองใชงานได หลกการท 3 - ผใชสามารถเขาใจเนอหา และสวนควบคมการท างานตางๆ ได หลกการท 4 - เนอหาตองมความยดหยนทจะท างานกบเทคโนโลยเวบในปจจบนและอนาคตได

(รวมถงเทคโนโลยสงอ านวยความสะดวก) แนวทาง (Guideline)

จะแบงออกเปนขอๆ ตามหลกการ แนวทางท 1.1 - จดเตรยมขอมลทเปนขอความ (Text) แทน เนอหาทมรปแบบเปนอน แนวทางท 1.2 - จดเตรยมขอความบรรยายทตรงกบเหตการณในสอมลตมเดย แนวทางท 1.3 - การออกแบบโครงสราง และเนอหา ตองสามารถท างานเปนอสระจากกนและกน

20

แนวทางท 1.4 - ตองมนใจไดวาพนหนาและพนหลง(สและเสยง) ตองมความแตกตางกนมากพอทผใชจะสามารถแยกแยะได

แนวทางท 2.1 - การท างานทกอยางตองรองรบการใชงานจากคยบอรดได แนวทางท 2.2 - จดเตรยมเวลาใหเพยงพอในการอาน หรอการกระท าใดๆ ของขอมล ส าหรบผใชทเปน

คนพการ แนวทางท 2.3 - ไมสรางเนอหาทอาจเปนสาเหตของอาการลมชก แนวทางท 2.4 - จดเตรยมทางชวยเหลอส าหรบผใชในการสบคนเนอหา รวาตวเองอยในต าแหนงใดใน

เนอหา และทองไปในเนอหานนได แนวทางท 3.1 - สรางเนอหาใหสามารถอานและเขาใจได แนวทางท 3.2 - การท างานของระบบตางๆ หรอการแสดงผลบนหนาเวบ ตองเปนสงทผใชสามารถ

คาดเดาได แนวทางท 3.3 - จดเตรยมสวนการชวยเหลอใหผใชใหสามารถกรอกขอมลไดถกตอง แนวทางท 4.1 - รองรบการใชงานรวมกบ User Agent ไดทงในปจจบน และอนาคต (รวมถง

เทคโนโลยสงอ านวยความสะดวก) เกณฑความส าเรจ (Success Criteria)

เปนตวบอกระดบความส าเรจของหวขอแนวทางทจะท าใหเปนไปตามหลกการ แบงเปน 3 ระดบ เอ (A) เปนเกณฑท *ตอง* ปฏบตตาม เพอใหคนพการเขาถงเวบไซตได ดบเบลเอ (AA) เปนเกณฑท *ควรจะ* ปฏบตตาม เพอใหคนพการเขาถงเวบไซตไดงายขน ทรปเปบเอ (AAA) เปนเกณฑท *อาจจะ* ปฏบตตาม เพอใหคนพการเขาถงเวบไซตไดงายทสด

ระดบการเขาถง (Level) การทจะท าใหทราบถงวาเวบไซตใดเปนเวบไซตทอ านวยความสะดวกใหกบคนพการเขาถงขอมล

ขาวสารไดนน จะตองมสญลกษณ (Icon) ก ากบอยทหนาของเวบไซตนนๆ (URI) ซงหมายถงการทเวบไซตนนๆ ไดผานการตรวจสอบความสามารถในการเขาถงขอมลได ตามแนวทางของการเขาถงขอมล ส าหรบสญลกษณทแสดงนนจะแบงความสามารถในการเขาถงเปน 3 ระดบ

เอ (A) หมายถง ผานการตรวจสอบตามเกณฑการตรวจสอบทงหมด ทก าหนดในระดบเอ ดบเบลเอ (AA) หมายถง ผานการตรวจสอบตามเกณฑการตรวจสอบทงหมด ทก าหนดในระดบเอ และ

ดบเบลเอ ทรปเปลเอ (AAA) หมายถง ผานการตรวจสอบตามเกณฑการตรวจสอบทง 3 ระดบ

มาตรฐานเวบไซตภาครฐ (Government Web Site Standard)

เปนมาตรฐานส าหรบเวบไซตหนวยงานภาครฐ เพอใหเปนเวบไซตภาครฐของประเทศไทย มมาตรฐานเดยวกนและเปนมาตรฐานสากล และจะเปนการยกระดบการพฒนา e-Government ใหกาวหนาสระดบสากลตอไป โดยเนอหาจะกลาวถงเนอหาของเวบไซต (Contents) คณลกษณะของเวบไซตภาครฐทควรจะม (Recommended Features) รวมถงแนวทางการรกษาความมนคงปลอดภยสารสนเทศ ( Information Security) ซงไดรวบรวมและประมวลจากกฎหมาย ระเบยบ ขอบงคบในประเทศทเกยวของกบการท าธรกรรมอเลกทรอนกส การคมครองขอมลสวนบคคล และขอก าหนดองคการสหประชาชาต (United Nations) ในการ

21

จดอนดบการพฒนา e-Government ของกลมประเทศสมาชก ตลอดจนแนวทางปฏบตทดทสดในระดบนานาชาต (International Best Practice) โดยมาตรฐานเวบไซตภาครฐน จดท าโดย ส านกงานรฐบาลอเลกทรอนคส (องคการมหาชน) (http://www.ega.or.th) ตามหลกการทกลาววา “ทเดยว ทนใด ทวไทย ทกเวลา ทวถง เทาเทยม และธรรมาภบาล”

มาตรฐานประกอบดวย ดานเนอหาเวบไซตภาครฐ (Government Website Contents) วาเนอหาของเวบไซตควรมการเผยแพรผานเวบไซตภาครฐ เพอใหบรการกบประชาชน ธรกจเอกชน

ตลอดจนหนวยงานภาครฐ โดยแบงออกเปน 3 สวน ดงน 1. ขอมลพนฐาน

o เกยวกบหนวยงาน o ขอมลผบรหารเทคโนโลยสารสนเทศระดบสง (CIO) o ขาวประชาสมพนธ o เวบลงค o กฎ ระเบยบ ขอบงคบ ทเกยวของกบหนวยงาน o ขอมลการบรการ o แบบฟอรมทใหดาวนโหลดได (Download Formats) o คลงความร o ค าถามทถามบอย (FAQ) o ผงเวบไซต (Site map)

2. การสรางปฏสมพนธกบผใชบรการ o ถาม-ตอบ (Q&A) o ระบบสบคนขอมล (Search) o ชองทางการตดตอสอสารกบผใชบรการ o แบบส ารวจออนไลน (Online Survey)

3. การใหบรการในรปแบบอเลกทรอนคส (e-Service) o การลงทะเบยนออนไลน (Register Online) o e-Forms / Online Forms o ระบบใหบรการในรปแบบอเลกทรอนคส (e-Service) o การใหบรการเฉพาะบคคล (Personalized e-Service)

คณลกษณะทควรมเรองหนง คอ ขอก าหนดมาตรฐาน ขอก าหนดมาตรฐาน

เวบไซตควรสอดคลองกบขอก าหนดขององคการมาตรฐาน เวลด ไวด เวบ (World Wide Web Consortium: W3C) คณะรเรมด าเนนการท าใหเวบเขาถงและใชประโยชนได (Web Accessibility Initiative: WAI) ตามขอก าหนดการท าใหเนอหาเวบสามารถเขาถงและใชประโยชนได รน 2.0 (Web Content Accessibility Guidelines 2.0 : WCAG 2.0) ในเกณฑความส าเรจ ระดบ เอ (A)

22

ส าหรบประเทศไทย ส านกงานปลดกระทรวงเทคโนโลยสารสนเทศและการสอสาร โดยส านกสงเสรมและพฒนาการใชเทคโนโลยสารสนเทศและสารสอสารไดมการจดท ารปแบบการพฒนาเวบไซตใหเปนเวบไซตททกคนสามารถเขาถงไดและเกณฑมาตรฐานฉบบภาษาไทยขน ภายใตชอ “Thai Web Content Accessibility Guidelines 2010 (TWCAG 2010)”

เวบไซตควรสอดคลองกบขอก าหนดของ W3C ส าหรบ HyperText Markup Language (HTML) อยางนอย HTML 4.01

หากเวบไซตใช Cascading Style Sheets (CSS) ควรสอดคลองกบขอก าหนดของ W3C ส าหรบ CSS ระดบ 1

ปจจบนแนวทางการสรางแอพพลเคชนบนสมารทโฟนดวย HTML5 ก าลงไดรบความนยม และอาจเปนทางออกส าหรบนกพฒนาทมปญหาเกยวกบแพลตฟอรมการพฒนาบนสมารทโฟนจ านวนมากในทองตลาด สดทายอาจสรางแอพพลเคชนดวย HTML5 เพอใชไดกบสมารทโฟนทกคายกเปนได

ในโอกาสน W3C หนวยงานก ากบดแลมาตรฐานเวบ ไดออก Recommendations ส าหรบการพฒนาแอพพลเคชนบนสมารทโฟนดวยเทคโนโลยเวบ วาควรท าอยางไรจงจะเหมาะสม เอกสารนเปนค าแนะน าแบบกวางๆ ไมไดเจาะจงแพลตฟอรมใดแพลตฟอรมหนง

ตวอยางบางสวนจากเอกสารน ไดแก ส าเนาขอมลไวบนเครองฝง client เผอมปญหาในการเชอมตออนเทอรเนต (ตองใช Local Storage API

ของ HTML5) ใช JSON parser ประมวลผลขอมลใน JSON แทน eval() เพอปองกนไฟลพงหรอมาผดรป ลดขนาดของแอพพลเคชนใหเลกทสดทเปนไปได ใชการบบอดขอมลเขามาชวย มระบบชวยลอกอนอตโนมต เพราะการปอนรหสผานท าไดยากกวาบนเดสกทอป แตกควรมลงกใหเลอกล

อกเอาทดวย ไมควรใช HTTP Redirect หรอการโหลดหนาเวบใหมอตโนมต ใชเทคนค sprite รวมไฟลภาพทใชบอยเปนภาพเดยว จะไดโหลดทเดยว ถามหมายเลขโทรศพท ควรใสลงกระบวาเปนหมายเลขโทรศพท เพอคลกแลวกดโทรออกไดเลย

อางอง

Web Standard W3C : http://www.w3.org/standards/

Web Standard Ecma :http://www.ecma-international.org/

Web Standard NECTEC :http://www.nectec.or.th/web-standard/standard-webnectec2.html

มาตรฐานเวบไซตภาครฐ (Government Website Standard) http://www.otp.go.th/images/stories/13-CIO/articlewevsite.pdf