32
บทที2 เอกสารและงานวิจัยที่เกี่ยวข้อง การวิจัยเรื่อง การใช้เว็บไซต์สานักบัณฑิตศึกษาของนักศึกษาระดับบัณฑิตศึกษา มหาวิทยาลัยสุโขทัยธรรมาธิราช ผู้วิจัยได้ศึกษารวบรวมจากตารา เอกสาร และผลงานวิจัยทีเกี่ยวข้องดังนี ้ คือ 1. อินเทอร์เน็ต 1.1 ความหมายของอินเทอร์เน็ต 1.2 ความเป็นมาของอินเทอร์เน็ต 1.3 การประยุกต์ใช้อินเทอร์เน็ต 1.4 ข้อดีและข้อจากัดของอินเตอร์เน็ต 2. เว็บไซต์ 2.1 ความหมายของเว็บไซต์ 2.2 ความสาคัญของการออกแบบเว็บไซต์ 2.3 องค์ประกอบเว็บไซต์ 2.4 หลักการออกแบบเว็บไซต์ 2.5 ขั ้นตอนการพัฒนาเว็บไซต์ 2.6 ข้อผิดพลาดของเว็บไซต์ 3. เว็บเพจ 3.1 ความหมายของเว็บเพจ 3.2 หลักการออกแบบเว็บเพจ 4. เว็บไซต์สานักบัณฑิตศึกษา มหาวิทยาลัยสุโขทัยธรรมาธิราช 5. งานวิจัยที่เกี่ยวข้อง

เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/31/บทที่ 2.pdf · องค์ประกอบเว็บไซต์

  • Upload
    others

  • View
    7

  • Download
    0

Embed Size (px)

Citation preview

Page 1: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/31/บทที่ 2.pdf · องค์ประกอบเว็บไซต์

บทท 2

เอกสารและงานวจยทเกยวของ

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

1.1 ความหมายของอนเทอรเนต 1.2 ความเปนมาของอนเทอรเนต

1.3 การประยกตใชอนเทอรเนต 1.4 ขอดและขอจ ากดของอนเตอรเนต

2. เวบไซต 2.1 ความหมายของเวบไซต 2.2 ความส าคญของการออกแบบเวบไซต 2.3 องคประกอบเวบไซต 2.4 หลกการออกแบบเวบไซต 2.5 ขนตอนการพฒนาเวบไซต 2.6 ขอผดพลาดของเวบไซต

3. เวบเพจ 3.1 ความหมายของเวบเพจ

3.2 หลกการออกแบบเวบเพจ 4. เวบไซตส านกบณฑตศกษา มหาวทยาลยสโขทยธรรมาธราช 5. งานวจยทเกยวของ

Page 2: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/31/บทที่ 2.pdf · องค์ประกอบเว็บไซต์

6

1. อนเทอรเนต

1.1 ความหมายของอนเทอรเนต น าทพย วภาวน(2548:137) ไดใหความหมายของอนเทอรเนตวา เปนเครอขาย

คอมพวเตอรขนาดใหญทใชสอสารกนและสงขอมลผานทางบรการ World Wide Web (WWW) ทชวยใหสามารถเชอมโยงกบแหลงขอมลตางๆ ไดทวโลกผานโปรโตคอล Transmission Control Protocol/Internet Protocol (TCP/IP)

สมใจ บญศร(2538:1) กลาววา อนเทอรเนต หมายถง เครอขายแหงเครอขาย หมายถง การเชอมโยงระหวางระบบเครอขาย จ านวนมหาศาลทวโลกเขาดวยกน ภายใตหลกเกณฑมาตรฐานเดยวกน นนคอใชโปรโตคอลทซพ/ไอพ ท าใหเครองคอมพวเตอรทงหลายในขายแหงนสามารถตดตอสอสารแลกเปลยนขอมลถงกนไดโดยสะดวกรวดเรวไมวาขอมลเหลานนจะอยในรปใดๆ อาจเปนตวอกษร ขอความ ภาพ และเสยง ไดทงสน นภาภรณ ค าเจรญ(2544:19) กลาววา อนเทอรเนต หมายถง ระบบเครอขายคอมพวเตอรทมขนาดใหญมาก ซงสามารถเชอมโยงเครอขายคอมพวเตอรทวโลกเขาดวยกนได ซงท าใหเราสามารถโอนยายขอมล ตดตอสอสาร และคนหาขอมลจากแหลงขอมลไกลๆ ได Burke(1996:1) กลาววา อนเทอรเนต หมายถง เครอขายคอมพวเตอรทเชอมโยงตดตอกนโดยคอมพวเตอรและเครอขายตางๆ จากทวโลกถกเชอมโยงเขาดวยกน เพอแบงปนขอมลกน จากทมผ ใหความหมายของอนเทอรเนตดงกลาว สามารถสรปความหมายของอนเทอรเนตไดวา เครอขายคอมพวเตอรขนาดใหญ ทมการเชอมตอระหวางเครอขายหลายๆ เครอขายทวโลกเขาดวยกน โดยใชมาตรฐานการเชอมโยงเดยวกนดวยโปรโตคอล TCP/IP ท าใหเครองคอมพวเตอรทงหลายสามารถตดตอสอสารและแลกเปลยนขอมลถงกนไดในระยะเวลาสน 1.2 ความเปนมาของอนเทอรเนต

อนเทอรเนตถอก าเนดขนในป ค.ศ.1969 โดยหนวยงานของกระทรวงกลาโหม สหรฐอเมรกา คอ Advanced Research Projects Agency(ARPA) ซงใหการสนบสนนงานวจยแกหนวยงานตางๆเพอท าการวจยทางดานวทยาศาสตรและเทคโนโลยเครอขายอนเทอรเนตในชวงแรกนนรจกกนในนามของ “อารพาเนต(ARPANET)” ซงเรมจากการเชอมตอคอมพวเตอรระหวางสถาบนการศกษา 4 แหงไดแก 1) มหาวทยาลยเคลฟอรเนยทลอสแองเจลส 2)มหาวทยาลย ยทาห 3) มหาวทยาลยเคลฟอรเนยทซานตาบารบาราและ 4) สถาบนวจยแหงมหาวทยาลย

Page 3: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/31/บทที่ 2.pdf · องค์ประกอบเว็บไซต์

7

สแตนฟอรด คอมพวเตอรท เชอมตอกนในเครอขายทท าการวจยมอยหลายชนด รวมท งใชระบบปฏบตการทแตกตางกน

ภายหลงไดมหนวยงานทงภาครฐและเอกชนจ านวนมากมาเชอมตอเขากบระบบเครอขายอารพาเนต ท าใหเครอขายขยายขนาดมากขนเรอยๆ จนกระทงในป ค.ศ.1984 ไดเรยกเครอขายนวา “อนเทอรเนต”ซงคอมพวเตอรตางๆทจะเชอมตอเขาสเครอขายอนเทอรเนตน น จะตองใชมาตรฐานของรปแบบในการสอสารหรอโปรโตคอล(Protocol) คอ Transmission Control Protocol/Internet Protocol(TCP/IP) นอกจากนยงไดมการพฒนาและประยกตระบบเครอขายอนเทอรเนตใหเปนระบบเครอขายในลกษณะของเครอขายอนทราเนต(Intranet) และเครอขายเอกทราเนต(extranet) ซงจะมโปรโตคอลหลกเปน TCP/IP เชนเดยวกน (น าทพย วภาวน,2548:141) ส าหรบในประเทศไทยกาวส าคญของการพฒนาอนเทอรเนต พอสรปไดดงน พ.ศ.2530 เรมใชอเมลเปนครงแรกทมหาวทยาลยสงขลานครนทร วทยาเขตหาดใหญ และสถาบนเทคโนโลยแหงเอเชย(AIT) เปนความรวมมอจากโครงการInternational Development Plan (IDP) ของรฐบาลออสเตรเลย โดยทางออสเตรเลยจะโทรศพทเขามาวนละ 2 ครง เพอแลกเปลยนอเมลท าใหประเทศไทยสามารถใชอเมลตดตอกบผใชเครอขายอนเทอรเนตได พ.ศ.2531 กระทรวงวทยาศาสตรเทคโนโลยและการพลงงาน(ชอขณะนน)ไดมอบหมาย ใหเนคเทคใหทนสนบสนนการวจยโครงการเครอขายคอมพวเตอรแกสถาบนเทคโนโลยพระจอมเกลาเจาคณทหารลาดกระบงเพอศกษาการเชอมตอเครองคอมพวเตอรของมหาวทยาลยดานวทยาศาสตรของไทย 12 แหง พ.ศ.2534 เนคเทครวมมอกบอาจารยและนกวจยจากสถาบนอดมศกษา 8 แหงกอตงคณะท างานชอ NET group เพอแลกเปลยนอเมลระหวางคอมพวเตอรของแตละสถาบนและแลก เปลยนกบประเทศออสเตรเลย AIT ท าใหนกวจยไทยสามารถตดตอสอสารกบนกวจยนานาชาตได พ.ศ.2535 กอตงเครอขายไทยสาร ภายใตการด าเนนการของคณะท างานไทยสารซงในตอนเรมแรกนน ประกอบดวยเนคเทคและสถาบนการศกษา 5 แหง คอมหาวทยาลยธรรมศาสตร สถาบนเทคโนโลยแหงเอเซย จฬาลงกรณมหาวทยาลย มหาวทยาลยสงขลาณครนทร และมหาวทยาลยเกษตรศาสตร ไทยสารเปนเครอขายเพอสนบสนนการศกษาคนควาและวจย จงมงใหบรการเฉพาะแกกลมนกวชาการ นกวจย และผอยในแวดวงการศกษา การบรการอนเทอรเนต สประชาชนในวงกวางยงไมเกดขน พ.ศ.2538 อนเทอรเนตประเทศไทย(Internet Thailand) ผใหบรการอนเทอรเนตเชงพาณชย หรอ ISP รายแรกของประเทศไทยถกกอตงขน โดยการรวมทนระหวางเนคเทคการสอสารแหง ประเทศไทย และองคการโทรศพทแหงประเทศไทย นบเปนจดก าเนนของบรการอนเทอรเนต

Page 4: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/31/บทที่ 2.pdf · องค์ประกอบเว็บไซต์

8

เชงพาณชยส าหรบประชาชนทวไป (ศนยเทคโนโลยอเลกทรอนกสและคอมพวเตอรแหงชาต, 2544:5-6)

1.3 การประยกตใชอนเทอรเนต อนเทอรเนตมบรการตางๆมากมายทใหประโยชนกบผใชอนเทอรเนต ส าหรบบรการอนเทอรเนต พอสรปไดดงน 1.3.1 ไปรษณยอเลกทรอนกส หรอ อเมล Electronic Mail (e-Mail) เปนบรการบนอนเทอรเนตทคนนยมใชมากทสด และเปนประโยชนตอคนทวไปใหสามารถตดตอรบสงขอมลระหวางกนไดอยางรวดเรว เปนการสงจดหมายทางคอมพวเตอรถงผรบในระบบอนเทอรเนตดวยกนไมวาจะอยใกลหรอไกลหรออยคนละซกโลกซงจดหมายทสงจะไปถงอยางสะดวกรวดเรว โปรแกรมทใชในการรบรบสงจดหมายอเลกทรอนกสมหลายโปรแกรมดวยกน ขนอยกบความชอบและความถนดในการใชงานของผ ใ ช เวบ ทสามารถรบสงจดหมายอเลกทรอนกส เ ชน Yahoo,Hotmail,Thaimail เปนตน 1.3.2 เวลดไวดเวบ World Wide Web (WWW) เปนบรการบนอนเทอรเนตทไดรบความนยมเปนอยางมากเนองจากลกษณะเดนของเวลลไวดเวบทสามารถน าเสนอขอมลมลตมเดยทแสดงใหทงตวหนงสอและภาพนง ภาพเคลอนไหวและเสยงซงมอยมากมายและสามารถรวมลกษณะ การใชงานอนๆในระบบอนเทอรเนตไวดวยไมวาจะเปนไปรษณยอเลกทรอนกส การถายโอนขอมล การสนทนา การคนหาขอมลและอนๆท าใหเวลลไวดเวบเปนแหลงขอมลทมขนาดใหญทสดในโลก 1.3.3 การถายโอนแฟมขอมล File Transfer Protocol (FTP) เปนบรการบนอนเทอรเนตอยางหนงทผใชบรการนยมใช โดยผใชสามารถแลกเปลยนขอมลตางๆไมวาจะเปนไฟลขอมล ตวหนงสอ รปภาพ เสยง ว ดโอ หรอโปรแกรมตางๆจากระบบอนเทอรเนตหรอจากเครองทใหบรการ FTP มาไวในเครองคอมพวเตอรของเราซงเรยกวา การดาวนโหลด(Dowload)และในทางตรงกนขามถาเราตองการเอาขอมลจากเครองคอมพวเตอรของเราไปไวในระบบอนเทอรเนตกสามารถท าไดเชนเดยวกนโดยใชการอพโหลด(upload) ไฟลขอมลของเราไป แตการอพโหลด ยงไมคอยเปนทนยมมากนกสวนมากผใชบรการมกใชบรการดาวโหลดโปรแกรมตางๆมากกวา 1.3.4 การขอเขาใชระบบจากระยะไกล (telnet) เปนบรการทชวยใหสามารถเขาไปใชงานในระบบคอมพวเตอรเครองอนทอยไกลๆไดเหมอนกบไปนงใชเครองคอมพวเตอรอยทนน ส าหรบการท างานของโปรแกรมเทลเนตนน จะตองอาศยผทมความเชยวชาญในการเชอมตอระบบและการตดตงโปรแกรมเพราะการแสดงผลลพธของโปรแกรมเทลเนตสวนใหญจะแสดงเปนขอความ

Page 5: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/31/บทที่ 2.pdf · องค์ประกอบเว็บไซต์

9

ไมไดแสดงเปนรปภาพเหมอนโปรแกรมอนส าหรบโปรแกรมทชวยใหสามารถใชบรการนไดคอ โปรแกรม NCSA telnet เมอเปดโปรแกรมแลวใหพมพค าสง telnetการใชเทลเนตเปนการใหผใชสามารถเขาไปใชทรพยากรหรอขอใชบรการจากคอมพวเตอรเครองอนและใหคอมพวเตอรเครองนนท าหนาทประมวลผลโดยผใชปอนค าสงผานทางคอมพวเตอรของตนเองแลวจงสงผลลพธกลบมาแสดงบนหนาจอภาพ นอกจากนเราเดนทางไปตางจงหวดหรอตางประเทศกสามารถใชเทลเนตตอมายงคอมพวเตอรทศนยบรการอนเทอณเนตทเราบรการอยได 1.3.5 นวสกรป(newsgroup) / ยสเนต ( usenet ) เปนการรวมกลมของผใชอนเทอรเนตทมความสนใจในเรองเดยวกน เชน กลมทสนใจเรองคอมพวเตอร รถยนต การเลยงปลา การปลกไมประดบ เปนตน เพอสงขาวสารหรอแลกเปลยนขอคดเหนระหวางกนในลกษณะของกระดานขาว(bulletin board)บนอนเทอรเนต ผใชสามารถเลอกหวขอทสนใจและสามารถแสดงความคดเหน ไดโดยการสงขอความไปยงกลมและผอานภายในกลมจะมการรวมกนอภปรายแสดงความคดเหนและสงขอความกลบมายงผสงโดยตรงหรอสงเขาไปในกลมเพอใหผอนอานดวย 1.3.6 การสนทนา(talk) เปนบรการทชวยใหผใชสามารถพดคยโตตอบกบผใชคนอนๆทเชอมตอเขาระบบอนเทอรเนตในเวลาเดยวกน โดยการพมพขอความผานทางแปนพมพ พดคยผานทางคอมพวเตอรโดยมการตอบโตกนทนท การสนทนาผานทางอนเทอรเนตนสามารถใชโปรแกรมไดหลายโปรแกรม เชน โปรแกร talk ส าหรบการสนทนาเพยง 2 คน โปรแกรม Chat หรอ Internet Relay Chat (IRC) ส าหรบการสนทนาเปนกลมหรอโปรแกรม (ICQ) เปนการตดตอสอสารกบคนอนๆบนอนเทอรเนตทางหนง คณสมบตทโดดเดนของ”อซคว คอ การสนทนาแบบตวตอตวกบคนใดคนหนง โดยเฉพาะและเลอกไมสนทนากบผทไมประสงคได 1.3.7 The Internet Telephone/The Videophone ปกตการสอสารทางโทรศพทผใชจะตองยกหจากเครองรบโทรศพทและพดขอความตางๆระหวางผรบกบผสงแตเมอใชบรการอนเทอรเนตซงเปนเครอขายการสอสารทวโลกผใชสามารถเลอกหหมายเลขโทรศพททตองการตดตอ โดยพดผานไมโครโฟนเลกๆและฟงเสยงสนทนาผานทางล าโพงทงนผใชตองมโปรแกรมส าหรบใชงานรวมทงใชคอมพวเตอรทเปนระบบมตตมเดยรนอกจากนหากมการตดตงกลองวดทศนทเครองคอมพวเตอรของคสนทนาทง 2 ฝาย เมอเชอมตอเครองคอมพวเตอร เขากบระบบอนเทอรเนตแลวภาพทไดจากการท างานของกลองวดทศนกสามารถสงผานไปทางอนเทอรเนตถงผ รบได การสนทนาทางโทรศพทจงปรากฏภาพของคสนทนาทงผรบและผสงบนจอคอมพวเตอรไปพรอมกบเสยงดวย

Page 6: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/31/บทที่ 2.pdf · องค์ประกอบเว็บไซต์

10

1.3.8 Entertain เปนการใชบรการทางดานความบนเทงบนอนเทอรเนต ซงมรปแบบตางๆใหเขาไปเลอกใชบรการได ไมวาจะเปนรายการโทรทศน รายการวทย เพลง เกมส รายการเกมโชว และรายการบนเทงทวไป ซงรายการบนเทงเหลานมท งของประเทศไทยและตางประเทศ เชน อเมรกา ออสเตรเลยเปนตน 1.3.9 Electronic Commerce(e-Commerce) เปนระบบการคาทท าผานสออเลกทรอนกส ซงหมายถงการคาทกประเภท ไมวาจะเปนการคาผานTV Media, UBC,Cable TVและผานระบบอนเทอรเนต ถาเปนการคาทใชการโทรศพทเขาไปสงซอสวนมากจะเปนทางโทรศพท แตถาเปนระบบอนเทอรเนตมกเปนการสงซอผานทางอเมล ซงผซออาจดสนคาจากโบรชวร หรอแคทตาลอกจากเวบไซตน นๆและถาตกลงซอกสามารถสงซอไดทนท ส าหรบการช าระเงนถาเปนระบบ e-Commerce มกจะช าระเงนผานทางบตรเครดต โดยผซอตองกรอกหมายเลขบตรเครดตลงไปดวย ซงท าใหผซอสามารถซอของไดสะดวก รวดเรว และไมตองเสยเวลาเดนทางไปซอดวยตนเอง 1.3.10 เสรชเอนจน (Search engine)เปนเครองมอชวยคนหาขอมลในระบบอนเทอรเนตทไดรบความนยมมากทสดในปจจบน เปนลกษณะของโปรแกรมชวยการคนหา ซงมอยมากมายในระบบอนเทอรเนตโดยการพฒนาขององคการตางๆเชน Yahoo, Infoseek, Altavista, Hotbot, Excite เปนตน เพอชวยใหผใชคนหาขอมลสารสนเทศตางๆ โดยผใชพมพค าหรอขอความทเปนค าส าคญ(Keyword) เขาไปโปรแกรมเสรชเอนจนจะแสดงรายชอของแหลงขอมลตางๆทเกยวของขนมา ซงสามารถคลกไปทรายชอตางๆเพอเขาไปดขอมลนนๆไดหรอจะเลอกคนหาจากหวขอในหมวดตางๆททางเสรชเอนจนไดแสดงไวเปนเมนตางๆ โดยเรมจากหมวดทกวางจนลกเขาไปสหมวดยอย 1.4 ขอดและขอจ ากดของอนเตอรเนต อนเทอรเนตเปนเทคโนโลยในการสอสารสารสนเทศทมท งขอดทเปนประโยชนและขอจ ากดบางประการซงผใชควรทราบพอสรปไดดงน 1.4.1 ขอด 1) ใชในการคนหาขอมลในลกษณะตางๆ เชน งานวจยบทความจากแหลงขอมล ทวโลก เชน หองสมด สถาบนการศกษา สถาบนวจย โดยไมตองเสยคาใชจายและไมตองเสยเวลาในการเดนทางและยงสามารถเขาไปหาขอมลได ตลอด 24 ชวโมง 2) สามารถตดตามความเคลอนไหวของสถานการณตางๆทวโลกไดอยางรวดเรวจากรายงานขาวของส านกขาวตางๆ 3) สามารถรบสงจดหมายอเลกทรอนกสจากทวโลกไดอยางรวดเรวโดยไมตองเสยคาซองจดหมาย คาแสตมป หรอคาลงทะเบยน ถงแมจะเปนการสงขอความไปตางประเทศกไมตอง

Page 7: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/31/บทที่ 2.pdf · องค์ประกอบเว็บไซต์

11

เสยเงนเพมเหมอนการสงจดหมาย จะเสยกเพยงคาโทรศพททใชในการหมนเขาระบบอนเทอรเนตเทานน 4) สามารถสนทนากบผอนทอยหางไกลไดทงในลกษณะการพมพขอความโตตอบกนและการพดคย 5) สามารถเขารวมกลมอภปรายหรอกลมขาวเพอแสดงความคดเหนหรอพดคย ถกปญหากบผทสนใจในเรองเดยวกน ซงเปนการขยายวสยทศนในเรองทสนใจ 6) สามารถถายโอนโปรแกรมแฟมขอความ ภาพกราฟฟก ภาพเคลอนไหวจากเวบไซตทใหบรการได 7) สามารถตรวจดราคาสนคาและสงซอสนคา รวมทงบรการตางๆไดโดยไมตองเสยเวลาเดนทางไปหางสรรพสนคา 8) ใหความบนเทงหลากหลายรปแบบ เชนฟงเพลง ดรายการโทรทศนผานทางอนเทอรเนต 9) สามารถตดประกาศขอความตางๆทตองการใหผอนทราบไดอยางทวถง 10) มเสรภาพในการสอสารทกรปแบบแกบคคลทกคน

1.4.2 ขอจ ำกด 1) อนเทอรเนตเปนขายงานคอมพวเตอรขนาดใหญ ซงไมมใครเปนเจาของ ทกคนสามารถสรางเวบไซตหรอตดประกาศโฆษณาขอความตางๆ ไดทกเรองซงขอความหรอประกาศบางอยางอาจเปนขอมลทไมถกตองหรอไมไดรบการรบรองจากสถาบนทนาเชอถอผอานควรพจารณาในเรองทอานเปนอยางด 2) อนเทอรเนตมโปรแกรมและเครองมอทชวยในการท างานมากมาย เชน การใช IRC ในการพดคย การใชอเมลในการรบสงจดหมาย ดงนนผใชควรท าการศกษาวธการใชงานโปรแกรมเหลานนใหละเอยดเสยกอน จงสามารถน ามาใชงานไดอยางมประสทธภาพ 3) นกเรยน นกศกษาและเยาวชนอาจจะเขาไปในเวบไซตทไมเหมาะสมและไมเปนประโยชน หรอย วยทางอารมณท าใหเปนอนตรายตอตนเองและสงคมได 4) เวบไซตบางอยางชกจงผอานไปทางทไมด หรอมการลอลวง ท าใหเสอมเสยหรออาจเกยวของกบยาเสพตด ดงนน ผปกครองควรมการแนะน าหรอดแลบตรหลานในการเขาใชอนเทอรเนตดวย

Page 8: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/31/บทที่ 2.pdf · องค์ประกอบเว็บไซต์

12

2. เวบไซต

2.1 ความหมายของเวบไซต ราชบณฑตยสถานไดใหความหมายของค าวา Website วา ทตงเวบ (ราชบณฑตยสถา,2540:149)

เวบไซตถก เรยกเปนต าแหนงทอยของผ ท ม เวบเพจของตวเองบนระบบอนเทอรเนตซงไดจากการลงทะเบยนกบผใหบรการเชาพนทบนระบบอนเทอรเนต เมอไดลงทะเบยนในชอทตองการแลว กสามารถจดท าเวบเพจ และสงใหศนยบรการน าขนไปไวบนอนเทอรเนตถอไดวามเวบไซตเปนของตวเองแลว(ปยวท เจนกจจาไพบลย,2540:4)

เวบไซต หมายถง สถานท ทใชเรยกบนเวลดไวดเวบ(WWW) เวบไซตอาจประกอบไปดวยเวบเพจจ านวนหลายๆ หนา ทมความสมพนธกน มเวบเพจหลายหนารวมกนอย(ชยยทธ ลมลาวลย,2544:19) เวบไซต หมายถง กลมของเวบเพจทประกอบไปดวยหนาเวบเพจหลายๆ หนา โดยใชการเชอมโยงระหวางหนาดวยระบบไฮเปอรลงค(hyperlink) ดงนน ภายในเวบไซตจะประกอบไปดวยหนาโฮมเพจและเวบเพจ (ภาษต เครอเนยม,2549:4) จากความหมายดงกลาวขางตน เวบไซต หมายถง ทอยเวบหรอทอยบนเวบไซต ซงเปนแหลงรวบรวมขอมลจ านวนมาก ขอมลในหนาแรกทไดรบจากเวบไซต เรยกวา โฮมเพจ และหนาอนๆ เรยกวา เวบเพจ ซงเชอมโยงกนผานทางไฮเปอรลงก (hyperlink) นอกจากเวบเพจแลวยงประกอบดวยไฟลชนดอนๆทจ าเปนส าหรบการแสดงผลของหนาเวบเพจ โดยมเนอหาทเกยวของหรอสอดคลองกน เชน รปภาพ มลตมเดย โปรแกรมภาษาสครปต ไฟลขอมลทใหดาวนโหลดและอพโหลดขอมล

2.2 ความส าคญของการออกแบบเวบไซต การออกแบบเวบไซตนนไมไดหมายถงลกษณะหนาตาของเวบไซตเพยงอยาง

เดยว แตเกยวของทงหมดตงแตการก าหนดเปาหมาย การระบกลมเปาหมาย การจดระบบขอมลการสรางระบบเนวเกชน การออกแบบหนาเวบ รวมไปถงการใชกราฟก การเลอกใชส และการจดรปแบบตวอกษร นอกจากนนยงตองค านงถงความแตกตางของสอในการแสดงผลเวบไซต ไดแก ชนดและรนของบราวเซอร ขนาดของหนาจอมอนเตอร ความละเอยดของสในระบบรวม ไปถง Plug-in ชนดตางๆทผใชมอยเพอใหผใชเกดความพงพอใจทจะทองในเวบไซตนน

Page 9: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/31/บทที่ 2.pdf · องค์ประกอบเว็บไซต์

13

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

2.3 องคประกอบของเวบไซต องคประกอบของเวบไซต ประกอบดวย 3 สวน ดงน (กตต ภกดวฒนะกล,2540:2) 2.3.1 เวบเพจ คอหนาเอกสารแตละหนาซงถกเขยนดวยภาษา HTML ขอมลทแสดงใน

เวบเพจประกอบดวย ขอความ ภาพ เสยง ซงเปนขอมลแบบสอผสมหรอมลตมเดย สวนประกอบพนฐานของเวบเพจ ไดแก

1) ตวอกษรหรอขอความ เปนตวอกษรขอความปกตหรอขอความทผานการตกแตงแลว เชน ตวอกษรเคลอนไหว ส เงา เปนตน

2) กราฟฟก เปนรปภาพทน ามาประกอบเปนภาพเหมอนจรง ภาพลายเสน ภาพขาวด า หรอลายพนหลง

3) สอผสม ประกอบดวย ภาพวดทศนซงเปนการน าเสนอขอมลทงภาพและเสยง แบงออกเปน 2 ระบบ คอ Digital Video และ Analog Video เปนการสงภาพและเสยงออกมาเปนสญญาณตอเนองกน เมอน ามาใชกบคอมพวเตอรตองใช Video Capture Board เพอแปลงเปนระบบ Digital Video

4) ตวนบ เปนสวนประกอบทใชในการนบจ านวนผเยยมชมเวบไซต 5) ลงค เปนค ายอของค าวา ไฮเปอรลงค(Hypertext Link) เปนสวนทเชอมโยง

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

6) แบบฟอรม เปนแบบฟอรมทมไวส าหรบผทเขามาเยยมชมสามารถกรอก ราย ละเอยดตามทตองการมลกษณะเหมอนแบบสอบถามทใชในอนเทอรเนตหรออนทราเนต ซงมหลายรปแบบ เชน รปแบบการเขยนขอมลแบบอสระ ผใชสามารถใสขอมลในบรเวณทก าหนดไว

Page 10: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/31/บทที่ 2.pdf · องค์ประกอบเว็บไซต์

14

7) การแบงหนาจอ จะแบงหนาจอคอมพวเตอรออกเปนสวนๆ ซงแตละสวนอาจ แสดงขอมลทแตกตางกน

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

9) โปรแกรมส าเรจรป (Java Applets) เปนโปรแกรมส าเรจรปเลกๆ ทใสลงไปในเวบเพจ เพอใหการใชงานเวบเพจมประสทธภาพมากขน

2.3.2 โฮมเพจ เปนเวบเพจหนาแรกสดของขอมลแตละเรอง เปรยบเสมอนหนาปกของหนงสอ เปนสวนทบอกใหทราบวาโฮมเพจเกยวกบเรองใด พรอมกบมสารบญในการเลอกไปยงหวขอตางๆ ในเรองนนดวย 2.3.3 ยอารแอล (URL-Universal Resource Locator) คอ ทอยทระบต าแหนงบรการตางๆ ในระบบเครอขายอนเทอรเนต 2.4 หลกการออกแบบเวบไซต

กอบเกยรต สระอบล (2547:19-20) ไดกลาวถงหลกการทวไปในการออกแบบเวบไซตไวดงน

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

2.4.3 มภาพเคลอนไหวประกอบเพอโฆษณาประชาสมพนธดงดดความสนใจแต ไมควรใสมากเกนไปจะท าใหลายตา

2.4.4 หนาเวบควรตกแตงดวยกราฟกพอประมาณถามากเกนไปจะท าใหเวบเปดชาผใชอาจหนไปเวบอนเนองจากรอไมไหว

2.4.5 ปรบปรงขอมลหนาเวบเปนระยะๆเพอไมใหผใชรสกเบอเชนเพมเนอหาขาวใหมเปลยนสเปลยนรปภาพฯลฯ

2.4.6 ควรมชอเวบไซตหรอชอองคกรและขอมลส าหรบตดตอเชน อเมล หมายเลขโทรศพทไวทเวบทกหนาอาจเปนสวนลาง(footer) หรอสวนบนหวเวบ(header)กไดแลวแตความเหมาะสมในการออกแบบ

Page 11: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/31/บทที่ 2.pdf · องค์ประกอบเว็บไซต์

15

ธวชชย ศรสเทพ(2544:16-17) ไดกลาวถงองคประกอบพนฐานส าคญทควรค านงถงเมอท าการออกแบบเวบไซตมดงตอไปน

1) ความเรยบงาย(simplicity) คอการสอสารเนอหาถงผใชโดยจ ากดองคประกอบเสรมทเกยวของกบการน าเสนอใหเหลอเฉพาะสงทจ าเปนเทานน ตวอยางทเหนไดชดเจนเชน เวบไซตของAdobe, Apple, IBM และ Nokia ทมการออกแบบเรยบงายไมซบซอนและใชงานไดสะดวกแมวาจะมขอมลอยในเวบไซตมากมายซงแทบจะไมเหนกราฟก หรอตวอกษรเคลอนไหวอยตลอดเวลา รวมไปถงไมใชสของตวอกษรมากจนเกนไปและไมมการเปลยนแปลงสของลงคใหสบสนแตอยางใด

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

3) ความเปนเอกลกษณ(Identity) การออกแบบตองค านงถงลกษณะขององคกรเปนหลกเนองจากรปแบบของเวบไซตเนองจากรปแบบของเวบไซตสามารถสะทอนถงเอกลกษณและลกษณะขององคกรนนได ตวอยางเชนถาตองการออกแบบเวบไซตของธนาคารไมควรจะมลกษณะทสนกสนาน ควรใหดมความนาเชอถอนอกจากนการใชชดส ชนดตวอกษร รปภาพและกราฟกตองเลอกใหเหมาะสม

4) เนอหาทมประโยชน(Useful Content) เนอหาถอเปนสงทส าคญทสดในเวบไซตดงนนในเวบไซตควรจดเรยงเนอหารและขอมลทผใชตองการใหถกตองและสมบรณโดยมการปรบปรงและเพมเตมใหทนตอเหตการณอยเสมอ เนอหาทส าคญทสดคอเนอหาทสรางขนมาเองโดยไมซ ากบเวบอนเพราะจะเปนสงทดงดดผใชใหเขามาในเวบไซตอยเสมอ

5) ระบบเนวเกชนทใชงานงาย(User-Friendly Navigation) เปนองคประกอบทส าคญมากของเวบไซตจงตองออกแบบใหผใชเขาใจงายและใชงานไดสะดวกโดยใชกราฟกทสอ ความ หมายรวมกบค าอธบายทชดเจน รวมทงมรปแบบและล าดบของรายการทสม าเสมอเชนวางไวในต าแหนงเดยวกนของทกๆหนา นอกจากนนถาใชเนวเกชนแบบกราฟกในสวนบนของหนาแลว

Page 12: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/31/บทที่ 2.pdf · องค์ประกอบเว็บไซต์

16

อาจเพมเนวเกชนทเปนตวอกษรไวทตอนทายของหนาเพอชวยอ านวยความสะดวกใหกบผทสงใหบราวเซอรไมแสดงกราฟกเพอความรวดเรวในการเรยกด

6) มลกษณะนาสนใจ (Visual Appeal) เปนเรองยากทจะตดสนใจวาลกษณะหนาตาของเวบไซตใดเวบไซตหนงนนนาสนใจหรอไมเพราะเกยวของกบความชอบของแตละบคคล อยางไรกดหนาตาของเวบไซตจะมความสมพนธกบคณภาพขององคประกอบตางๆเชน คณภาพของกราฟกทจะตองสมบรณไมมรองรอยของความเสยหายเปนจดดางหรอมขอบเปนขนบนไดใหเหน ชนดตวอกษรทอานงายสบายตาและโทนสทเขากนอยางสวยงามเปนตน

7) การใชงานงายอยางไมจ ากด (Compatibility) ควรออกแบบเวบไซตใหผใชสวนใหญเขาถงไดมากทสดโดยไมมการบงคบใหผใชตองตดตงโปรแกรมใดๆเพมเตมหรอตองเลอกใชบราวเซอรชนดใดชนดหนงจงจะสามารถเขาถงเนอหาได สามารถแสดงผลไดในทกระบบ ปฏบตการและทความละเอยดหนาจอตางๆกนอยางไมมปญหา สงเหลานจะยงมความส าคญมากขนส าหรบเวบทมผใชบรการจ านวนมากหรอมกลมเปาหมายทหลากหลาย

8) คณภาพในการออกแบบ(Design Stability) ถาอยากใหผใชรสกวาเวบไซตมคณภาพถกตองและเชอถอไดกควรใหความส าคญกบการออกแบบเวบไซตอยางมากเชนเดยวกบสอประเภทอนๆทตองออกแบบและเรยบเรยงเนอหาอยางรอบคอบซงเวบทไมมมาตรฐานการออกแบบและการจดระบบขอมลทดนนเมอมขอมลเพมขนเรอยๆอาจท าใหเกดปญหาและความ นาเชอมนจากผใชลดลงได

9) ระบบการใชงานทถกตอง(Functional Stability) ระบบการท างานตางๆในเวบไซตจะตองมความแนนอนและท าหนาทไดอยางถกตอง ตวอยางเชน ถามแบบฟอรส าหรบกรอกขอมลกตองแนใจวาฟอรมนนสามารถใชการไดจรงหรอลงคตางๆทมอยนนจะตองเชอมโยงไปยงหนาทมปรากฏอยจรงและถกตองและตองคอยตรวจเชคอยเสมอเพอใหแนใจวาสงเหลานนยงท างานไดดโดยเฉพาะลงคทเชอมโยงไปยงเวบอนเนองจากมการเปลยนแปลงไดตลอดเวลา

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

Page 13: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/31/บทที่ 2.pdf · องค์ประกอบเว็บไซต์

17

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

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

4. ควรใหความส าคญกบสวนบนของเวบเพจเพราะผใชจะสมผสไดทนทเมอเปดเขามา 5. ขอความในแตละหนาไมควรมมากเกนไปถามากเกนไปอาจท าใหนาเบอ 6. ขอมลทน าเสนอควรตรวจสอบความถกตองเชนเครองหมายตวสะกดและไวยกรณ 7. การน าเสนอขอมลอาจอยในรปของตารางหรอมสารบนหวขอเพอใหผใชหาขอมลได

งายสะดวก รวดเรว 8. รปแบบตวอกษรขนาดตวอกษร และสตวอกษรควรอานงายมความกลมกลนกบเนอหา 9. ควรมการปรบปรงเนอหาใหมความทนสมยอยตลอดเวลาและระบวนทปรบปรงขอมล

ใหมทกครง 10. การน าภาพหรอกราฟกเขามาเสรมไมควรมขนาดใหญมากเกนไปการใชรปภาพแทน

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

11. การน าเทคโนโลยเขามาประกอบตองค านงถงผใชดวยวาสามารถเรยกดเอกสารไดอยางสะดวกรวดเรวหรอไม

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

13. ควรออกแบบขนาดเวบเพจใหพอดกบหนาจอค านงถงกลมผใชสวนใหญวาใชขนาดจอภาพเทาใดและใชความละเอยดหนาจอกพกเซล

14. บางเวบเพจทตองการใหกรอกรหสผานหรอกรอกชอสมาชกควรมค าอธบายใหทราบและควรอยในต าแหนงทผใชเหนไดชดเจน

Page 14: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/31/บทที่ 2.pdf · องค์ประกอบเว็บไซต์

18

2.5 ขนตอนการพฒนาเวบไซต

ดวงพร เกยงค า (2549:27-33)ไดกลาวถงขนตอนการพฒนาเวบไซตไวดงน

ภาพท 2.1 ขนตอนการพฒนาเวบไซต

2.5.1 ก าหนดเปาหมายและวางแผน (Site Definition and Planning) ในการพฒนาเวบไซตเราควรก าหนดเปาหมายและวางแผนไวลวงหนา เพอใหการก าหนดขนตอๆไปมแนวทางทชดเจน เรองหลกๆทเราควรท าในขนตอนนประกอบดวย 1) ก าหนดวตถประสงคของเวบไซต เพอใหเหนภาพทชดเจนวาเวบไซตนตองการน าเสนอหรอตองการใหเกดผลอะไร เชน เปนเวบส าหรบใหขอมลหรอขายสนคา ซงวตถประสงคนจะเปนตวก าหนดรายละเอยดอนๆทจะตามมา เชน โครงสรางของเวบไซต รวมท งลกษณะหนาตาและสสนของเวบเพจในกรณทเปนเวบไซตของบรษทหรอองคกร วตถประสงคนจะตองสอดคลองกบภารกจขององคกร 2) ก าหนดกลมผชมเปาหมาย เพอจะไดรวาผชมหลกของเราคอใคร และออกแบบเวบไซตใหตอบสนองความตองการหรอโดนใจผชมกลมนนใหมากทสดไมวาจะเปนการเลอกเนอหา โทนส กราฟก เทคโนโลยทน ามาสนบสนน และอนๆ

ก าหนดเปาหมายและวางแผน (Site Definition and Planning)

วเคราะหและจดโครงสรางขอมล (Analysis and Information Architecture) XPlanning)

ออกแบบเวบเพจและเตรยมขอมล ( Page Design and Content Editing)

ลงมอสรางแบบทดสอบ (Construction and Testing)

เผยแพรและสงเสรมใหเปนทรจก ( Publishing and Promotion)

ดแลและปรบปรงตอเนอง (Maintenance and Innovation)

Page 15: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/31/บทที่ 2.pdf · องค์ประกอบเว็บไซต์

19

3) เตรยมแหลงขอมล เนอหาหรอขอมลคอสาระส าคญทแทจรงของเวบไซตเราตองรวาขอมลทจ าเปนตองใชจะมาจากแหลงใดบาง 4) เตรยมทกษะหรอบคคล การสรางเวบไซตตองอาศยทกษะหลายๆดาน เชน ในการเตรยมเนอหา ออกแบบกราฟก เขยนโปรแกรม และการดแลเวบเซรฟเวอรเปนตนซงถาเปนเวบไซตขนาดใหญอาจจะตองใชบคลากรเปนจ านวนมาก แตส าหรบเวบไซตเลกๆทตองดแลเพยงคนเดยว เรากจะตองศกษาหาความรในเรองนนๆเพอเตรยมพรอมเอาไว 5) เตรยมทรพยากรตางๆทจ าเปน เชน โปรแกรมส าหรบสรางเวบไซต โปรแกรมส าหรบสรางกราฟก ภาพเคลอนไหว และมลตมเดย โปรแกรมยทลตอนๆทตองใช การจดทะเบยนโดเมนเนม ตลอดจนการเตรยมหาผใหบรการรบฝากเวบไซต(Web Hosting)และเลอกแผนบรการทเหมาะสม 2.5.2 วเคราะหและจดโครงสรางขอมล (Analysis and Information Architecture) ข นตอนนจะเปนการน าขอมลตางๆทรวบรวมไดจากข นแรกไมวาจะเปนวตถประสงคของเวบไซต คณลกษณะขอจ ากดของกลมผชมเปาหมาย รวมทงเนอหาหลกของเวบไซต น ามาประเมน วเคราะหและจดระบบ เพอใหไดโครงสรางขอมล และขอก าหนดซงจะใชแปนกรอบส าหรบการออกแบบและด าเนนการในขนตอนตอไปผลทไดรบจากขนนควรประกอบไปดวย

1) แผนผงโครงสรางเซบไซต(Site Structure)สารบญ (Table of Content),ล าดบการน าเสนอ(Storyboard) หรอผงงาน(Flowchart)

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

3) องคประกอบตางๆทจะน ามาใชในเวบเพจมอะไรบาง เชน รปภาพและกราฟก เสยง วดโอ มลตมเดย แบบฟอรม ฯลฯ อะไรบางทบราวเซอรของผผชมสนบสนนและอะไรบางทตองอาศยโปรแกรมเสรม

4) ขอก าหนดเกยวกบลกษณะหนาตาและรปแบบของเวบเพจ 5) ขอก าหนดของโปรแกรมภาษาสครปตหรอเวบแอพพลเคชน และฐานขอมลท

ใชในเวบไซต 6) คณสมบตของเวบเซรฟเวอร รวมถงขอจ ากดและบรการเสรมตางๆทมให

Page 16: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/31/บทที่ 2.pdf · องค์ประกอบเว็บไซต์

20

2.5.3 ออกแบบเวบเพจและเตรยมขอมล (Page Design and Content Editing) เปนขนตอนการออกแบบเคาโครงหนาตา และลกษณะดานกราฟกของหนาเวบเพจเพอใหผชมเกดอารมณความรบรตอเวบเพจตามทเราตองการ ดงนนผทท าหนาทนจงควรมความสามารถทางศลปะพอสมควร โปรแกรมทเหมาะจะใชในการออกแบบคอ Adobe Photoshop หรอ Macromedia Fireworks ซงผลทไดจะประกอบดวยไฟลกราฟกตางๆทใชบนเวบเพจเชน โลโก ภาพพนหลง ปมเมน ไอคอนทเปนหวคอลมน และแบนเนอรโฆษณา การออกแบบเวบเพจยงรวมไปถงการก าหนดสสนและรปแบบของสวนประกอบตางๆทไมใชภาพกราฟก เชน ฟอนต ขนาดและสขอความ สพนบรเวณทวาง สและลวดลายของเสนขอบ เปนตน นอกจากนองคประกอบเสรมอนๆของเวบเพจกตองถกเตรยมไวดวย เชน ภาพเคลอนไหวFlash และโปรแกรมJavaScript ทใชโตตอบกบผชม หรอเลนเอฟเฟคตตางๆ ในสวนของเนอหา ขนตอนนจะเปนการน าเสนอเนอหาทเลอกไวมาปรบแก และตรวจทานความถกตอง เพอใหพรอมส าหรบจะน าไปใสเวบเพจแตละหนาในขนตอนถดไป 2.5.4 ลงมอสรำงและทดสอบ (Construction and Testing) เปนขนตอนทเวบเพจจะถกสรางขนมาจรงทละหนาๆ โดยอาศยเคาโครง และองคประกอบกราฟกตามทออกแบบไวเนอหาตางๆจะถกน ามาใสและจดรปแบบ ลงคและระบบน าทางถกสราง องคประกอบเสรมตางๆถกวางเขาทอยางไรกตาม เมอลงมอสรางเวบเพจจรงเราอาจพบวาสงทออกแบบไวแลว บางอยางไมเหมาะสม หรอควรไดรบการปรบแตง กสามารถท าได โปรแกรมทใชในขนตอนนกคอโปรแกรมส าหรบสรางเวบไซต เชน Macromedia Dreamweaver ,Adobe Golive, Microsoft FrontPage และ WebExpression ทจะมาแทน Frontpage เวบไซตทสรางขนมาควรไดรบการทดสอบกอนทจะน าออกเผยแพร ไมวาจะเปนในเรองความถกตองของเนอหา การท างานของลงคและระบบน าทาง ตรวจหาความผดพลาดของโปรแกรมสครปตและฐานขอมล นอกจากนกควรทดสอบโดยใชสภาพแวดลอมทเหมอนกบของกลมผชมเปาหมายเชน เวอรชนของบราวเซอร ความละเอยดของจอภาพและความเรวทเชอมตอกบอนเทอรเนตเพอดวาผชมเปาหมายสามารถชมเวบไซตไดอยางสมบรณและมประสทธภาพหรอไม

2.6 ขอผดพลาดของการออกแบบเวบไซต ประเวศน วงษค าชย (2552:77-78) ไดกลาวถงความผดพลาดในการออกแบบเวบไซตไวดงน

2.6.1 ใชโครงสรำงหนำเวบเปนระบบเฟรม การใชระบบเฟรมในเวบไซตสรางความสบสนใหกบผใชอยางมากท าใหผใชไมสามารถทจะ bookmark หนาเวบทสนใจเพอกลบเขามา

Page 17: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/31/บทที่ 2.pdf · องค์ประกอบเว็บไซต์

21

ใชอกได การแสดงชอไฟลของ URL ไมถกตอง การสงใหพมพผลลพธไมแนนอนนอกจากนนผใชยงไมสามารถคาดการไดวาจะเกดการเปลยนแปลงขนทมมไหนหลงจากคลกทลงคแลว 2.6.2 ใชเทคโนโลยขนสงโดยไมจ าเปน การใชเทคโนโลยขนสงเพอแสดงฝมอหรอดงดดความสนใจจากผใชอาจจะใชไดเฉพาะกบกลมผใชทมประสบการณสงเทานนเนองจากผใชสวนใหญสนใจกบเนอหาและการใชงานมากกวา และไมมความพรอมทจะใชเทคโนโลยขนสงทเพงออกมาลาสด 2.6.3 ใชตวหนงสอหรอภาพทเคลอนไหวตลอดเวลา ในหนาเวบไมควรมองค ประกอบทเคลอนไหวตลอดเวลามากเกนไป ไมวาจะเปน Scrolling Text, Blink Text, Marquees เพราะสงเหลานอาจสรางความร าคาญและรบกวนสายตาผอานหรอสรางความสบสนใหกบผใชมากขน

2.6.4. ทอย เวบไซตทซบซอน(URL) ยากแกการจดจ าและพมพทอยเวบไซตทซบซอนนนอาจจะอยในรปของชอทมความยาวมาก สะกดล าบาก การใชตวอกษรพมพเลกผสมกบตวพมพใหญ รวมไปถงการใชตวอกษรพเศษเชน เสนใต( __ ) ยตภงค(-) และเครองหมาย (~) ทมกจะท าใหสบสน นอกจากนทอยของเวบไซตควรสอถงโครงสรางของขอมลภายในเวบไซตดวย 2.6.5 ไมมการแสดงชอและทอยของเวบไซตในหนาเวบเพจ เนองจากผใชบางคนจะเขาสหนาทเปนขอมลผานระบบคนหาหรอSearch Engineโดยไมไดผานหนาโอมเพจมากอนท าใหผใชไมสามารถรไดวาก าลงใชงานเวบอะไรและจะกลบเขามาใชอกไดอยางไรเพราะในหนานนไมมชอหรอทอยของเวบไซตใหเหน

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

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

Page 18: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/31/บทที่ 2.pdf · องค์ประกอบเว็บไซต์

22

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

2.6.10 เวบเพจแสดงผลชา กราฟกขนาดใหญจะมผลท าใหเวบเพจนนตองใชเวลาในการดาวนโหลดมากขน โดยถาใชเวลานานกวา 15 วนาทขนไปกอาจจะท าใหผใชขาดความสนใจ เนองจากผใชมความอดทนรอการแสดงผลของเวบเพจไดจ ากดซงมรายงานวจยบอกไววา ถาโหลดมากกวา 8 วนาทผใชกวารอยละ 90 จะเปลยนไปดเวบอนแทน สรปการสรางเวบไซตทดนน ตองอาศยหลกการออกแบบและการจดระบบขอมลทเหมาะสมเพอใหเวบไซตทสรางขนมความนาสนใจและสรางความประทบใจใหกบผใชบรการท าใหอยากกลบเขามาใชบรการอกในอนาคต ซงการออกแบบเวบไซตทดนนนอกจากจะสรางความประทบใจใหกบผใชบรการแลวยงท าใหไดเปรยบเหนอเวบไซตของคแขง หรอทก าลงจะเกดขนในอนาคตได โดยการออกแบบเวบไซตทดนนไมไดหมายถงเฉพาะการออกแบบหนาตาของเวบไซตเพยงอยางเดยวเทานนแตจะเกยวของตงแตการเรมตนก าหนดเปาหมายของเวบไซต ระบกลมผใช การจดระบบกลมขอมล การสรางระบบเนวเกชน การออกแบบหนาเวบ รวมไปถงการใชกราฟก การเลอกใชส และรปแบบตวอกษรทเหมาะสม

3. เวบเพจ 3.1 ความหมายของเวบเพจ เวบเพจ หมายถง หนาเอกสารทใชแสดงขอมลในรปแบบตางๆบนเวบไซตโดยขอมลจะถกสรางขนจากภาษา HTML (Hypertext Markup Language) แตละเวบเพจสามารถประกอบดวย ขอความ รปภาพ เสยง และวดโอ ซงเปรยบเสมอนหนากระดาษแตละหนาทมเรองราว เนอหาตางๆบรรจอยในหนงสอหรอนตยสารเพยงแตจะแตกตางกนตรงทจะมการแสดงผลผานทาง

Page 19: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/31/บทที่ 2.pdf · องค์ประกอบเว็บไซต์

23

เวบบราวเซอรบนอนเทอรเนตและสามารถเชอมโยงถงกนไดทงในเวบเพจเดยวกนหรอตางเวบเพจ(สธ พงศาสกลชย และณรงค ล าด,2551: 116) เวบเพจ หมายถง ไฟลขอมล HTML หรอเปนขอมลในระบบเวลดไวดเวบ (www) ซงประกอบดวยค าหรอวลพเศษทเรยกวาไฮเปอรเทกซหรอเปนการเชอมตอแบบไฮเปอรลงค ทงไฮเปอรเทกซและไฮเปอรลงค กเปนการเชอมโยงเพอตดตอไปยงเวลดไวดเวบ เซรฟเวอร แหลงตางๆทถกก าหนดไวบนเวลดไวดเวบนนๆ (วทยา เรองพรวสทธ,2542:46) ดงนนจงสรปไดวา เวบเพจ หมายถง หนาแตละหนาของเอกสารทสรางขนจากภาษา

HTML โดยมนามสกล .html หรอ .htm ซงสามารถแสดงผลผานทางเวบบราวเซอรและเชอมโยงกนไดภายในหนาเวบเดยวกน ตลอดจนเชอมโยงกนระหวางเวบไซตดวย 3.2 หลกการออกแบบเวบเพจ ปจจบนอนเทอรเนตไดกระจายไปทวทกมมโลกซงในแตละวนจะมจ านวนเวบไซตเพมขนบนเครอขายเปนจ านวนมากเพราะใครๆกสามารถสรางเวบไซตเปนของตวเองไดแตการท าเวบไซตใหเปนทนยมและสะดดตาของผเขาชมจงเปนสงส าคญอกประการหนง ดงนนบคคลหรอองคกรทตองการสรางเวบไซตเพอทจะเผยแพรสารสนเทศตางๆจงจ าเปนตองศกษาแนวทางในการออกแบบเพอใหสะดดตาและมประโยชนกบผชมมากทสด

3.2.1 ลกษณะของการออกแบบเวบเพจ 1) ควรมรายการสารบญแสดงรายละเอยดของเวบเพจนน ผสรางควรแสดงรายการทงหมดทเวบเพจนนมอยใหผใชทราบ โดยอาจท าอยในรปแบบสารบญหรอการเชอมโยง การสรางเวบเพจนจะชวยใหผใชสามารถคนหาขอมลภายในเวบเพจอยางรวดเรว 2) เชอมโยงขอมลไปยงเปาหมายไดตรงกบความตองการมากทสด ถาขอมลทน ามาแสดงมเนอหามากเกนไปจนไมสามารถน าขอมลทงหมดมาแสดงไดอนเนองมาจากสาเหตใดๆกตามควรทจะน าเอาแหลงขอมลนนมาสรางเปนจดเชอมโยงเพอทผใชจะคนหาขอมลไดอยางถกตองและกวางขวางยงขน การสรางจดเชอมโยงนนสามารถจดท าในรปตวอกษรหรอรปภาพกไดแตควรทจะแสดงจดเชอมโยงใหผใชสามารถเขาใจไดงาย 3) เนอหากระชบ สนและทนสมยเนอหาทน าเสนอกบผใชควรเปนเรองทก าลงมความส าคญอยในความสนใจของผใชหรอเปนเรองทตองการใหผใชทราบและควรปรบปรงใหทนสมยอยเสมอ

Page 20: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/31/บทที่ 2.pdf · องค์ประกอบเว็บไซต์

24

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

5) การใสภาพประกอบ ควรใสรปภาพทสามารถสอความหมายกบผใชไดตรงตามวถประสงค การใชรปภาพเพอเปนพนหลงไมควรเนนสสนทฉดฉาดมากนกเพราะอาจจะไปลดความเดนชดของเนอหาควรใชภาพทมสออนไมสวางจนเกนไป ตวอกษรทน ามาอสดงกเชนกนควรเลอกขนาดทอานงายไมมสสนและลวดลายเกนความจ าเปฯอกประการกนงคอรปภาพทน ามาประกอบนนไมควรมขนาดใหญหรอมจ านวนมากเกนไปเพราะอาจจะท าใหเนอหาสาระของเวบเพจนนถกลดความส าคญลง 6) เขาสกลมเปาหมายไดอยางถกตอง การก าหนดกลมเปาหมายอยางชดเจนยอมท าใหผสรางสามารถก าหนดเนอหาและเรองราวเพอใหตรงกบความตองการของผใช

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

3.2.2 ขนาดของเวบเพจ (Webpage) 1) จ ากดขนาดแฟมของแตละหนา โดยการก าหนดขดจ ากดเปนกโลไบตส าหรบ “น าหนก”ซงหมายถง จ านวนรวมกโลไบตของกราฟฟกทงหมดในหนา โดยรวมภาพพนหลงดวย 1 จ านวนแฟมของแตละหนา โดยการก าหนดขดจ ากดเปนกโลไบต ส าหรบขนาดน าหนกของแตละหนา ซงหมายถง จ านวนรวมกโลไบตของภาพกราฟฟกทงหมดทงหนา โดยรวมภาพพนหลงดวยใชแคชของเวบบราวเซอร โปรแกรมคนผานทใชกนในปจจบนนจะเกบบนทกภาพกราฟฟกไวในแคช(Cache) ซงหมายถงการทโปรแกรมเกบกราฟฟกไวในฮารดดสก เพอทโปรแกรมจะไดไมตองบรรจภาพเดยวกนนนมากกวา 1 ครง ซงเปนผลดตอการน าภาพนนมาเสนอซ าเมอใดกไดนบเปนการจดหนา 2) ก าหนดความยาวของหนาใหสน โดยการก าหนดจ านวนของขอความทบรรจในแตละหนา โดยควรมความยาวระหวาง 200-500 ค า

Page 21: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/31/บทที่ 2.pdf · องค์ประกอบเว็บไซต์

25

3) น าสารสนเทศทส าคญทสดเอาไปไวในสวนบนของหนา ถาเปรยบเทยบเวบไซตกบสถานทแหงหนง เนอททมคาทสดจะอยในสวนหนา ซงกคอสวนบนสดของจ าภาพนนเอง ถาไมตองการใหผอานพลาดสาระส าคญของเนอหา กควรใสไวสวนบนสดของหนา 4)ใชความไดเปรยบของตาราง ตารางจะเปนสงทอ านวยประโยชนและชวยนกออกแบบไดเปนอยางมาก การใชตารางจ าเปนส าหรบหนาเวบทซบซอนโดยเฉพาะเมอตองการใชคอลมน ตารางจะใชไดเปนอยางดเมอตองการจดระเบยบหนา เชน การแยกกราฟก หรอเครองมอน าทางออกจากขอความ หรอจดแบงขอความออกเปนคอลมน

3.2.3 ลกษณะของตวอกษร ธวชชย ศรสเทพ (2544:256) กลาววา ตระกล(Family) ของตวอกษรจะประกอบดวยรปแบบพนฐาน 3 แบบ คอ ตวปกต, ตวหนา และตวเอยง อยางไรกด ตวอกษรในหลายๆตระกลไดออกแบบใหมความหลากหลายมากขนในหลายๆลกษณะ เชน ลกษณะน าหนกตวอกษรจากเบามามาก (ultra light) ไปจนถงเขมมาก(ultra black) ลกษณะความกวางแบบหนาแนน(condensed)จนถงแบบแผกวาง (extended)และยงมลกษณะอนๆอกมากมาย ถนอมพร เลาหจรสแสง (2545:168) กลาววา ตวเอนเปนตวอกษรทอานไดยากดงนนไมควรจะใชตวเอนส าหรบขอความทยาวมากเกนไป นอกจากนตวอกษรตวหนานน กควรเกบไวใชเพอเนนประเดนส าคญๆไมควรใชตวหนามากเกนไป 3.2.4 การจดขอความในหนาเวบ

ธวชชย ศรสเทพ (2544:258 ) กลาววา การจดต าแหนงของตวอกษรในแตละสวนมผลตอความรสกของเอกสารโดยทการจดต าแหนงแตละแบบจะไดความรสกทตางกน ตวอกษรทถกจดใหชดขอบดานซายโดยทปลอยใหดานขวามลกษณะไมสม าเสมอ จะใหความรสกไมเปนทางการและจะอานไดงายกวาชดขอบดานขวา โดยทวไปแลวจะพยายามหลกเลยงการชดขอบขวา ยกเวนเมอมความเหมาะสมกบรปแบบจรงๆสวนตวอกษรทมการปรบระยะใหชดขอบทงซายและขวา เปนทนยมใชในหนงสอพมพและจลสาร พรอมกบใหความรสกทเปนทางการ ในภาษา HTML สามารถจดต าแหนงตวอกษรไดดวยค าสง ALIGN เลอกคาเปน left,right , center , justify

Page 22: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/31/บทที่ 2.pdf · องค์ประกอบเว็บไซต์

26

ตารางท 2.1 การจดขอความในการน าเสนอขอความบนเวบ

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

จดชดขวา แมวาการจดตวอกษรใหชดขอบขวา จะดนาสนใจ แตจดเรมตน

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

จดกงกลาง การจดตวอกษรใหอยกงกลาง ใชไดผลดกบขอมลทมปรมาณ

ไมมากเหมาะสมกบรปแบบทเปนทางการ เชน

ค าประกาศ หรอค าเชอเชญ จดชดขอบซายและขวา

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

3.2.5 การใชสตวอกษรและสพน

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

1) สรางความสนใจใหกบผเยยมชม ทงนมผลมาจากความแตกตางกนของส 2) กอใหเกดผลทางจตวทยา เนองจากสมผลตออารมณของผเยยมชม 3) ท าใหจ าไดงาย เมออธบายถงสงใดสงหนงและอางถงสของสงนนจะท าให

สามารถระลกถงไดงาย 4) สรางบรรยากาศทด เนองจากการเลอกใชสทเหมาะสมท าใหเกดความพอใจและ

ความสบายตาใหแกผด ขอพจารณาส าหรบการใชสบนตวอกษร ขอความ คอ จะตองใหชดเจนอานงาย ควรงดเวนการใชสรตรงกนขามในปรมาณเทาๆกนบนพนทเดยวกนหรอใกลเคยงกนเพราะจะท าใหผดตองเพงมองมากยงขน ท าใหเกดภาพซอนพรามว โดยเฉพาะสวนทเปนเนอหาสาระ เชน ตวอกษร

Page 23: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/31/บทที่ 2.pdf · องค์ประกอบเว็บไซต์

27

สแดงบนพนเขยว ความเดนชดของขอความทตองการจะเนนดวยความตางของสจงควรค านงเรองคาน าหนกของส(Tone of Colour) ใหมากทสด กดานนท มลทอง(2543:71) กลาวาพนหลงทมลวดลายมากจะท าใหเวบเพจมความยากล าบากในการอาน การใชสรอนทมความเปรยบตางสงจะท าใหไมสบายตาในการอานเชนกน ดงนนไมควรใชสพนทมลวดลายเกนความจ าเปนควรใชสเยนเปนพนหลงจะท าใหเวบเพจนนนาอานยงกวา ประเวศน วงษค าชย(2552:132) กลาววา สเปนเครองมอทมความส าคญมากในการออกแบบเวบไซตเนองจากสสามารถสอถงความรสกอารมณและชวยสรางความสมพนธระหวางสถานทกบเวลาดงนนสจงเปนปจจยส าคญทจะชวยเสรมสรางความหมายขององคประกอบใหกบ เวบเพจไดเปนอยางด ประโยชนของสในรปแบบตางๆมดงน

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

2. สชวยเชอมโยงบรเวณมไดรบการออกแบบเขาดวยกนผอานจะมความรสกวาบรเวณทมสเดยวกนจะมความส าคญเทากนวธการเชอมโยงแบบนชวยจดกลมของขอมลทมความสมพนธอยางไมเดนชดเขากนได

3. สสามารถน าไปใชในการแบงบรเวณตางๆออกจากกน

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

5. สสามารถสรางอารมณโดยรวมของเวบเพจและกระตนความรสกตอบสนองจากผชมไดนอกเหนอจากความรสกทไดรบจากสตามหลกจตวทยาแลวผชมยงอาจมอารมณและความรสกสมพนธกบสบางสหรอบางกลมเปนพเศษ

6. สชวยสรางระเบยบใหกบขอความตางๆ เชน การใชสแยกสวนระหวางหวเรองกบตวเรอง หรอ การสรางความแตกตางใหกบขอความบางสวนโดยใชสแดงส าหรบค าเตอน หรอใชสเทาส าหรบสงทเปนทางเลอก

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

Page 24: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/31/บทที่ 2.pdf · องค์ประกอบเว็บไซต์

28

4. เวบไซตส านกบณฑตศกษา มหาวทยาลยสโขทยธรรมาธราช ส านกบณฑตศกษา เปนหนวยงานสงเสรมมาตรฐานบณฑตสสากล สนบสนนการ

จดการเรยนการสอนและบรการการศกษาททนสมยและครบวงจรโดยใชเทคโนโลยทเหมาะสม ในระบบการศกษาทางไกลและมภารกจเกยวกบ การสนบสนนและใหบรการงานบณฑตศกษาแกสาขาวชาตางๆทเปดสอนระดบบณฑตศกษา ประสานงานการใหบรการทางวชาการ ประสานงานภายในและภายนอกเกยวกบการด าเนนงานระดบบณฑตศกษา และสนบสนนดานการวจยของนกศกษา เวบไซตส านกบณฑตศกษา หมายถง ทอยของเวบไซตส านกบณฑตศกษา คอ http://www.stou.ac.th/thai/grad_stdy/default.asp โดย มหนวยงานทดแลขอมลสารสนเทศและพฒนาเวบไซตคอส านกบณฑตศกษา มหาวทยาลยสโขทยธรรมาธราช โดยส านกบณฑตศกษายงไดแจงขาวสารความเคลอนไหวเกยวกบการรบสมครนกศกษา ขอมลหลกสตรการศกษา ก าหนด การจดกจกรรมตางๆ ขอมลการจดท าวทยานพนธ การดาวนโหลดแบบฟอรมและ แผนกจกรรม ระบบงานทะเบยน การตรวจสอบผลการเรยนและกระดานสนทนา ของส านกบณฑตศกษา ผานเครอขายอนเทอรเนต เพออ านวยความสะดวกและรวดเรวแกนกศกษา ดงแผนผงโครงสรางเวบไซตส านกบณฑตศกษา ดงตอไปน Homepage

ตรวจสอบผลการเรยน รบสมครนกศกษา

o นกศกษาปรญญาเอก รบสมครนกศกษา ตรวจสอบใบสมครและประกาศผล

o นกศกษาปรญญาโทและประกาศนยบตรบณฑต รบสมครปรญญาโท และประกาศนยบตรบณฑต ตรวจสอบใบสมครระดบประกาศนยบตรบณฑต และปรญญาโท ผลการคดเลอกระดบปรญญาโท และประกาศนยบตรบณฑต

Page 25: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/31/บทที่ 2.pdf · องค์ประกอบเว็บไซต์

29

o การสมครเปนนกศกษา การสมครเปนนกศกษา การจ าหนายระเบยบการสมคร ขนตอนการสมคร หลกฐานประกอบการสมคร รายละเอยดคาใชจายในการสมครและลงทะเบยนเรยน ขนตอนหลงจากรบการคดเลอกเขาศกษา

ขอมลหลกสตรการศกษา o หลกสตรการศกษา o ขอมลการเรยนการสอน

ลกษณะการเรยนการสอน ลกษณะขอสอบ หลกสตรประกาศนยบตรบณฑตแขนงวชาหลกสตรและการสอน

ก าหนดการตางๆ o ก าหนดการปฐมนเทศ o ปฏทนการศกษา/ตารางสอบไล

ปฏทนการศกษา ก าหนดการสอบไล

o ก าหนดการสอบ ก าหนดการสอบสมฤทธบตร ก าหนดการสอบดษฎนพนธ ก าหนดการสอบวทยานพนธ ก าหนดการสอบคนควาอสระ ก าหนดการสอบประมวลความร

o ก าหนดการสมมนา ก าหนดการสมมนาเสรมชดวชาปรญญาโท ก าหนดการสมมนาเขมชดวชาปรญญาโท ก าหนดการสมมนาเขมชดวชาวทยานพนธ/คนควาอสระ ก าหนดการอบรมเขมชดวชาประสบการณวชาชพมหาบณฑต ก าหนดการสมมนาเขมระดบประกาศนยบตรบณฑต

Page 26: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/31/บทที่ 2.pdf · องค์ประกอบเว็บไซต์

30

ก าหนดการสมมนาเขมชดวชาระดบปรญญาเอก ก าหนดการสมมนาเขมดษฎนพนธ ก าหนดการสมมนาส าหรบศนยวทยฯ

วทยานพนธ/IS o ตรวจรปแบบ ว.พ./IS

การตรวจบทคดยอ วพ.ภาษาองกฤษ การตรวจรปแบบ วพ./คนควาอสระ การยกเลกเลข ISBN บรการถายเอกสารเขาเลม วพ./IS

o ทน/รางวลวทยานพนธ/ดษฎนพนธ สมครขอทน วพ./ดษฎนพนธ ประกาศใหทน วพ./ดษฎนพนธ ค าแนะน าการรบทน วพ./ดษฎนพนธ ใบสมครการรบทน วพ./ดษฎนพนธ ประกาศการใหรางวล ใบสมครขอรบการใหรางวล วพ.

STOU-EPT o รายละเอยด STOU-EPT

Download o แบบฟอรม

แบบฟอรมตางๆ Templete การพมพวทยานพนธ/คนควาอสระ Templete การพมพดษฎนพนธ แบบฟอรม วทยานพนธ/TS

o แผนกจกรรม

o ขอมลส าหรบสมมนาชดวชา คาใชจายในการลงทะเบยน ป.โท

งานทะเบยน o การลงทะเบยน

Page 27: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/31/บทที่ 2.pdf · องค์ประกอบเว็บไซต์

31

คาใชจายในการลงทะเบยนป.โท รายชอชดวชาทเปดใหลงทะเบยนเรยน แนวปฏบตในการลงทะเบยนเรยน วธการลงทะเบยนและการช าระคาลงทะเบยน การถอนชดวชา การโอนชดวชา การลาพกการศกษา การลงทะเบยนชดวชาวทยานพนธ/การศกษาคนควาอสระ การลงทะเบยนเรยนเพอยกระดบคะแนน เกณฑการลงทะเบยนอบรมเขมประสบการณวชาชพมหาบณฑต การส าเรจการศกษา

o การเปลยนแปลงขอมลนกศกษา การเปลยนทอย การเปลยนค าน าหนาชอ ชอและชอสกล การขอตออายสถานภาพนกศกษา การสอบและผลการสอบ

ตรวจสอบขอมล(เฉพาะเจาหนาท) Link

o สมคร SMSรบขาวสาร o STOU Information o STOU-e-Learning o STOU e-Library o Media on Demand o เวบไซตทนาสนใจ o STOU Live M@il o STOU M@il

Page 28: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/31/บทที่ 2.pdf · องค์ประกอบเว็บไซต์

32

ภาพท 2.2 แผนผงเวบไซตส านกบณฑตศกษา

Homepage

Page 29: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/31/บทที่ 2.pdf · องค์ประกอบเว็บไซต์

33

4 งานวจยทเกยวของ กฤตยา ไวยมย (2546) ศกษาเรองการใชเวบไซตส านกหอสมดกลาง มหาวทยาลยรามค าแหงของนกศกษาระดบปรญญาโท มหาวทยาลยรามค าแหง พบวาวตถประสงคในการใชเวบไซต ส านกหอสมดกลางเพอท ารายงานมความถในการเขาใช 1-2 ครงตอเดอนและใชโดยไมระบวน ในชวงเวลา 16.00-20.00 น ในแตละครงใชเวลาประมาร 20 นาทถง 40 นาท ปญหาและอปสรรคในการใชบรการเวบไซตส านกหอสมดกลางของนกศกษา พบวานกศกษาสวนใหญไมมเวลาในการใชเวบไซตอยางเพยงพอและไมทราบแหลงสารสนเทศขาดความช านาญในการใชเวบไซต ปญหาทเกยวกบเวบไซตหอสมดกลางมากทสดคอ ใชเวลานานในการเขาถงเวบไซตหอสมดกลางรองลงมาไดแกขาดแผนผงเวบไซตและสารสนเทศทน าเสนอบนเวบไซตไมครอบคลมสารสนเทศทตองการ นฐพงษ เจนวรวฒน (2546) ศกษาเรองการพฒนาเวบไซตของบณฑตวทยาลย มหาวทยาลยบรพา โดยการส ารวจสภาพปญหาและความตองการของผบรหารบณฑตวทยาลยตลอดจนผใชงาน รวมถงการส ารวจเวบไซตของบณฑตวทยาลย มหาวทยาลยตางๆ น าขอมลทไดมาก าหนดคณสมบตของเวบไซตทจะพฒนา แลวด าเนนการพฒนาดวยโปรแกรมดรมเวบเวอร เอมเอกซและการสรางภาพเคลอนไหวดวยโปรแกรมแฟลชเอมเอกซ จากนนท าการประเมนเวบไซตใน 4 ดาน คอ ดานรปแบบการน าเสนอและการออกแบบ ดานเนอหา ดานภาพ และดาน การเชอมโยง พบวา เวบไซตของบณฑตวทยาลย มหาวทยาลยบรพา มคณสมบตทางการออกแบบ ตามหลกการออกแบบ สามารถเรยกใชแบบฟอรม และฐานขอมลตางๆ ได และมความเหมาะสมโดยภาพรวมอยในระดบด

ไพลน จตเจรญสมทร (2547) ศกษาเรองการใชสารสนเทศของอาจารยและนกศกษาระดบบณฑตศกษา สถาบนเทคโนโลยพระจอมเกลาพระนครเหนอ พบวา กลมอาจารยมวตถประสงคในการใชสารสนเทศทส าคญ คอ เพอการคนควาในการสอนและการปฏบตงาน ทรพยากรสารสนเทศทใชสงสดคอ หนงสอต ารา ปญหาการใชบรการสารสนเทศ คอ ส านกหอสมดกลางมหนงสอต าราหลกตอชอเรองนอยฉบบ ความตองการบรการสารสนเทศสงสด คอ บรการแจงรายชอหนงสอใหมของส านกหอสมดกลาง ในสวนการเปรยบเทยบการใชสารสนเทศ ปญหาการใชบรการสารสนเทศและความตองการบรการสารสนเทศของอาจารยจ าแนกตามกลมคณะและประสบการณโดยรวมพบวา ไมมความแตกตางกนอยางมนยส าคญทางสถต ส าหรบนกศกษาระดบบณฑตศกษาพบวา มวตถประสงคในการใชสารสนเทศทส าคญ คอ เพอการคนควาประกอบการเรยนรายวชา ทรพยากรสารสนเทศทใชสงสด คอ หนงสอต ารา ปญหาการใชบรการ

Page 30: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/31/บทที่ 2.pdf · องค์ประกอบเว็บไซต์

34

สารสนเทศระดบสงสด คอ ส านกหอสมดกลางจดหาหนงสอใหมลาชา ความตองการบรการสารสนเทศสงสด คอ บรการรวบรวมบรรณานกรมเฉพาะสาขาวชา การเปรยบเทยบการใชสารสนเทศจ าแนกตามกลมคณะโดยรวมแตกตางกนอยางมนยส าคญทางสถต ทระดบ.05 โดยกลมคณะวทยาศาสตรประยกต คณะเทคโนโลยสารสนเทศและคณะศลปศาสตรประยกต มการใชสารสนเทศมากกวากลมคณะครศาสตรอตสาหกรรมและกลมคณะวศวกรรมศาสตร สวนการเปรยบเทยบปญหาการใชบรการสารสนเทศและการเปรยบเทยบความตองการบรการสารสนเทศของนกศกษาระดบบณฑตศกษาจ าแนกตามกลมคณะโดยรวมพบวาไมมความแตกตางกน พลเดช ณ ปอมเพชร (2550) ศกษาเรองการศกษาเปรยบเทยบความพงพอใจการใชเวบไซตของนกศกษามหาวทยาลยราชภฏพระนครและมหาวทยาลยสยาม พบวา นกศกษามหาวทยาลยราชภฏพระนคร ทอยตางคณะและมเพศทแตกตางกนจะมความพงพอใจตอการใชเวบไซตทแตกตางกน สวนตวแปรในดานความเปนเจาของเครองคอมพวเตอร ไมพบความแตกตาง ขณะทนกศกษามหาวทยาลยสยามทสงกดคณะทแตกตางกนจะมความพงพอใจตอเวบไซตทแตกตางกน สวนตวแปร เพศและความเปนเจาของเครองคอมพวเตอร ไมพบความแตกตาง ส าหรบตวแปรรายได พบวา นกศกษามหาวทยาลยสยามมความสมพนธเชงบวกกบความพงพอใจในการใชเวบไซตและในสวนของนกศกษามหาวทยาลยราชภฏพระนคร พบวา รายไดไมมความสมพนธกบความพงพอใจ ในดานการเปดรบเวบไซต พบวา นกศกษาทง 2 สถาบนใชสถานทในการเปดรบเวบไซตแตกตางกนแตมความพงพอใจตอเวบไซตไมแตกตางกน การใชประโยชนและความพงพอใจจากเวบไซตเพอตอบสนองความตองการของผใชบรการนน จ าเปนตองมการปรบปรงบรการดานตางๆ อาท เพมขดความสามารถของระบบเครอขาย โดยเพมประสทธภาพในการเขาถงเวบไซตใหรวดเรว ปรบปรงขอมลใหทนสมยอยเสมอ เพมความหลากหลายของการใหบรการ ออกแบบตกแตง และจดหมวดหมใหเปนระเบยบสวยงามเพอใหงายตอการสบคนขอมล รวมถง เพมอปกรณในการเขาถงระบบอนเทอรเนตใหเพยงพอ กบความตองการของนกศกษาทเพมมากขนในปจจบน และขยายเวลาการใหบรการ เพมโอกาสในการเขาถงสอของนกศกษา เพอขยายประสบการณดานการเรยนรของนกศกษา ตลอดจนเพมพนความรในสาขาวชาตางๆ และเพมโอกาสในการเรยนรตลอดชวต(Long-live learning) สภาพร เอยบสกล(2546) ศกษาเรองการใชสารสนเทศบนเครอขายอนเทอรเนตของนกศกษา ระดบปรญญาโท คณะมนษยศาสตร มหาวทยาลยของรฐในกรงเทพมหานคร พบวา นกศกษาสวนใหญใชบรการสารสนเทศบนเครอขายอนเทอรเนต โดยมวตถประสงคเพอตดตามขาวสาร และเพอประกอบการเรยนการสอน สวนการเรยนร พบวา ศกษาดวยตนเอง ทงภาษาไทยและภาษาองกฤษ ใชบรการสารสนเทศบนเครอขายอนเทอรเนต 1-3 ครงตอสปดาห และใชบรการ

Page 31: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/31/บทที่ 2.pdf · องค์ประกอบเว็บไซต์

35

สารสนเทศบนเครอขายอนเทอรเนตจากบานในระดบปานกลาง กลมของสารสนเทศบนเครอขายอนเทอรเนตทใชในระดบมากไดแก บรการไปรษณยอเลกทรอนกส สวนเนอหาสารสนเทศทศกษา ไดแก สารสนเทศบน World Wide Web การใชสารสนเทศบนเครอขายอนเทอรเนตของนกศกษาไมมความแตกตางตามเพศและอายอยางมนยส าคญทางสถต แตพบความแตกตางตามกลมสาขาวชา ปญหาและอปสรรคในการใชสารสนเทศบนเครอขายอนเทอรเนตของนกศกษาโดยรวมอยในระดบปานกลาง ปญหาทเกดจากผใช พบวา นกศกษาไมทราบแหลงสารสนเทศในสาขาวชาทเกยวของ และประเภทของสารสนเทศรวมท งแหลงสารสนเทศทมเนอหาทนสมยบนเครอขายอนเทอรเนต สวนปญหาทเกยวกบสารสนเทศบนเครอขายอนเทอรเนต พบวา นกศกษาไมทราบแหลงขอมลทมขอมลนาเชอถอและอางองได การเขาถงแหลงสารสนเทศบางประเภทมขอจ ากด ท าใหคนหาสารสนเทศไดยาก บงอร มากด (2546) ศกษาเรองความคาดหวงและความพงพอใจในการใชบรการระบบเครอขายอนเทอรเนตของนกศกษาระดบบณฑตศกษาตอการด าเนนงานภารกจเกยวกบการจดการศกษาในระดบบณฑตศกษา สถาบนราชภฏอบลราชธาน พบวานกศกษาระดบบณฑตศกษามความคาดหวงตอประโยชนทไดรบจากการใชบรการระบบเครอขายอนเทอรเนตในระดบสง นกศกษาระดบบณฑตศกษาไมมความพงพอใจในการใชบรการระบบเครอขายอนเทอรเนตในระดบสง นกศกษาระดบบณฑตศกษามความคาดหวงในการใชบรการระบบเครอขายอนเทอรเนตในดานการจดการเรยนการสอน การวจย และการเผยแพรวชาการในระดบสงแตไมมความคาดหวงในดานการบรหารในระดบสง นกศกษาระดบบณฑตศกษาไมมความพงพอใจในการใชบรการระบบเครอขายอนเทอรเนตในดานการจดการเรยนการสอน การวจย และการเผยแพรวชาการในระดบสงแตมความพงพอใจในดานการบรหารอยในระดบสง จากงานวจยทเกยวของทงหมดน จะเหนไดวามจดรวมทคลายกนคอการน าเทคโนโลยการสอสารผานคอมพวเตอรโดยใชเครอขายอนเทอรเนตมาประยกตใชเพอพฒนาการสรางเวบไซตในการตอบสนองการจดการเรยนการสอนในระดบบณฑตศกษาของมหาวทยาลยตางๆ ผลการวจยพบวา นกศกษามความคาดหวงในการใชเวบไซตเพอวตถประสงคในการตดตามขาวสารความเคลอนไหวและประกอบการเรยนการสอน การวจย เผยแพรงานวจยตางๆ และมปญหาอปสรรคในการใชเวบไซตคอ ไมมเวลา ไมทราบแหลงสารสนเทศ ขาดความช านาญในการใชเวบไซตรวมทงมปญหาการเขาใชเวบไซตทตองใชเวลานาน และไมมแผนผงเวบไซต ท าใหไมสามารถเขาถงขอมลทตองการไดอยางรวดเรว ดงนนการวจยเรองการใชเวบไซตส านกบณฑตศกษาของนกศกษาระดบบณฑตศกษามหาวทยาลยสโขทยธรรมาธราชจงไดน าแนวคดจากงานวจยทเกยวของมาศกษาการใชเวบไซตส านกบณฑตศกษาเพอน าผลการวจยในครงน มาเปนแนวทางในการพฒนาเวบไซต

Page 32: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/31/บทที่ 2.pdf · องค์ประกอบเว็บไซต์

36

ส านกบณฑตศกษาเพอใหบรการนกศกษาระดบบณฑตศกษา มหาวทยาลยสโขทยธรรมาธราชใหมประสทธภาพและสอดคลองกบแผนยทธศาสตรและวสยทศนของส านกบณฑตศกษาตอไป