ทฤษฎีการออกแบบเว็บ

32
แนวคิดเรื่องเทคโนโลยีสารสนเทศและอินเทอร์เน็ต คำว่ำอินเทอร์เน็ต (Internet) เป็นคำย่อของ Internetwork หมำยถึง เครือข่ำยคอมพิวเตอร์ที่ใหญที่สุดในโลก โดยเชื่อมโยงเครือข่ำยย่อยจำนวนมำกมำยมหำศำล นับตั้งแต่เครื่องคอมพิวเตอร์ส่วนบุคคลที่ใช้ งำนภำยในบ้ำนและสำนักงำนไปจนถึงคอมพิวเตอร์ขนำดใหญ่แบบเมนเฟรมในโรงงำนอุตสำหกรรมและ อินเทอร์เน็ตสำมำรถทำให้คนเรำสำมำรถติดต่อสื่อสำรกันได้อย่ำงรวดเร็วไม่ว่ำจะอยู่ส่วนใดของโลก แต่เดิมนั้น อินเทอร์เน็ต เป็นเครือข่ำยที่ใช้ในกิจกำรทำงทหำร ของสหรัฐอเมริกำชื่อ อำร์พำเน็ต(ARPANET : Advanced Research Projects Agency Network) ซึ่งเริ่มใช้ในกิจกำรเมื่อประมำณพ.ศ. 2512 คือ 39 ปีมำแล้ว ภำยหลังมีมหำวิทยำลัยหลำยแห่งขอร่วมเครือข่ำย โดยเชื่อมต่อระบบคอมพิวเตอร์ของมหำวิทยำลัยกับ เครือข่ำยดังกล่ำว เพื่อใช้ประโยชน์ในกำรศึกษำและกำรวิจัย ต่อมำเมื่อมีกำรใช้เทคนิคกำรสื่อสำรโต้ตอบทีเรียกว่ำโพรโทคอล (protocol)แบบเฉพำะของอินเทอร์เน็ตที่เรียกว่ำ Transmission Control Protocol/ Internet Protocol (TCP/IP) เครือข่ำยนี้จึงได้รับควำมนิยมต่อเนื่องและมีคอมพิวเตอร์มำเชื่อมโยงมำกขึ้น จนกระทั่งกลำยเป็นเครือข่ำยระบบคอมพิวเตอร์ที่ใหญ่ที่สุดในโลก (สุพิชญำ เข็มทอง,2547) ประเทศไทยเริ่มสนใจ และติดต่อกับอินเตอร์เน็ต ตั้งแต่ ..2530 โดยมหำวิทยำลัยสงขลำนครินทร์ (วิทยำเขต หำดใหญ่ ) และสถำบันเทคโนโลยีแห่งเอเชีย ซึ่งในปี . .2531 วิทยำเขตดังกล่ำวนับเป็นที่อยู่ของอินเทอร์เน็ต แห่งแรกของประเทศไทย โดยได้รับที่อยู(Address) ชื่อ sritrang.psu.th .. 2534 เป็นปีท่มีกำรนำ อินเทอร์เน็ตเข้ำมำอยู่ในประเทศไทยอย่ำงสมบูรณ์แบบโดยจุฬำลงกรณ์มหำวิทยำลัย ได้เช่ำสำยเป็นสำย ควำมเร็วสูงต่อเชื่อมกับเครือข่ำย UUNET ของบริษัทเอกชนที่รัฐเวอร์จิเนีย ประเทศสหรัฐอเมริกำ ต่อมำ มหำวิทยำลัยมหิดล มหำวิทยำลัยเชียงใหม่สถำบันเทคโนโลยีพระจอมเกล้ำ และมหำวิทยำลัยอัสสัมชัญ บริหำรธุรกิจ ได้ขอเชื่อมต่อผ่ำนจุฬำลงกรณ์มหำวิทยำลัย และเรียกเครือข่ำยนี้ว่ำ ไทยเน็ต” (THAI net) นับเป็นเกตเวย์ (Gateway)แรกสู่เครือข่ำยอินเทอร์เน็ตสำกลของประเทศไทย ในปี .. 2535 ศูนย์เทคโนโลยี อิเล็กทรอนิกส์และคอมพิวเตอร์แห่งชำติ (NECTEC: National Electronic and Computer Technology Centre) ได้จัดตั้งกลุ่มเครือข่ำยประกอบด้วยมหำวิทยำลัยอีกหลำยแห่ง เรียกว่ำ เครือข่ำย ไทยสำรต่อเชื่อมกับเครือข่ำย UUNETด้วยนับเป็นเกตเวย์สู่เครือข่ำยอินเทอร์เน็ตแห่งที่สอง ( อธิปัตย์ คลี่สุนทร, 2542) ประโยชน์โดยทั่วไปของอินเทอร์เน็ต อธิปัตย์ คลี่สุนทร (2542) ได้กล่ำวถึงประโยชน์โดยทั่วไปของอินเทอร์เน็ต ว่ำอินเทอร์เน็ตเป็นระบบเครือข่ำยเปิดและสำมำรถติดต่อเชื่อมโยงตลอด 24 ชั่วโมง ดังนั้นเรำจึงสำมำรเข้ำถึง ข้อมูล ซึ่งประกอบด้วยข้อควำม ภำพ และเสียง ที่มีผู้นำเสนอไว้ได้โดยผ่ำนรูปแบบและเนื้อหำที่แตกต่ำงกัน นอกจำกนั้นยังสำมำรถเป็นที่สื่อสำรแลกเปลี่ยนควำมรู้ประสบกำรณ์ แนวคิดที่หลำกหลำย อำทิ ด้ำนกำรเมือง กำรอุตสำหกรรม กำรแพทย์ ศำสนำสิ่งแวดล้อม ดนตรี กีฬำ กำรค้ำ กำรท่องเที่ยว วัฒนธรรม เป็นต้น ซึ่ง นอกจำกจะรวดเร็วแล้วยังประหยัดค่ำใช้จ่ำยอีกด้วย

Transcript of ทฤษฎีการออกแบบเว็บ

Page 1: ทฤษฎีการออกแบบเว็บ

แนวคดเรองเทคโนโลยสารสนเทศและอนเทอรเนต

ค ำวำอนเทอรเนต (Internet) เปนค ำยอของ Internetwork หมำยถง เครอขำยคอมพวเตอรทใหญ

ทสดในโลก โดยเชอมโยงเครอขำยยอยจ ำนวนมำกมำยมหำศำล นบตงแตเครองคอมพวเตอรสวนบคคลทใช

งำนภำยในบำนและส ำนกงำนไปจนถงคอมพวเตอรขนำดใหญแบบเมนเฟรมในโรงงำนอตสำหกรรมและ

อนเทอรเนตสำมำรถท ำใหคนเรำสำมำรถตดตอสอสำรกนไดอยำงรวดเรวไมวำจะอยสวนใดของโลก แตเดมนน

อนเทอรเนต เปนเครอขำยทใชในกจกำรทำงทหำร ของสหรฐอเมรกำชอ อำรพำเนต(ARPANET : Advanced

Research Projects Agency Network) ซงเรมใชในกจกำรเมอประมำณพ.ศ. 2512 คอ 39 ปมำแลว

ภำยหลงมมหำวทยำลยหลำยแหงขอรวมเครอขำย โดยเชอมตอระบบคอมพวเตอรของมหำวทยำลยกบ

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

เรยกวำโพรโทคอล (protocol)แบบเฉพำะของอนเทอรเนตทเรยกวำ Transmission Control Protocol/

Internet Protocol (TCP/IP)เครอขำยนจงไดรบควำมนยมตอเนองและมคอมพวเตอรมำเชอมโยงมำกขน

จนกระทงกลำยเปนเครอขำยระบบคอมพวเตอรทใหญทสดในโลก (สพชญำ เขมทอง,2547)

ประเทศไทยเรมสนใจ และตดตอกบอนเตอรเนต ตงแต พ.ศ.2530 โดยมหำวทยำลยสงขลำนครนทร(วทยำเขตหำดใหญ) และสถำบนเทคโนโลยแหงเอเชย ซงในป พ.ศ.2531 วทยำเขตดงกลำวนบเปนทอยของอนเทอรเนตแหงแรกของประเทศไทย โดยไดรบทอย (Address) ชอ sritrang.psu.th พ.ศ. 2534 เปนปทมกำรน ำอนเทอรเนตเขำมำอยในประเทศไทยอยำงสมบรณแบบโดยจฬำลงกรณมหำวทยำลย ไดเชำสำยเปนสำยควำมเรวสงตอเชอมกบเครอขำย UUNET ของบรษทเอกชนทรฐเวอรจเนย ประเทศสหรฐอเมรกำ ตอมำมหำวทยำลยมหดล มหำวทยำลยเชยงใหมสถำบนเทคโนโลยพระจอมเกลำ และมหำวทยำลยอสสมชญบรหำรธรกจ ไดขอเชอมตอผำนจฬำลงกรณมหำวทยำลย และเรยกเครอขำยนวำ “ไทยเนต” (THAI net) นบเปนเกตเวย (Gateway)แรกสเครอขำยอนเทอรเนตสำกลของประเทศไทย ในป พ.ศ. 2535 ศนยเทคโนโลยอเลกทรอนกสและคอมพวเตอรแหงชำต (NECTEC: National Electronic and Computer Technology Centre) ไดจดตงกลมเครอขำยประกอบดวยมหำวทยำลยอกหลำยแหง เรยกวำ เครอขำย “ไทยสำร” ตอเชอมกบเครอขำย UUNETดวยนบเปนเกตเวยสเครอขำยอนเทอรเนตแหงทสอง (อธปตย คลสนทร, 2542) ประโยชนโดยทวไปของอนเทอรเนต อธปตย คลสนทร (2542) ไดกลำวถงประโยชนโดยทวไปของอนเทอรเนตวำอนเทอรเนตเปนระบบเครอขำยเปดและสำมำรถตดตอเชอมโยงตลอด 24 ชวโมง ดงนนเรำจงสำมำรเขำถงขอมล ซงประกอบดวยขอควำม ภำพ และเสยง ทมผน ำเสนอไวไดโดยผำนรปแบบและเนอหำทแตกตำงกนนอกจำกนนยงสำมำรถเปนทสอสำรแลกเปลยนควำมรประสบกำรณ แนวคดทหลำกหลำย อำท ดำนกำรเมอง กำรอตสำหกรรม กำรแพทย ศำสนำสงแวดลอม ดนตร กฬำ กำรคำ กำรทองเทยว วฒนธรรม เปนตน ซงนอกจำกจะรวดเรวแลวยงประหยดคำใชจำยอกดวย

Page 2: ทฤษฎีการออกแบบเว็บ

ความหมายของเวบไซต ควำมหมำยของเวลดไวดเวบ (World Wide Web) เวลดไวดเวบ นยมเรยกสนๆ วำเวบ หรอ WWW

ถอเปนสวนทนำสนใจทสดบนอนเทอรเนต เพรำะสำมำรถแสดงสำรสนเทศตำงๆ ไดหลำกหลำย เชน นตยสำรหรอหนงสอพมพอเลกทรอนกส ขอมลดำนดนตรกฬำ กำรศกษำ ซงสำมำรถน ำเสนอไดทงภำพ เสยง รวมถงภำพเคลอนไหว เชนแฟมภำพวดทศนหรอตวอยำงภำพยนตรและกำรสบคนสำรสนเทศในเวลดไวดเวบนนจ ำเปนตองอำศยโปรแกรมคนดเวบ (web browser) ในกำรเขำถงแหลงขอมล โดยทเวบกบโปรแกรมคนผำนจะท ำหนำทรวบรวมและกระจำยเอกสำรทเครอขำยทท ำไว โดยกดำนนท มลทอง (2540) ไดกลำวถงเวลดไวดเวบวำ เปนบรกำรสบคนสำรสนเทศทอยในอนเทอรเนตในระบบขอควำมหลำยมต (hypertext) โดยคลกทจดเชอมโยง เพอเสนอหนำเอกสำรอนๆ ทเกยวของสำรสนเทศทน ำเสนอจะมรปแบบทงในลกษณะของตวอกษรภำพนง ภำพเคลอนไหว และเสยง

ส ำหรบค ำวำเวบไซต กดำนนท มลทอง (2542) ไดอธบำยวำเวบไซตกคอแหลงทรวบรวมเวบเพจจ ำนวนมำกมำยหลำยหนำในเรองเดยวกนมำรวมอยดวยกน แตสงหนงในกำรเสนอเรองรำวทอยบนเวบไซตทแตกตำงไปจำกโปรแกรมโทรทศน เนอหำในนตยสำร หรอหนงสอพมพ เนองจำกกำรท ำงำนบนเวบจะไมมวนสนสด ทงนเนองจำกเรำสำมำรถเปลยนแปลงและเพมสำรสนเทศบนเวบไซตไดตลอดเวลำ และแตละเวบเพจจะมกำรเชอมโยงกนภำยในเวบไซตหรอไปยงเวบไซตอนๆเพอใหผอำนสำมำรถอำนไดในเวลำอนรวดเรว ซงสอดคลองกบนรธ อ ำนวยศลป (2542) ซงกลำวถงเวบไซตวำเปนชอเรยก Host หรอ Server ทไดจดทะเบยนอยใน เวลดไวดเวบ ซงกคอชอชอ Host ทถกก ำหนดใหมชอในเวลดไวดเวบ และขนตนดวย http และมโดเมนหรอนำมสกลเปน .com, .net,.org หรออนๆ

ส ำหรบควำมหมำยของค ำวำเวบเพจ (Web page) นน ส ำนกงำนเลขำนกำรคณะกรรมกำรเทคโนโลยสำรสนเทศแหงชำต ศนยเทคโนโลยอเลกทรอนกสและคอมพวเตอรแหงชำต (2540) ไดใหควำมหมำยของเวบเพจไวดงน เวบเพจ คอหนำหนงสออเลกทรอนกสบนเวบ ทเจำของเวบเพจตองกำรจะใสลงไปในหนำหนงสออเลกทรอนกสนน เชน ขอมลแนะน ำตวเองซงอำจเปนบคคลหรอองคกรทตองกำรใหผอนไดทรำบ หรอขอมลทนำสนใจ เปนตน โดยทขอมลทแสดงเปนไดทงขอควำม เสยง ภำพนง และภำพเคลอนไหวและขอมลทน ำเสนอสำมำรถเชอมโยงในรปของไฮเพอรเทกซ คอ เชอมโยงไปยงเวบเพอนทจะใหขอมลนนๆ ในระดบลกลงไปไดเรอยๆและเวบเพจจะตองมทอยอเลกทรอนกสบนเครอขำยเฉพำะของตน ซงแหลงทอยนเรยกวำ URL (Uniform Resource Locator)

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

Page 3: ทฤษฎีการออกแบบเว็บ

Resource Locator (URL) โดยทอยเวบ จะปรำกฏในชอง Address (เปนสวนของกลองขอควำมและ drop-down) ทสวนบนของจอภำพโดยทอยเวบนนเปรยบเสมอนทำงผำนบนอนเทอรเนตเพอไปยงเวบเพจทตองกำร เชนเดยวกบกำรคนหำแฟมตำงๆ ในคอมพวเตอร

การออกแบบและการพฒนา กระบวนการออกแบบหนาเวบไซต (Page design) กำรออกแบบหนำเวบไซตเปนขนตอนทมควำมส ำคญมำกขนตอนหนง เนองจำกเปนตวกลำงในกำร

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

1. กำรออกแบบกรำฟกเพอปฏสมพนธกบผใชบรกำร (Graphic User Interface) 2. กำรออกแบบเทคโนโลยกำรน ำเสนอขอมลของเวบไซต 1. การออกแบบกราฟกเพอปฏสมพนธกบผใชบรการ (Graphic User Interface) กำรปฏสมพนธ คอ ระบบซงผใชมกำรควบคมและตอบสนองตอกำรสอสำร กรณของกำรสอสำรใน

เวบไซตผใชบรกำรควบคมกำรทองไปในเวบไซตดวยตนเอง โดยใชงำน Interface ซงเปนสวนประกอบตำงๆ ในหนำเวบไซต ประกอบดวย 2 สวนใหญ ๆ คอ

1.1 ระบบเนวเกชนหรอระบบน ำทำง (Navigation System) เปนกำรออกแบบลกษณะของปมเมนเนวเกชน (Navigation Menu) ต ำแหนงกำรจดวำง รวมถง

ลกษณะกำรเชอมโยงขอมลภำยในเวบไซต รวมเรยกวำ ระบบเนวเกชนหลก (Main Navigation) เนวเกชนเมน ประกอบดวยกลมลงคตำงๆ รวมกนอยในบรเวณหนงของหนำเวบท ำหนำทน ำเสนอ

วธกำรทองเวบไซตดวยเสนทำงตำงๆ กน ระบบเนวเกชนหลกทนยมม 2 แบบ คอ a. ระบบเนวเกชนแบบล ำดบชน (Hierarchical) ซงเปนเนวเกชนแบบพนฐำน เปนกำรเชอมโยง

ขอมลแบบรำกตนไม จำกหนำหลกไปยงหนำยอยๆ ถดลงไป หรอยอนกลบขนมำตำมล ำดบชน ท ำใหกำรเคลอนทในเวบไซตเปนแนวตง ไมคลองตว ตองอำศยระบบเนวเกชนเสรม เชน ระบบเนวเกชนแบบโลคอล (Local) หรอระบบเนวเกชนเฉพำะท ซงมลกษณะเปนภำพ (Hyperlink) หรอขอควำมแบบไฮเปอรเทกซ (Hypertext) ชวยลงคไปยงหนำอนๆ ทไมไดเชอมโยงกนดวยระบบเนวกชนหลก

b. ระบบเนวเกชนแบบโกลบอล (Global) หรอเชอมโยงแบบอสระ (Referential) เปนกำรลงคขอมล แบบอสระท ำใหสำมำรถเคลอนทไดทงแนวตงและแนวนอนอยำงมประสทธ ภำพตลอดทวทงเวบไซต

Page 4: ทฤษฎีการออกแบบเว็บ

1.2 เนวเกชนเมนมหลำยประเภท ท ำหนำทแสดงหวขอยอยของเนอหำภำยในเวบไซต เพอเชอมโยงไปยงเวบเพจนนๆ รปแบบทนยมใชทวไป เชน

a. เนวเกชนแบบแถบ (Navigation Bar) มลกษณะเปนแถบแสดงรำยกำรยอย ซงมกแสดงหวขอเรยงกนในแนวตงหรอแนวนอน มขอดคอ ใชงำนงำย แตไมเหมำะกบเวบไซตทมหวขอจ ำนวนมำก เพรำะเปลองพนท

b. Pull-down Menu มลกษณะเปนแถบทมชองแสดงรำยกำรยอย โดยรำยกำรยอยจะเลอนลงมำเมอคลกลกศรลงมขอดคอ แสดงรำยกำรยอยไดมำก ประหยดพนทเหมำะกบขอมลประเภทเดยวกนจ ำนวนมำก เชน ชอจงหวด ภำษำ แตไมเหมำะกบขอมลตำงประเภทกน

c. Pop-up Menu มลกษณะเปนแถบแสดงรำยกำรยอย ทจะปรำกฎขนมำเมอใชเมำสช หรอวำงเหนอต ำแหนงรำยกำรหลก สรำงดวยกำรเขยนค ำสง Java Script มขอดคอประหยดพนท

d. Frame-based มลกษณะเปนแถบแสดงรำยกำรยอย คลำยเนวเกชนแบบแถบแตมกำรแบงเวบเพจออกเปนสวนๆ แตละสวนเรยกวำ เฟรม แถบเนวเกชนจะอยคนละเฟรมกบเนอหำ ท ำใหไมวำจะลงคไปยงหวขอไหนกตำม กจะมกำรเปลยนแปลงแคเฟรมทเปนเนอหำเทำนน เฟรมทเปนแถบแสดงรำยกำรยอยจะยงคงเหลอเดม มขอดคอ มควำมสม ำเสมอ แตจะแสดงผล URL ไมถกตอง ท ำใหไมสำมำรถ Bookmark ได ใชกำรออกแบบทซบซอน และพนทแสดงขอมลนอยลง

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

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

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

นอกจำกนยงมระบบเนวเกชนเสรม (Supplement Navigation) เพอเพมควำมสะดวกในกำรใชงำนเวบไซต แตไมสำมำรถใชแทนระบบเนวเกชนหลกได เชน ระบบสำรบญ (Table of Contents)เปนสงทผใชสวนใหญคนเคย เนองจำกลกษณะเหมอนสำรบญในหนงสอ ระบบดชน (Index System) คอ แบงขอมลตำมตวอกษณแรกของค ำ แผนทเวบไซต (Site Map) แสดงโครงสรำงขอมลแบบกรำฟก เพอควำมสวยงำม

Page 5: ทฤษฎีการออกแบบเว็บ

ระบบเนวเกชนทมประสทธภำพควรมคณสมบต ดงน 1. สำมำรถเขำใจวธกำรใชงำนไดงำย เพรำะหำกผใชบรกำรตองใชเวลำนำนในกำรท ำควำม

เขำใจระบบเนวเกชน จะมควำมพยำยำมในกำรตดตำมเนอหำนอยลง และอำจไมกลบเขำมำใชบรกำรอก 2. เปน Interface Famity คอ ระบบเนวเกชนทมควำมสม ำเสมอตลอดทงเวบไซต ทงลกษณะ

รปรำงหนำตำ ต ำแหนงกำรจดวำง จ ำนวนรำยกำรในเมน และล ำดบของรำยกำร 3. มกำรตอบสนองตอผใชโดยมกำรแสดงต ำแหนงปจจบนของผใชดวยกำรเปลยนแปลงส หรอ

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

4. มควำมพรอมและเหมำะสมในกำรใชงำน โดยเนวเกชนตองอยในต ำแหนงทเหนไดชดเจน และเสนอทำงเลอกทผใชนำจะตองกำรเมอชมหนำนนเสรจ

5. น ำเสนอหลำยทำงเลอก โดยเนวเกชนหลำยรปแบบใหเลอกใชตำมควำมถนด เชน มเครองมอคนหำ (Search Box) ใหในกรณทผใชตองกำรหำขอมลอยำงรวดเรว โดยไมตองคลกดตำมหวขอตำงๆ เปนตน

6. มขนตอนสนและประหยดเวลำ เพอใหผใชบรกำรเขำถงขอมลโดยผำนขนตอนนอยทสด ซงขนอยกบกำรออกแบบชนของขอมล รำยกำรยอยในเมนไมควรมำกกวำ 8–10 รำยกำร เพอใหผใชตดสนใจเลอกไดงำย หรอม Navigation Shortcut เพอลดเขำสเปำหมำยเรวขน เชน Site Map หรอระบบดชน เปนตน

7. ใชค ำอธบำยลงคทชดเจนและเขำใจงำย เลอกใชค ำทมควำมหมำยชดเจน โดยอำงองจำกควำมเขำใจของกลมผใชบรกำร เพอแสดงถงเปำหมำยของลงค

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

9. สนบสนนวตถประสงคของเวบไซต เชน เพอใหรำยละเอยดของสนคำ หรอเพอใหบรกำรดำนขอมลขำวสำร เปนตน

10. สอดคลองกบประสบกำรณ และพฤตกรรมของผใชบรกำร โดยกำรสอบถำมและรบฟงควำมคดเหนจำกผใช เพอคนหำวตถประสงคของกำรเขำชมและพฤตกรรมกำรใชงำน

กำรออกแบบทำงทศนะและองคประกอบอนๆ ในเวบไซต หมำยถง ลกษณะของภำพประกอบ

(Image) ตวอกษร (Font) และพนหลง (Background) กำรใชสโดยรวม (Color Scheme)และองคประกอบอนๆ ทใชดงดดควำมสนใจ (Gimmick) เชน ภำพเคลอนไหว (Animation) เสยง (Sound) ภำพยนตรขนำดสน (Movie Clip Video Clip) เปนตน

1. ลกษณะของภำพประกอบ (Image)กำรใชรปภำพในเวบไซต มกใชเพอประกอบเนอหำ สอควำมหมำย หรอตกแตงเวบไซตใหมสสนสวยงำม ดงดดควำมสนใจของผใชบรกำร ผวจยแบงลกษณะรปภำพทนยมใชในเวบไซตตำมควำมละเอยดของภำพและควำมตอเนองในกำรไลระดบส คอ ภำพถำย ภำพกรำฟกอนๆ

Page 6: ทฤษฎีการออกแบบเว็บ

ทไมใชภำพถำย และกำรใชภำพหลำยชนดรวมกน ซงภำพทงหมดนจะถกแปลงอยในรปแบบไฟลดจตอล โดยผำนโปรแกรมกรำฟกในคอมพวเตอร เชน Photoshop หรอ Image-Ready เปนตน รปแบบไฟลกรำฟกทนยมใชเปนสวนประกอบของเวบเพจ คอ GIF (Graphic Interchange Format) และ JPEG (Joint Photographic Experts Group) เนองจำกมขนำดไฟลไมใหญมำก ดำวนโหลดไดเรว โดยรปแบบ GIF เหมำะกบภำพทประกอบดวยสพนๆบรเวณกวำงมจ ำนวนสไมมำก และไมคอยมกำรไลระดบส เชน โลโก ตวอกษร ภำพกรำฟก หรอภำพกำรตน ซงเกดจำกกำรสรำงระนำบของส (Vector) มำประกอบกนเปนภำพ มจดเดน คอ สำมำรถน ำไปใชกบบรำวเซอรไดทกชนดโดยไมตองค ำนงถงเวอรชนใดๆ ท ำใหแนใจไดวำบรำวเซอรของผใชบรกำรสำมำรถแสดงผลภำพไดอยำงถกตอง กรำฟกแบบ GIF มระบบกำรเกบขอมลสแบบอนเดกซ 8 บต หมำยควำมวำ สำมำรถเกบขอมลสไดสงสด 256 ส ขนำดของไฟลจะใหญหรอเลกขนอยกบจ ำนวนสทใชในภำพ ถำจ ำนวนสนอย ขนำดไฟลกจะเลกลง โดยใชระบบกำรบบอดขอมลแบบ LZW (Lempel-Ziv-Welch) สำมำรถแสดงผลภำพทละเฟรมจำกคณภำพต ำ แลวเพมขนจนเปนภำพทสมบรณในทสด ท ำใหผใชเหนควำมคบหนำในกำรแสดงผล นอกจำกนยงมคณสมบตโปรงใส คอ สำมำรถเซฟไฟลภำพทพนหลงโปรงใสได และสำมำรถเซฟไฟลภำพตอเนองเปนภำพเคลอนไหวได รปแบบ JPEG เหมำะกบภำพทมกำรไลระดบสตอเนองกน เชน ภำพถำยหรอภำพวำดทมสเขม-ออน หลำยๆ ระดบ เพรำะมระบบกำรเกบขอมลสแบบ 24 บต ซงใหสสมจรง (True Color) ไดมำกถง 16.7 ลำนส ท ำใหไดรปทมคณภำพสง แตไมเหมำะกบภำพทมสพนเปนบรเวณกวำง ภำพกำรตนและตวอกษร เพรำะระบบกำรบบอดขอมลของกรำฟกแบบ JPEG จะท ำใหบรเวณทเปนสพนเกดจดหรอแถบส และของของตวอกษรจะไมเรยบ ดไมชดเจน คณภำพของภำพและขนำดของไฟลกรำฟกแบบ JPEG ขนอยกบอตรำสวนในกำรบบอดขอมล โดยอตรำสวนทสง จะไดภำพทมคณภำพต ำและไฟลขนำดเลกนกออกแบบสำมำรถเลอกระดบกำรบบอดไดตำมตองกำรโดยเลอกระดบทมขนำดไฟลเลกทสดเทำทยงสำมำรถคงคณภำพของภำพทตองกำรไวได

2. ตวอกษร (Font / Typeface)องคประกอบทส ำคญในกำรออกแบบเวบเพจอกอยำงหนง คอ ตวอกษร ในระบบคอมพวเตอรจะแสดงผลโดยมชอของแบบตวอกษร (Typeface) ตำมดวยรปแบบ (Style) ซงปกตมรปแบบพนฐำน 3 แบบ คอ ตวปกต (Regular) ตวเอน (Italic) และตวหนำ (Bold) เชน ตวอกษร Cordia New Italic Cordia New คอ ชอแบบตวอกษร Italic คอ รปแบบของตวอกษรทเปนตวเอน เปนตน ซงตวอกษรแตละแบบจะใหควำมรสกทแตกตำงกน สำมำรถใชเปนสวนประกอบในสรำงบคลกของเวบไซตได สวนปญหำทพบในกำรใชตวอกษร คอ บำงครงกำรแสดงผลตวอกษรบนบรำวเซอรของผใชจะไมตรงกบทนกออกแบบระบไว (Fixed Font) โดยกำรเขยนค ำสงภำษำ HTML หรอ ค ำสงทโปรแกรมสรำงเวบเขยนดวยภำษำเสรม เชน Java Script หรอ CS Script เนองจำกขอจ ำกดและควำมแตกตำงของตวอกษรทตดตงอยในคอมพวเตอรแตละเครอง (Default Font) และผใชยงสำมำรถปรบเปลยนควำมละเอยดของหนำจอ (Resolution) สำมำรถเพมหรอลดขนำดตวอกษรมำตรฐำน ซงนอกจำกจะมผลกระทบกบควำมสวยงำมและควำมสะดวกในกำรอำนแลว บำงกรณยงกระทบถงโครงสรำงเวบเพจทจดไวลงตวแลว เพรำะตวอกษรแตละ

Page 7: ทฤษฎีการออกแบบเว็บ

แบบมควำมกวำงและควำมสงไมเทำกน นกออกแบบมกแกปญหำโดยเลอกใชตวอกษรแบบมำตรฐำนทมำพรอมระบบปฏบตกำร (Windows) แตกำรใชตวอกษรมำตรฐำนทมอยไมกแบบกอำจสรำงควำมนำเบอ หนำยได บำงครงนกออกแบบจงใชตวอกษรทสรำงจำกโปรแกรมกรำฟก ซงมกำรแสดงผลบนบรำวเซอรในลกษณะของรปภำพ มขอดคอ สวยงำม มเอกลกษณ ก ำหนดต ำแหนงไดงำย และผใชสำมำรถแสดงผลตวอกษรไดเหมอนๆ กน แตเพมเวลำในกำรดำวนโหลด เปลยนแปลงหรอเพมเตมขอควำมไดยำก และยงเสยโอกำสในกำรน ำเสนอขอมลแกผบรโภคทสบคนขอมลโดยใชระบบสบคนขอมล (Search Engine) อกดวย เพรำะขอควำมแบบกรำฟกนจะไมถกรวมอยในดชน (Index) ของระบบสบคนขอมล

3. พนหลง (Background)เรำสำมำรถก ำหนดพนหลงของเวบเพจใหเปนส หรอรปภำพทตองกำรได โดยพนหลงทเปนรปภำพจะใชเวลำในกำรแสดงผลมำกกวำพนหลงทเปนสเรยบๆ ซงก ำหนดดวย HTML สงส ำคญทควรค ำนงถงคอ ควำมอำนงำย (Legibility) ของขอควำมหำกพนหลงเปนรปภำพหรอเปนลวดลำย (Pattern) ตองระวงไมใหมควำมเขม-ออนของสทตำงกนมำก กำรใชรปทมลกษณะพรำมว (Blur) จะชวยใหอำนขอควำมไดงำยกวำรปทคมชด สวนพนหลงทเปนสเรยบๆ มหลกงำยๆ คอ พนหลงสเขมใชตวอกษรสออน พนหลงสออนใชตวอกษรสเขม เพอเนนตวอกษรใหเดนขน แตไมควรใชสทตดกนมำกๆ เพรำะแสงจำกจอคอมพวเตอรจะท ำใหสสวำงขน 20% อำจรบกวนสำยตำ ท ำใหปวดตำได ส ำหรบคสของตวอกษรและพนหลงทนยมใช มดงน ตาราง คสของตวอกษรและพนหลงทนยมใช ทมำ : ถนอมพร เลำหจรสแสง, หลกกำรออกแบบและกำรสรำงเวบเพอกำรเรยน กำรสอน :Designing e-Learning (กรงเทพฯ : ส ำนกพมพแหงจฬำลงกรณมหำวทยำลย, 2545), 170.

สตวอกษร สพนหลง ขำว ฟำ แดง เขยว ชมพ (Magenta) เหลอง ฟำ ด ำ ฟำอมเขยว (Cyan) ขำว ฟำ เขยว ขำว เหลอง ชมพ (Magenta) ขำว ฟำ แดง ขำว เหลอง ฟำอมเขยว เขยว ฟำ ขำว ด ำ ด ำ ขำว เหลอง

Page 8: ทฤษฎีการออกแบบเว็บ

4. กำรใชสโดยรวม (Color Scheme)สเปนสวนประกอบทส ำคญในกำรดงดดควำมสนใจของผใช สรำงบรรยำกำศ และควำมรสกโดยรวมของเวบไซต เรำสำมำรถใชสกบสวนประกอบตำงๆ ของเวบไซต เชน ภำพ ตวอกษร ลงค และพนหลง โดยเลอกใชชดสใหกลมกลน สอดคลองกบบคลกของเวบไซต ชวยสอควำมหมำยใหเนอหำ และเพมควำมสวยงำมใหกบเวบเพจ นอกจำกนยงสำมำรถใชสประจ ำองคกรหรอหนวยงำนในเวบไซต เพอสรำงภำพลกษณในกำรกลบกน กำรเลอกใชสทไมเหมำะสมจะรบกวนสำยตำของผใช สรำงควำมล ำบำกในกำรอำน และอำจท ำใหกำรสอควำมหมำยผดพลำดได สทใชในกำรออกแบบเวบไซต มหลกกำรผสมสแบบบวก (Additive Color) คอ กำรผสมสของแสง เนองจำกเวบไซตเปนสอทน ำเสนอผำนจอคอมพวเตอร ซงใชหลกกำรผสมแสงทมควำมคลนตำงกน 3 ส (RGB) คอ แดง (RED) เขยว (Green) น ำเงน (Blue) ซงเมอคลนแสงทง 3 สซอนทบกนจะผสมเปนแสงสขำว โดยทวไปสทใชในกำรออกแบบเวบไซตจะเปนชดสส ำหรบเวบ (Web Safe Color) จ ำนวน 216 ส ซงมขอด คอ ผใชสำมำรถเหนสไดถกตองตรงกน ไมวำจะใชเครองคอมพวเตอรแมคอนทอชหรอพซทวไป เนองจำกควำมละเอยดของจอคอมพวเตอร ระบบกำรแสดงสของบรำวเซอร และภำษำ HTML ซงใชในกำรเขยนเวบเพจ จะมผลตอกำรแสดงสในเวบไซตใหแตกตำงกน ชดสส ำหรบเวบนมกำรก ำหนดโคดเปน HTML ในรปตวเลขและตวอกษร 6 หลก เพอก ำหนดรปแบบกำรผสมส และควำมเขมของแสงแตละสใหเปนมำตรฐำน เชน 000000 หมำยถง ไมมแสงสใดเลย คอ สด ำ สวน FFFFFF หมำยถง มแสงสแดง เขยว น ำเงน ทมควำมเขมสงสดทกสผสมกนเปน สขำว เปนตน ซงนกออกแบบไมจ ำเปนตองจ ำโคดเหลำน เนองจำกโปรแกรมกรำฟกทใชท ำเวบไซตจะแสดงสใหเลอกในรปจำนส (Web Palette) แลวไปเขยนค ำสงเปน HTML ใหเองตำรำงตอไปนแสดงจตวทยำของส ในกำรสอควำมหมำยทงในเชงบวกและลบ รวมถงสญลกษณ และสงของทเกยวพนกบสนน เฉพำะกรณทใชสโดยรวมเปนสนนสเดยว แตถำมกำรใชสหลำยสรวมกนอำจมกำรสอควำมหมำยแตกตำงไปจำกนได ตาราง 3 จตวทยำของส ทมำ : ธวชชย ศรสเทพ, คมภรเวบดไซน คมอออกแบบเวบไซตฉบบมออำชพ (กรงเทพฯ :โปรวชน,2544),205.

ความหมายในเชงบวก

ความหมายในเชงลบ

สญลกษณ สงของ ทเกยวของ

แดง

พลง อ ำนำจ ก ำลงใจ ควำมจรง ควำมรก ควำมอบอน กำรแขงขน ควำมกลำหำญ ควำมแขงขน ควำมตนเตนควำมเรว ควำมสนกสนำน

ควำมโมโห ควำมกำวรำว ควำมรนแรง ควำมละอำย ควำมผดพลำด กำรบำดเจบ

ดวงอำทตย ควำม รอน ไฟ สญญำณ อนตรำย เลอด หวใจ

สม ควำมสำมำรถ ควำมทนสมย ควำกระตอรอรน ควำมเปนมตร ควำมสดใสมชวตชวำ ควำมสมดล ควำมเขมแขงควำมโชคด ควำมเจรญ

กำรหลอกลวง ควำมออฉำว ควำมไมเรยบรอย

ฮำโลวน มตรภำพ

Page 9: ทฤษฎีการออกแบบเว็บ

เหลอง ควำมสดใสรำเรง ควำมหวง ควำมอบอน ควำมร ำรวย กำรมองโลกในแงด ควำมสข ปรชญำ ควำมคดฝน

ควำมไมซอสตย กำรทรยศ ควำมขลำดกลว ควำมอจฉำ ควำมไมแนนอน อำกำปวย

แสงอำทตย ฤดรอน ทอง ศำสนำ ปรชญำ อดมคต สญญำณ เตอนภย

เขยว ธรรมชำต สขภำพ กำรรกษำ ควำมรนรมยยนด ควำมหวง กำรเรมตน ควำมภกด ควำม เปนอมตะ ควำมปลอดภย ควำมอดมสมบรณ ควำมรมรน

ควำมอจฉำ ควำมเบอหนำย กำรขำดประสบกำรณ

ตนไม สงแวดลอม ศำสนำ วยรน ทหำร สญญำณปลอดภย

น ำเงน ควำมแขงแรง ควำมกระฉบกระเฉง ควำใหม ควำมซอสตย ควำมมนคง ปลอดภย มคณธรรม ควำมสะอำด มน ำใจ เปนระเบยบ ควำมสงบ ควำมเชอมน ควำมสมดล ควำมเขมแขง

ควำมหดห ซมเศรำ เสยใจ ควำมเรยบแบบไมนำสนใจ

ทองฟำ ทะเล สวรรค เทวดำ ผชำย ควำมเยน เทคโนโลย

มวง ควำมลกลบ ควำมสงสง หรหรำ ควำมทนสมย ควำมสรำงสรรค กำรใหควำมร กำรบ ำบดรกษำ ควำมรอบร

ควำมหยงยโส ควำมแปลก ควำมเศรำโศกเสยใจ

จต วญญำณ ปญญำ

น ำตำล ควำมเรยบงำย ธรรมชำต ควำมสขม ควำมทนทำน ควำมมนคง ควำมมเกยรต ควำมสะดวกสบำย ควำม เจรญเตบโตเตมท

ควำมหดหซมเศรำ สลด ใจควำมเกำ มอำย ควำม เลอะเทอะเปรอะเปอน

โลก พนดน ไม บำน กลำงแจง

ขำว ควำมบรสทธไรเดยงสำ ควำมรก ควำมฉลำด ควำมสะอำด ควำมด ควำมสงบ ควำมเรยบงำย ควำมเคำรพนบถอ ควำมนอบนอม ควำมถอมตน ควำมเทยงตรง

ควำมออนแอ กำรเจบปวย ควำมตำย ควำมเศรำ (จน)

พรหมจำร กำรเกด มตรภำพ วยสำว แพทย พยำบำล หมะ สนตภำพ เยำวชน ควำมหนำว ควำมเยน ควำมจรง

เทำ ควำมสภำพ ควำมสงบ ควำมฉลำดสขม ควำมมนคง ควำมเปนไปได ควำมไวใจได ควำมมเกยรต

ควำมโศกเศรำ ควำมเสอม ควำมนำเบอ ควำมมอำย

ปญญำ อนรกษนยม อนำคต กำรปฏบตได (Practical)

Page 10: ทฤษฎีการออกแบบเว็บ

ด ำ อ ำนำจ ควำมฉลำดลกล ำ ควำมสขมรอบคอบ ควำมมนคง ควำมเปนทำงกำร ควำมตงใจ ควำมเปนเลศ ควำมลบ

กำรหลอกลวง กำรปกปด ควำมซบซอน ควำมนำกลว ควำมชวรำย โทสะ ควำมกลว ควำมทกข ควำมหดห หมดหวง ควำมเศรำ

ใตดน ควำมมด ควำมตำย เกยวกบดำนเพศ

5. องคประกอบอนทใชดงดดควำมสนใจ (Gimmick) หมำยถง ลกเลนทใชดงดดควำมสนใจของ

ผใชบรกำร ชวยสรำงบรรยำกำศในกำรน ำเสนอขอมลใหนำสนใจ ลกเลนทเวบไซตทวไปนยมใช คอ 6. เสยง (Sound)กำรใชเสยงในเวบไซตมประโยชนในแงของกำรสรำงบรรยำกำศเสรมประสบกำรณ

และดงดดควำมสนใจของผใชบรกำร แตท ำใหใชระยะเวลำดำวนโหลดมำกขนไฟลเสยงไมควรมควำมยำวเกน 5 นำท ถำเปนเสยงบรรยำย ตองอำนอยำงชดเจน และสรำงควำมนำสนใจดวยกำรใชน ำเสยงทกระตอรอรน มเสยงสงเสยงต ำอยำงเหมำะสม รวมทงปรบโทนเสยงใหคงททงเวบไซต บำงครงอำจเกดปญหำระบบเสยงไมท ำงำน เนองจำกขอจ ำกดของบรำวเซอรของผใชบรกำร ควรมทำงเลอกส ำรองในกำรน ำเสนอขอมลใหผใชเขำใจขอมลไดโดยไมตองมเสยงประกอบ เสยงทนยมใชทวไป คอ เสยงดนตร (Music) เสยงประกอบหรอเสยงเทคนคพเศษ (Sound Effects) เสยงพด (Voice) เชน เสยงพำกยหรอเลำเรอง เสยงรำยงำนขำย เสยถำยทอดผำนสถำนวทยบนเวบไซต เปนตน เวบไซตทดควรเปดโอกำสใหผใชเลอกวำจะฟงเสยง หยดเสยง หรอฟงซ ำไดตลอดเวลำ

7. ลกเลนของปมหรอสญรป (Icon Effect)คอ ลกษณะทปมไอคอนมกำรเปลยนแปลงส หรอรปรำง เมอมกำรน ำเมำสมำวำงไวบนปม (On-Mouse Effect) หรอเมอคลกทปมนน (Click / Hit) บำงครงอำจมเสยงประกอบ หรอมกำรแสดงภำพทเกยวของ และขอควำมอธบำยเนอหำในหนำเวบทจะลงคไป เมอกดปมนนๆ ซงปมลกษณะนมกสรำงจำกโปรแกรมส ำเรจรปทใชสรำงเวบเพจ เชน Macromedia Flash เปนตน

8. ภำพเคลอนไหวและตวอกษรทกระพรบได (Animation & BLINK/Scrolling Text) เปนกำรน ำตวอกษรหรอภำพทมกำรเปลยนแปลงอยำงตอเนองหลำยๆ ภำพมำเรยงกน โดย 1 ภำพเรยกเปน 1 เฟรม แลวเซฟเปนไฟลเดยว เมอแสดงบนบรำวเซอร จะเหนวำมกำรเปลยนแปลงอยำงตอเนองตำมเฟรมตำงๆ ทเรยงกนอย สรำงควำมรสกวำภำพ หรอตวอกษรนนมกำรเคลอนไหวได ส ำหรบตวอกษรแบบทเรยกวำ BLINK Text นน เปนกำรก ำหนดตวอกษรในเฟรม 2 เฟรมใหมสแตกตำงกน เมอบรำวเซอรแสดงผลทง 2 เฟรมสลบกนไปมำ กจะใหควำมรสกวำตวอกษรนนกระพรบไดไฟลภำพเคลอนไหวทนยมใชทวไปคอ Animated GIF เนองจำกผใชบรกำรสำมำรถเหนควำมเคลอนไหวไดโดยไมตองอำศยปลกอน (Plug-in) คอ โปรแกรมเสรมควำมสำมำรถของบรำวเซอรในกำรแสดงผลสอประเภทมลตมเดย สวนใหญแลวภำพเคลอนไหวมกแสดงผลตอเนองไปไมสนสด เมอดนำนๆ อำจรบกวนสำยตำได ควรก ำหนดในขนตอนกำรออกแบบ วำจะมกำรแสดงผลตอเนองกนกรอบ และหยดเมอเหมำะสม โดยผใชสำมำรถสงใหเลนซ ำไดตำมตองกำร ไฟลตองมขนำดเลกเพอใหภำพเคลอนไหวดำวนโหลดไดอยำงรวดเรว เพรำะผใชบรกำรมกไมอดทนรอนำน หลำยเวบไซตนยม

Page 11: ทฤษฎีการออกแบบเว็บ

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

9. ภำพยนตรขนำดสน (Movie Clip / Video Clip)เปนกำรน ำเสนอขอมลทเหมำะกบเวบไซตทเกยวกบขำว โฆษณำ หรอควำมบนเทงอนๆ ภำพยนตรทน ำเสนอยนเวบไซตควรมควำมยำวไมเกน 5 นำท เพรำะภำพยนตรทมควำมยำวมำก จะมขนำดไฟลใหญ ใชเวลำดำวนโหลดนำนผใชบรกำรอำจไมตองกำรรอ จงควรมทำงเลอกใหกบผใชวำจะชมหรอไม หรอสำมำรถขำมไปดหนำขอมลทเปนตวอกษรไดเลย

10. โลกเสมอนจรง (Virtual Reality)คอ กำรสรำงภำพ 3 มต ทสำมำรถมองเหนวตถไดโดยรอบจำกทกมมมอง เปนกำรจ ำลองใหผใชบรกำรรสกเสมอนไดเขำไปอยในเหตกำรณ หรอสถำนทนนๆ มกใชกบเกมส หรอเวบไซตทมเนอหำเกยวกบงำนออกแบบสถำปตยกรรม ซงตองกำรควำมสมจรงในกำรมองเหน

2. การออกแบบเทคโนโลยการน าเสนอขอมลของเวบไซต หมำยถง องคประกอบอนๆ ทมผลตอควำมสะดวกรวดเรวในกำรเขำถงขอมลทตองกำร รวมทงมผลตอควำมนำสนใจของเวบไซต เชน ลกษณะหนำเปดของเวบไซต (Intro Page) ระยะเวลำทใชในกำรดำวนโหลด (Access Time) เครองมอคนหำขอมล(Search Engine) ลกษณะกำรเปดหนำตำงแสดงผลขอมลทเชอมโยงกน (Target Browser) เปนตน

1. หนำเปดของเวบไซต (Intro Page / Splash Page / Splash Screen)คอ หนำกอนทจะถงโฮมเพจ ท ำหนำทสอขอควำมบำงอยำงของเวบไซตเพอสรำงควำมประทบใจแกผใชบรกำรหนำนจะตองแสดงผลอยำงรวดเรว และนำสนใจดวยกำรใชกรำฟก หรอเทคนคพเศษ เหมำะส ำหรบเวบไซตทตองกำรจะน ำเสนอขอมลพเศษบำงอยำง เชน กำรแนะน ำตว แนะน ำสนคำใหม หรอแสดงขอควำมในโอกำสพเศษตำงๆ โดยทวไปหนำนควรจะดำวนโหลดไดในเวลำ 15 วนำท อำจมลกษณะเปนหนำเวบเพจแบบ HTML ธรรมดำ หรอเปนภำพเคลอนไหวแบบ Introduction Title ทสรำงดวยโปรแกรม Flash เพอดงดดควำมสนใจกได ส ำหรบเวบไซตทวๆ ไป หนำนอำจไมจ ำเปน เพรำะเปนกำรรบกวนเวลำของผใชบรกำร ดงนนหนำ Splash จงควรมทำงเลอกส ำหรบผใชบรกำรทเคยชมหนำนแลว หรอไมตองกำรชม ดวยกำรมลงคทคลกเพอเขำสโฮมเพจไดเลย ซงมกเขยนวำ [Skip Intro]

2. หนำแนะน ำอปกรณกำรใชงำนเวบไซต (Utility Page)ท ำหนำทแนะน ำผใชบรกำรใหใชชนดของบรำวเซอร และรนทเหมำะสม หรอแนะน ำควำมละเอยดของหนำจอทเหมำะสมในกำรแสดงผลของเวบไซต บำงครงกเปนกำรน ำเสนอทำงเลอกในกำรชมเวบไซตใหผใชบรกำรเลอกไดตำมควำมเหมำะสมของอปกรณ โดยกำรสรำงเวบไซตไวหลำยๆ เวอรชน เชน HTML หรอ Flash /Fraphic หรอ Text Only / Framed หรอ Non-Framed / Low-speed หรอ High-speed เปนตน วตถประสงคของหนำนกเพอควำมสำมำรถในกำรน ำเสนอเนอหำของเวบไซตตำมสงแวดลอมทผใชมอยอยำงเหมำะสม บำงกรณอำจเปนกำรรบกวนเวลำของผใชบรกำร และสรำงสบสนแกผใชบรกำรทไมมประสบกำรณเพยงพอ

Page 12: ทฤษฎีการออกแบบเว็บ

3. ระยะเวลำทใชในกำรดำวนโหลด (Access Time)กำรดำวนโหลด (Download) คอกระบวนกำรเคลอนยำยขอมลจำกคอมพวเตอรเครองหนงไปยงอกเครองหนง ในทนหมำยถง กำรรบขอมลจำกเวบเซรฟเวอร เมอมำแสดงผลเปนเวบเพจในบรำวเซอร เวบไซตทดควรใชเวลำในกำรดำวนโหลดนอยทสดเทำทจะเปนไปได เพอสรำงควำมไดเปรยบ และควำมพงพอใจแกผใชบรกำรซงมกไมอดทนรอนำน จำกผลกำรวจยเรอง The Economic Impacts of Unacceptable Web Site Download Speed พบวำ เวบเพจทใชเวลำในกำรดำวนโหลดนำนกวำ 15 วนำท จะมผลใหผใชบรกำรขำดควำมสนใจในเวบไซตนนได(www.zonaresearch.com 2003) ดงนนกำรออกแบบเวบไซตทสวยงำม แตใชเวลำดำวนโหลดมำกจงไมเกดประโยชน ควรค ำนงถงเทคโนโลยกำรน ำเสนอใหมควำมพอด มขนำดไฟลเลก เพอใหใชเวลำนอยลง เชน ก ำหนดใหไฟลกรำฟกในเวบเพจ 1 หนำ มขนำดรวมกนไมเกน 50 Kb ใชตวอกษรแบบ HTML เพอใหดำวนโหลดไดเรวกวำตวอกษรทเปนกรำฟก ก ำหนดขนำดของไฟลภำพพนหลงแบบ Pattern ไมใหเกน 2 Kb หรอตดภำพพนหลงภำพใหญออกเปนชนเลกๆ แลวน ำมำตอกน เพอใหแสดงผลไดเรวขน เปนตน 4. เครองมอคนหำขอมล (Search Box)คอ โปรแกรมทชวยใหผใชบรกำรคนหำขอมลทตองกำรไดอยำงรวดเรว โดยมชองใหผใชบรกำรพมพค ำ หรอขอควำมสนๆ เกยวกบขอมลทตองกำรคนหำ แลวกดปม “คนหำ” โปรแกรมจะท ำกำรคนหำในฐำนขอมล (Database) ทเชอมโยงกบเวบไซตนน แลวแสดงผลลพธทไดพรอมลงคไปสเวบเพจทมขอมลทตองกำร โปรแกรมคนหำขอมลทวไปมกเขยนดวยภำษำแบบ Sever-Side Script คอ ค ำสงจะท ำงำนทเซรฟเวอร และสงเฉพำะผลกำรท ำงำนมำทบรำวเซอร สำมำรถใชงำนรวมกบ HTML ไดทนท เชน ASP (Active Server Page) PHP(Personal Home Page) เปนตน ต ำแหนงทเหมำะสมในกำรจดวำง Search Engine คอ ดำนบนของโฮมเพจ

5. ลกษณะกำรเปดหนำตำงแสดงผลขอมลทเชอมโยงกน (Target Browser) บำงครงเมอผใชบรกำรคลกลงค จะมกำรแสดงผลขอมลบนหนำตำงบรำวเซอรใหม ซงลกษณะกำรเปดหนำตำงใหมน เกดจำกกำรก ำหนดค ำสง Target Browser เปน target_Blank ทเหมำะกบกำรลงคออกนอกเวบไซต แตถำมกำรเปดหนำตำงมำมำกเกนไป ผใชอำจเบอทจะตองคอยปดหนำตำง เมออำนขอมลจบ แตถำก ำหนดค ำสงเปน target_Self หรอเรยกอกอยำงวำ target_Parent บรำวเซอรจะแสดงผลขอมลใหมอยในหนำตำงเดม ซงเหมำะกบเวบเพจทมขอมลนอยๆ แตจะไมสะดวกเมอตองกำรเปรยบเทยบขอมลเดมกบขอมลใหม (สพชญำ เขมทอง,2547)

Page 13: ทฤษฎีการออกแบบเว็บ

การออกแบบโครงสรางเวบไซต องคประกอบในการออกแบบเวบไซตใหมประสทธภาพ

เวบไซตทด มประสทธภำพในกำรใชงำน เกดจำกกำรวำงแผนอยำงรอบคอบในกำรออกแบบ

สวนประกอบตำงๆ ดงน 1. เนอหำและโครงสรำงของขอมล (Content & Site Structure)เวบไซตทดจะตองมเนอหำทเชอถอ

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

2. ระบบเนวเกชน (Navigation System)เวบไซตทดตองมระบบเนวเกชนทเขำใจงำยโดยใชกรำฟกหรอขอควำมทสอควำม หมำยชดเจน มรปแบบและล ำดบของรำยกำรทสม ำเสมอต ำแหนงกำรจดวำงคงท นอกจำกนยงตองใชงำนงำย (User-Friendly Navigation) ไมสลบซบซอน คอ มขนตอนนอยในกำรคนหำขอมล โดยผใชไมควรตองคลกเกน 4 ครง ในกำรหำขอมลแตละครง จำกกำรส ำรวจของ Forester Research พบวำ 40% ของผใชจะไมกลบเขำชมซ ำ ถำพบวำระบบเนวเกชนไดงำนยำก แมวำเวบไซตนนจะสวยงำมเพยงไรกตำม

ต ำแหนงทเหมำะสมในกำรวำงเนวเกชนเมน คอ ดำนบนของเวบเพจ และควรมหนำแสดงโครงสรำงกำรเชอมโยงขอมล (Link) ทงหมดภำยในเวบไซต ในรปแผนผง สำรบญ หรอ Site Map เพอปองกนไมใหผใชหลงทำง นอกจำกนในทกๆ เวบเพจควรมลงคกลบมำทโฮมเพจ (หนำแรก) เพอใหผใชสำมำรถยอนกลบมำตงตนใหมได ในกรณทเวบเพจมควำมยำวมำก ควรมกำรเชอมโยงภำยในหนำนน (Page Link) เพออ ำนวยควำมสะดวกแกผใชดวย

3. ออกแบบกรำฟก (Graphic Design)กำรออกแบบกรำฟกในเวบไซตทดควรมคณสมบต ดงน 1. มควำมเรยบงำย (Simplicity)เวบไซตทดจะจ ำกดองคประกอบเสรมทใชในกำรน ำเสนอให

เหลอแตสงทจ ำเปน ท ำใหไมกรำฟกรกรงรง มกำรใชชนดและสของตวอกษรไมมำก โดยเฉพำะสของลงค 3 ประเภท คอ ลงคปกต (Link) ลงคทก ำลงใชงำน (Active Link) และลงคทผำนกำรใชงำนแลว (Visited Link) ควรใชสมำตรฐำนทโปรแกรมก ำหนดไวให เพรำะเปนสทผใชทวไปคนเคยอยแลว จงไมสบสน

Page 14: ทฤษฎีการออกแบบเว็บ

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

3. มเอกลกษณ (Identity)เปนกำรออกแบบเพอสะทอนลกษณะเฉพำะขององคกร โดยกำรใชชดส ลกษณะของตวอกษร รปภำพ และกรำฟกทเหมำะสม

4. มคณภำพ (Design Stability)ในทนรวมกำรออกแบบทสวยงำม ดงดดควำมสนใจ (Visual Appeal) และคณภำพในกำรออกแบบดวย คอ มควำมประณต ควำมเปนระเบยบในงำน ดวยกำรใชภำพประกอบทมคณภำพและมกำรน ำเสนอทด ตวอกษรอำนงำยสบำยตำ ใชโทนสกลมกลนสวยงำมเหมำะสม มกำรจดต ำแหนงภำพและตวอกษรโดยใชตำรำง (Table) และสดมภ (Column) ท ำให Layout เปนระเบยบเรยบรอย สรำงควำมนำเชอถอใหกบขอมลในเวบไซต

5. ไมมขอจ ำกดในกำรใชงำน (Compatibility)เวบไซตทดตองสำมำรถแสดงผลไดบนบรำวเซอรทกชนด ทกควำมละเอยดของหนำจอ (Monitor Resolution) ตองใชงำนไดอยำงไมมปญหำกบระบบทกระบบปฏบตกำร (Operating System) และไมควรบงคบใหผใชบรกำรตองตดตงโปรแกรม หรออปกรณอนใดเพมเตมในกำรใชงำนอก 6. แสดงผลไดอยำงรวดเรวหมำยถง เทคนคในกำรเลอกใชกรำฟก เพอควำมรวดเรวในกำรดำวนโหลด โดยใชกรำฟกทมขนำดของไฟลเลกทสด แตมคณภำพดทสด (Optimized Graphic) และหลกเลยงกำรใชกรำฟกเกนควำมจ ำเปน จงไมควรใชภำพขนำดใหญ หรอใชภำพจ ำนวนมำกในหนำเดยวกน ส ำหรบเวบไซตทมกรำฟกมำก ควรแนใจวำหำกปรำศจำกกรำฟกเหลำนน เวบไซตจะยงสำมำรถสอขอมลขำวสำรทตองกำรได โดยใหผใชเลอกไดวำจะชมแบบทมภำพกรำฟก หรอชมแบบตวอกษร เพรำะหำกมกรำฟกมำกเกนไปจะใชเวลำดำวนโหลดนำนสนเปลองคำใชจำยในกำรตออนเตอรเนต ท ำใหผใชบรกำรไมรอ และเลกชมเวบไซตนนๆ

Page 15: ทฤษฎีการออกแบบเว็บ

การประชาสมพนธ

องคความร เกยวกบการประชาสมพนธ(Public Relation) ววฒนำกำรของกำรประชำสมพนธในประเทศไทยไดก ำเนดขนอยำงเปน ทำงกำรเกนกวำกงศตวรรษ

แลว โดยเรมตงแตป พ.ศ. 2476 เมอรฐบำลไดกอตง“กองโฆษณำกำร”(กรมประชำสมพนธในปจจบน) เพอเผยแพรควำมรควำมเขำใจเกยวกบกำรปกครองระบอบประชำธปไตย และเพอเผยแพรกจกรรมตำง ๆ ของทำงรำชกำรใหแกประชำชน จำกนนกำรประชำสมพนธกไดพฒนำขนเรอย ๆ ไดเรมขยำยดวยกำรตง โรงเรยนกำรประชำสมพนธ เพอสอนและอบรมใหมบคลำกรทมควำมรควำมสำมำรถในงำนดำนนไปรบใชสงคมมำกขนและมกำรเปดสอนระดบปรญญำตรในสำขำวชำกำร ประชำสมพนธ บทบำทของกำรประชำสมพนธจงมควำมส ำคญมำกขนเปนล ำดบ ในกำรทชวยสรำงภำพพจนทดใหแกหนวยงำน ในขณะเดยวกนกำรประชำสมพนธเปรยบ เสมอนประตทเปดรบควำมคดเหนของประชำชนทมตอหนวยงำนนน ๆ ปจจบนงำดำนประชำสมพนธไดเปนทยอมรบในภำครฐ รฐวสำหกจเอกชนและสมำคมมลนธ ตำงๆมำกขน หนวยงำนระดบกรมหรอเทยบเทำของภำครฐทกสถำบนของรฐวสำหกจ หลำย ๆ ธรกจ เอกชนโดยเฉพำะสถำบนทมขนำดใหญหรอมควำมสมพนธเกยวของกบ ประชำชนจ ำนวนมำก ตำงกมฝำยประชำสมพนธและหรอผปฏบตงำน/เจำหนำททท ำงำนทำงดำนนโดยตรงอยำงไรกตำมจำกอดตถงปจจบนกำรประชำสมพนธสำมำรถจ ำแนกไดเปนสองลกษณะ โดยในอดตนนกำรประชำสมพนธเปนเพยงกำรเผยแพรควำมรควำมเขำใจ ขำวสำรขอมลและเรองรำวตำง ๆ ของสถำบนไปสประชำชน หรออำจสรปไดวำ เปนกำรสอสำรทำงเดยวในอนทจะใหประชำชนไดรบทรำบ มควำมรควำมเขำใจ เกดควำมนยมและศรทธำ แตในปจจบนบทบำทของกำรประชำสมพนธไดเปลยนแปลงไป นอกจำกจะมควำมหมำยและควำมส ำคญในกำรสงเสรม และสนบสนนดำนกำรตลำดและกำรขำย มควำมสมพนธกบกำรโฆษณำพรอม ๆ กบมบทบำทหนำทในกำรสรำงบ ำรงรกษำและแกภำพพจนใหแกสถำบนแลว กำรประชำสมพนธยงสรำงควำมสมพนธ ระหวำงสถำบนกบประชำชนใหถกตองเหมำะสมยงขน โดยเฉพำะกำรตระหนกและเคำรพในควำมร ควำมคดเหน ควำมตองกำรและพฤตกรรมของประชำชนทเกยวของมำกขน ซงยงผลใหกำรประชำสมพนธมลกษณะของกำรสอสำรแบบยควถหรอกำรสอสำรสองทำงไป กลบ (two3way communication) ทสมบรณขน

ความหมายของการประชาสมพนธ ค ำวำ “กำรประชำสมพนธ” มำจำกค ำวำ “ประชำ” กบ “สมพนธ” ซงตรงกบภำษำองกฤษวำ

“public relations” หรอทเรยกกนทวไปวำ “PR” ตำมค ำศพทนหมำยถงกำรมควำมสมพนธเกยวของกบประชำชน ตำมพจนำนกรมฉบบรำชบณฑตยสถำน พ.ศ. 2525 หมำยถง กำรตดตอสอสำร เพอสงเสรมควำมเขำใจอนถกตองตอกน และถำจะขยำยควำมหมำยใหเปนรปธรรมยงขน จะหมำยถง “ควำมพยำยำมทมกำรวำงแผนและเปนกำรกระท ำทตอเนอง ในอนทจะมอทธพลเหนอควำมคดจตใจของประชำชน กลมเปำหมำยโดยกำรกระท ำสงทดมคณคำใหกบสงคม เพอใหประชำชนเหลำนเกดทศนคตทดตอหนวยงำนกจกรรม และ

Page 16: ทฤษฎีการออกแบบเว็บ

บรกำร หรอสนคำของหนวยงำนน และเพอทจะไดรบกำรสนบสนนและรวมมอทดจำกประชำชนเหลำนในระยะยำว” อยำงไรกด ไดมผใหควำมหมำยของกำรประชำสมพนธไวดงตวอยำงตอไปน

ด.ร.เสร วงษมณฑำ, 2540 ใหควำมหมำยวำ “กำรประชำสมพนธเปนควำมพยำยำมทมกำรวำงแผนในกำรทจะมอทธพลเหนอควำมคดจตใจของสำธำรณชนทเกยวของ โดยกระท ำสงทดทมคณคำกบสงคม เพอใหสำธำรณชนเหลำนนมทศนคตทดตอหนวยงำน องคกร บรษท หำงรำน หรอ สมำคม ตลอดจนมภำพพจนทดเกยวกบหนวยงำนตำง ๆ เหลำนน เพอใหหนวยงำนไดรบกำรสนบสนนและควำมรวมมอทดจำกสำธำรณชนทเกยวของในระยะยำวตอเนองกนไปเรอย ๆ”

สพณ ปญญำมำก, 2535 อธบำยไววำ “ควำมพยำยำมทมแผนทจะมอทธพลตอควำมคดและทศนคตของประชำชน เพอสรำงควำมสมพนธอนดระหวำงประชำชนกบหนวยงำน”

สะอำด ตณศภผล,2536 อำจำรยผซงมควำมส ำคญมำกผหนงในกำรวำงรำกฐำนกำรเรยนกำรสอนวชำกำรประชำสมพนธของไทยในปจจบนไดกลำวำ “กำรประชำสมพนธ คอ วธกำรของสถำบนอนมแผนกำรและกระท ำตอเนองกนไป ในอนทจะสรำงหรอยงใหเกดควำมสมพนธอนดกบกลมประชำชน เพอใหสถำบนและกลมประชำชนทเกยวของมควำมรควำมเขำใจ และใหกำรสนบสนนรวมมอกนและกน อนจะเปนประโยชนใหสถำบนนนด ำเนนงำนไปไดผลดสมควำมมงหมำย โดยมประชำมตเปนแนวบรรทดฐำนอนส ำคญดวย”

จำกตวอยำงควำมหมำยของกำรประชำสมพนธดงกลำวขำงตนน ถงมควำมแตกตำงกนแตกพอสรปควำมหมำยได 4 ประเดน คอ

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

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

3. มอทธพลตอควำมคดและทศนคต จดมงหมำยของกำรประชำสมพนธ คอ กำรโนมนำวจตใจของประชำชนกลมเปำหมำยใหมทศนคตทดตอหนวยงำน กจกรรมและกำรบรกำรหรอสนคำของหนวยงำน กำรทจะมทศนคตทดนนหมำยถงกำรมควำมรกำรเขำใจทถกตองทจะสงผลใหมควำมรสกทด และมพฤตกรรมทเปนกำรสนบสนนหรอรวมมอ

Page 17: ทฤษฎีการออกแบบเว็บ

4. มควำมสมพนธกบประชำชนถำหำกไมมควำมสมพนธระหวำงหนวยงำนกบประชำชนแลว กจะไมมกำรประชำสมพนธเกดขนได ควำมสมพนธนจะเปนควำมเขำใจทถกตองและมคณคำแกประชำชน และขณะเดยวกนหนวยงำนกยนดทจะรบฟงควำมคดเหน และใหควำมส ำคญตอปฏกรยำโตตอบของประชำชนดวย

การสรางภาพลกษณ เพอการประชาสมพนธ ภำพลกษณ (IMAGE) หรอบำงแหงกอำจใชวำ จนตภำพ หรอภำพพจน นมควำมส ำคญตอกำร

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

ทมำของภำพลกษณนน มกจะเกดขนได 2 ลกษณะ 1. ภำพลกษณทเกดโดยธรรมชำต ซงเปนภำพลกษณทเรำไมสำมำรถจะควบคมไดเชน เกดจำก

ลกษณะของธรกจเองทเสยงตอกำรถกโจมตอยแลว โดยเฉพำะ ธรกจทเกยวของกบกำรบรกำรสำธำรณะ หรออำจจะเกดขนจำกสงบงเอญทงหลำย เชน กำรกระท ำผดพลำดโดยฝำยจดกำรหรอโดยพนกงำน หรอเกดอบตเหต และทพบบอยครงคอ กำรเขำใจผดคลำดเคลอนหรอขำวลอ

2. ภำพลกษณทเกดขนดวยกำรปรงแตง โดยกำรก ำหนดเอำไวลวงหนำวำ เรำตองกำร ใหสถำบนของเรำมภำพลกษณ เชนไรบำง เชนตองกำรใหมภำพลกษณของ ควำมมนคงทำงธรกจตองกำรใหมภำพลกษณ เชนไรบำง เชนตองกำรใหมภำพลกษณของควำมมนคงทำงธรกจ,ตองกำรใหมภำพลกษณของควำมกำวหนำทนสมย หรอตอง กำรใหมภำพลกษณของผประกอบกำรทมควำมรบผดชอบตอสงคม และอยภำยใต กฎหมำยบำนเมอง ฯลฯ

จำกลกษณะทมำของภำพลกษณทง 2 ลกษณะน ภำพลกษณทไมพงประสงคมโอกำสเกดขนไดเสมอ โดยเฉพำะภำพลกษณทเกด โดยธรรมชำต ซงเรำควบคมไมได กำรปฏบตงำนประชำสมพนธเพอปองกนหรอแกไขภำพลกษณทไมพงประสงค นน จะตองอำศยหลกปฏบตพนฐำนดงน

Page 18: ทฤษฎีการออกแบบเว็บ

1.มกำรตดตำมตรวจสอบควำมคดเหนของประชำชนกลมเปำหมำยอยำง สม ำเสมอ 2. มกำรตรวจสอบและประเมนขำวสำร ทไดปรำกฏออกไปสประชำชนอยำงใกลชด 3. ไมวำจะเปนกจกรรมหรอพฤตกรรมใด ๆ ขององคกำร จะตองไดรบกำรชแจงใหประชำชน

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

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

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

ภำพลกษณทดขององคกำร หรอสถำบนใดสถำบนหนง ยอมเปนผลแหงควำมเพยรพยำยำม ดวยเวลำอนยำวนำนขององคกำรสถำบนนน กำรสรำงภำพลกษณทด จงไมอำจท ำไดในเวลำอนรวดเรว หรอใชเวลำ เพยงชวงสน ๆ ไดเพรำะภำพลกษณเปนสงทเกดขนทละนอย และสะสมเพมพนมำกขน จนฝงรำกฐำนมนคงแนนหนำอยในจตใจและทศนคต หรอควำมรสกนกคดของประชำชน

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

Page 19: ทฤษฎีการออกแบบเว็บ

หลกส าคญในการสรางภาพลกษณทดใหแกหนวยงาน กำรสรำงภำพลกษณทดใหแกหนวยงำน องคกำร สถำบน นกประชำสมพนธ และผทท ำงำนดำนกำร

ประชำสมพนธ ควรยดถอหลกดงตอไปน 1. คนหำ จดด จดดอย : คนหำจดดและจดบกพรองหรอจดออนแหงภำพลกษณของหนวยงำนทมอย

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

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

3. คดหวขอ (THEMES) เพอใชในกำรสรำงภำพลกษณแกประชำชน ซงหวขอเหลำนกคอ เนอหำ ขำวสำร ทเรำจะใชในกำรเผยแพรประชำสมพนธตอกลมประชำชน อำจใชเปนค ำขวญ (SPOGAN) หรอขอควำมสน ๆ ทกนควำมและชวนใหจดจ ำไดงำย สงส ำคญกคอ หวขอเหลำนจะตองมประสทธภำพในกำรดงดดควำมสนใจ และอทธพลโนมนำวชกจงประชำชนใหเกดภำพลกษณตำมทเรำตองกำร 4. ใชเครองสอสำรตำง ๆ เขำชวย ในกำรท ำงำนสรำงภำพลกษณใหเปนไปอยำงมประสทธภำพ เขำถงประชำชนเปำหมำยไดอยำงกวำงขวำง ซงอำจใชสอ มวลชนตำง ๆ เขำชวยเชน หนงสอพมพ วทย โทรทศน เปนตนรวมทงกำรใชกำรโฆษณำเพอกำรประชำสมพนธ (PUBLICRELATION ADVERTISING) สงพมพตำงๆ เชน จลสำรโปสเตอรแผนพบ เปนตน กำรสรำงภำพลกษณทดใหแกหนวยงำน เปนหนำทของสมำชกทกคนในองคกร กำรสรำงภำพลกษณทดแกประชำชน หนวยงำนสถำบน จะไมมวนท ำ ส ำเรจไดเลยถำหำกปรำศจำกควำมรวมมอ จำกบรรดำสมำชกของหนวยงำน พนกงำน เจำหนำทคนงำนทกคนซงบคคลเหลำนตองตดตอกบประชำชน และมบทบำทมำกใน กำรทจะสรำงควำมประทบใจ หรอภำพลกษณตำง ๆ ใหเกดขนตอควำมรสกนกคดและ จตใจของประชำชน ผมำตดตองำนดวยกบองคกำร ภำพลกษณ (IMAGE) เปนสงทเกดขนไดและเปลยนแปลงไดเสมอ กลำวคอ อำจเปลยนจำกภำพลกษณทด เปนภำพลกษณทไมด หรออำจเปลยนแปลงจำก ภำพลกษณทไมดมำเปนภำพลกษณทด ฉะนนภำพลกษณจงเปนสงทสรำงขนได กำรประชำสมพนธจะมบทบำทอยำงมำกในกำรเสรมสรำงและเปลยนแปลงภำพลกษณนอกจำกนกำรประชำสมพนธทดมประสทธภำพ ยงชวยสงเสรมและรกษำภำพลกษณทดขององคกำร สถำบน ใหด ำรงยงยนถำวรตอไป ซงทงนยอมตองอำศยปจจยอน ๆ เขำประกอบดวย

Page 20: ทฤษฎีการออกแบบเว็บ

การโฆษณาสถาบน (Institutional Advertising) เปนทนำสงเกตวำกำรโฆษณำสนคำในปจจบนนมไดมงเพอกำรขำยสนคำหรอบรกำรเพยงอยำงเดยว

แตมงทจะสรำงควำมประทบใจและสรำงสรรคสงทมประโยชนใหแกสงคมตลอดจนเปนกำรมงสรำงชอเสยงเกยรตคณ ภำพลกษณทดใหแกองคกำร/สถำบนกำรศกษำ กำรโฆษณำประเภทนเรำเรยกวำ กำรโฆษณำสถำบน/องคกำร (Institutional Advertising) หรอกำรโฆษณำบรษท (Corporate Advertising)

วตถประสงคของกำรโฆษณำสถำบนทส ำคญม 3 ประกำรคอ 1. เพอใหไดรบกำรสนบสนน กำรทผบรโภคจะใหกำรสนบสนนกจกำรของบรษทหรอสถำบนดวย

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

2. เพอกำรประชำสมพนธ ในบำงครงกำรโฆษณำบรษทจะมลกษณะเปนกำรประชำสมพนธ เพอแจงขำวสำรขอมลตำง ๆ จำกบรษทไปยงกลมประชำชนเปำหมำย เชน กำรฉลองครบรอบบรษท กำรโฆษณำกำรแสดงงบดลประจ ำปของบรษท กำรบรจำคสนคำของบรษทใหแก หนวยงำนตำง ๆ ฯลฯ โดยผำนเครองมอและสอมวลชนประเภทตำง ๆ

3. เพอบรกำรสำธำรณะ เปนกำรโฆษณำทแสดงจดยนหรอแนวควำมคดตอเรองส ำคญ ๆ ทเปประโยชนตอสงคมโดยสวนรวม หนวยงำนทงภำครฐและภำคเอกชน มกจะแสดงควำมคดเหนอยำงเปดเผยตอประเดนหรอปญหำของสงคม

กระบวนการด าเนนงานประชาสมพนธ โดยทวไปเมอกลำวถง กระบวนกำรด ำเนนงำนประชำสมพนธ นน ต ำรำ ตำง ๆ มกอำงค ำกลำวของ

สกอต เอม.คทลป (Soott m.utlip) และ แอลเลน เอช.เซนเตอร (Aiien H. Center) ผซงมอทธพลตอวชำกำรประชำสมพนธในชวง 20 กวำปน ซงทง 2 ไดกลำวถงขนตอนในกำรด ำเนนงำนประชำสมพนธอยำงมประสทธผลไววำ กำรด ำเนนงำนประชำสมพนธ ควรปฏบตเปนขนตอนดงตอไปน

1. ขนตอนกำรวจย – กำรรบฟง (Research-Listening) เปนขนแรกของ กำรด ำเนนงำนประชำสมพนธ ซงนกประชำสมพนธจะตองปฏบตโดยกำรส ำรวจคนหำปญหำตำง ๆ ไมวำจะเปนควำมคดเหน ปฏกรยำ อคต ทำท ควำมรสกและอน ๆ ของกลมประชำชนทเกยวของกบกำรปฏบตงำนหรอนโยบำยของสถำบนเพอประมวลขอมลทได ซงรวมทงขอมลเกยวกบขอเทจจรงของสถำบนดวย อนจะน ำมำซงขนตอนตอไปในกำรด ำเนนงำนประชำสมพนธ

2. ขนตอนกำรวำงแผนตดสนใจ-เตรยมปฏบตงำน (Planning-Discision- Making)ขนตอนนเปนขนตอนกำรน ำเอำขอมลทไดจำกขนทหนงมำเปนตวก ำหนดนโยบำยและโครงกำรของสถำบนเพอประโยชนของทก ๆ ฝำย

Page 21: ทฤษฎีการออกแบบเว็บ

3. ขนตอนกำรตดตอสอสำร-กำรปฏบตกำร (Communication-Action) เปนขนตอนของกำรเผยแพรขำวสำรนโยบำยทำท ตลอดจนควำมรสกและขอเทจจรงตำง ๆ ไปยงกลมประชำชนทเกยวของ

4. ขนตอนกำรประเมนผล (Evaluation) เปนขนตอนสดทำยส ำหรบกำรด ำเนนกำรประชำสมพนธ ในกำรประเมนผลโครงกำรตำง ๆ ตลอดจนเทคนคทงหลำยทใชในกำรประชำสมพนธ เพอปรบปรงแกไขในกรณทไมไดผลดตำมคำดหวงหรอเปนแนวทำงปฏบตในงำนประชำสมพนธอน ๆ ตอไป

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

สรำงสรรคควำมเขำใจในสงใดบำง หรอตองกำรแกปญหำใด เปนตน 2. กำรก ำหนดกลมประชำชนเปำหมำย จะตองระบใหแนชดวำกลมประชำชนเปำหมำยคอใคร ม

พนฐำนกำรศกษำหรอภมหลงอยำงไร รวมทงรำยละเอยดตำง ๆ เชน ฐำนะทำงเศรษฐกจและสงคมตลอดจนดำนจตวทยำ เชน ใครสำมำรถจะเปนผน ำควำมคดเหนมอทธพลตอกำรแพรกระจำยขำวสำรสประชำชนอกตอหนง

3. กำรก ำหนดแนวหวเรอง จะตองก ำหนดใหแนนอนวำ แนวหวขอเรอง นนจะเนนไปทำงใด ตลอดจนกำรก ำหนดสญลกษณหรอขอควำมสน ๆ เปนค ำขวญ ตำง ๆ ทจดจ ำไดงำยหรอดงดดควำมสนใจและเตอนใจไดด

4. กำรก ำหนดชวงระยะเวลำ จะตองมกำรก ำหนดชวงระยะหรอจงหวะ เวลำทเหมำะสมทสดในกำรปฏบตงำนใหเปนไปอยำงมประสทธภำพ เชน จะเรมท ำกำร เผยแพรลวงหนำ (Advanced publicity) เพอเปนกำรอนเครองหรอปพนเสยกอน เปนกำรเรยกควำมสนใจและถงวนรณรงคเพอปฏบตงำนอยำงเตมทเมอไร วนเวลำอะไร สงเหลำนจะตองก ำหนดไวลวงหนำอยำงแนชด

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

6. กำรก ำหนดงบประมำณ จะตองก ำหนดงบประมำณทจะใชในกำรด ำเนนกำรใหชดเจน เพอมใหเกดปญหำภำยหลง เชน งบประมำณไมพอ หรอตองใชจำยเกนงบประมำณไปฯลฯ กำรก ำหนดงบประมำณนยงหมำยรวมถงก ำลงบคลำกร ตำง ๆ ทจะใชในกำรด ำเนนกำรดวย กำรตดตอสอสำร เมอมกำรวำงแผนทจะด ำเนนกำรเรยบรอยแลว งำนขนตอไป กคอกำรตดตอสอสำรหรอกำรปฏบตกำรสอสำรนนเอง กำรด ำเนนงำนในขนนจงเปนกำรลงมอปฏบตกำรสอสำรประชำสมพนธกบประชำชนทเกยวของ โดยด ำเนนงำนตำมแผนหรอวตถประสงคทวำงไว รวมทงกำรเลอกเครองมอและวธกำรสอสำร เขำมำชวยด ำเนนงำน ใหไดประสทธภำพสงสด อนจะท ำใหกำรตดตอสอสำรจำกองคกำรไปยงประชำชน เปนไปไดอยำงรวดเรว ฉบไว ประหยด และ สะดวกยงขน ในกำรปฏบตตำมสอสำรน จะตองใหเหมำะสมกบสถำนกำรณ และทนกำรณ จงจะไดผลตอบสนองทนำพอใจ อนง กำรตดตอสอสำรเพอกำรประชำสมพนธนน เปนกำรตดตอสอสำรแบบสองทำง

Page 22: ทฤษฎีการออกแบบเว็บ

คอ องคกำรสถำบนสอสำรประชำสมพนธไปยงประชำชนแลว ขณะเดยวกนกรบฟงควำมคดเหน ปฏกรยำ ทำท ของประชำชนทมตอขำวสำรนน หรอตอองคกำรสถำบนดวย

การเลอกใชสอและเขาถงกลมประชาชนเปาหมาย กำรเลอกใชสอ เปนกลยทธของกำรวำงแผนกำรประชำสมพนธ เพอทจะเขำถงประชำชนเปำหมำย

เมอทรำบวำกลมเปำหมำยคอใครแลว กำรหำวธกำรและกำรวำงแผนกำรใชสอทเหมำะสมจงเปนสงทตองค ำนงถงในกำรเลอกใชสอ โดยเฉพำะ ในกรณทตองซอสอ ผวำงแผนตองค ำนงถงควำมครอบคม (COVERAGE) หรอจำกทสอนนสำมำรถเขำถงประชำชนไดมำกนอยเพยงใดโดยอำจจะพจำรณำจำกยอดจ ำหนำย หรอจำกบทบรรณำธกำรวำมลกษณะและคณภำพนำเชอถอ นำอำนเพยงใด ควำมครอบคลมน หมำยถง กำรสอสำรเขำถงประชำชนเปำหมำย ณ ชวง เวลำใดเวลำหนง เชน ณ ชวงเวลำทก ำหนดไว ประชำชนเปำหมำยควรไดมโอกำสรบฟง ขำวสำรอยำงนอยหนงครง โดยทวไปจะก ำหนดระยะเวลำประมำณ 4 สปดำห นอกจำก ค ำนงถงควำมครอบคลมของกำรเลอกใชสอเพอเผยแพรขำวสำรออกไป แลวยงตองค ำนงถงควำมบอยครง หรอควำมถ (FREQUENCY) หมำยถง จ ำนวนครงภำยในระยะ เวลำทก ำหนดทประชำชนไดรบฟงขำวสำรนน(อยำงนอยในชวงระยะ 4 สปดำห) และสงทส ำคญทตองพจำรณำคอ ควำมตอเนอง (CONTINUITY)ควำมตอเนอง หมำยถง กำรใชสอในกำรเผยแพรขำวสำรออกไปในชวงระยะเวลำทก ำหนดไว (เชนในชวงของ กำรรณรงค) วำจะใชระยะเวลำนำนเทำใด ซงบำงครงอำจใชฤดกำล เทศกำลหรอวนส ำคญทำงประเพณเปนเครองชวยในกำรพจำรณำตดสนใจ วำจะใชสอใหมควำมตอเนองอยำงไร นอกจำกทกลำวมำแลว ควรพจำรณำดวยวำ จะใชสอตวใด เนองจำกสอ ชนดเดยวกน มควำมหลำกหลำยในเนอหำ รปแบบ กลมเปำหมำย หรอสอวทย ซงมหลำยสถำนทท ำกำรกระจำยเสยงและสอโทรทศน ซงมรำยกำรในชวงเวลำตำง ๆ มำกมำย แตละรำยกำรอำจมควำมหมำยแตกตำงในดำนกลมเปำหมำย คอผอำน ผฟง ผชม อนมผลตอกำรจดเนอหำรปแบบกำรน ำเสนอเพอออกอำกำศเผยแพรใหเหมำะสมกบกลมเปำหมำยสวนใหญ ดวยเหตนกำรเลอกใชสอจงตองมควำมพถพถน พอสมควรเพอ ใหกำรใชสอในกำรประชำสมพนธนน ไดผลมำกทสด หรอมประสทธภำพมำกทสดดวย

ทฤษฎปฏสมพนธ (Interactive Media Theory) Rataeli’s (1988) กลำวถงแนวคดทฤษฎปฏสมพนธทำงกำรสอสำรวำ “ปฏสมพนธในกำรสอสำรนน

เปนกำรแสดงออกของสวนขยำยของกำรแลกเปลยนในกำรสอสำร ซงกำรสอสำรยอยกลบในครงตอๆไป จะเกยวพนกบควำมเขมขนในกำรสอสำรทเกดขนกอนหนำน ยอนลงไปจนถงกำรสอสำรในครงแรก” (ปยะวรรณ หอมถวล, 2541 : 28)

ลกษณะของกระบวนกำรสอสำรแบบมปฎสมพนธนมำจำกกำรสอสำรระหวำงบคคล และมกเปนกำรสอสำรแบบเผชญหนำ (Face to Face Communication) โดยไมผำนตวกลำงแตในปจจบนเทคโนโลยกำรสอสำรไดถกพฒนำขน จนท ำใหรปแบบของกำรปฎสมพนธ ในกำรสอสำรระหวำงบคเปลยนไป โดยทผสอสำรสำมำรถสรำงปฏสมพนธผำนเครองมอสอสำรตำงๆ ได เชน ระบบคอมพวเตอรเครอขำย

Page 23: ทฤษฎีการออกแบบเว็บ

ค ำอธบำยตำมทฤษฎน คอกระบวนกำรสอสำรทเกดขนจะเปนกำรสอสำรระหวำงบคคลโดยทผรวมสอสำรไมไดมกำรเผชญหนำกนและกน หำกเปนกำรสอสำรตำงสถำนท เปนกำรสอสำรผำนตวกลำงซงผรวมสอสำสำมำรถรบรในกระบวนกำรแลกเปลยนขำวสำรทเกดขนในกำรสอสำรและสรำงปฎสมพนธในกำรสอสำรระหวำงกนไดโดยผำนตวกลำง ณ ทนคอ “กำรสอสำรผำนเครอขำยคอมพวเตอร” (อดศกด อนนนบ, 2540 : 27)

1 ทฤษฎมลตมเดยปฏสมพนธ กำรใชมลตมเดยโดยทวไป จะพจำรณำคณสมบตหลก 2ประกำร คอ กำรควบคมกำรใชงำนและควำมสำมำรถในกำรมปฏสมพนธกบผใชกำรควบคมกำรใชงำนเปนคณสมบตพนฐำนของระบบมลตมเดย คอ ผใชตองสำมำรถควบคมระบบและขนตอนกำรน ำเสนอไดงำยไมซบซอนควำมสำมำรถในกำรมปฏสมพนธกบผใช เปนคณสมบตทเพมขนมำพรอมๆ กบพฒนำกำรดำนเทคโนโลยคอมพวเตอรซงชวยใหผใชงำนสำมำรถโตตอบกบคอมพวเตอรในรปแบบตำงๆ โดยคอมพวเตอรจะน ำขอมลจำกผใชไปประมวลผลเพอใชเปนขอมลในกำรโตตอบหรอใชงำนไดอยำงมประสทธภำพขน

2 องคประกอบของสอมลตมเดยปฏสมพนธมลตมเดยมควำมสำมำรถในกำรรวบรวมกำรน ำเสนอของสอตำงๆไวดวยกน โดยใชคอมพวเตอรเปนอปกรณหลกโดยกำรใชซอฟตแวรโปรแกรมสรำงสอประสมในกำรน ำเสนอ ฉะนน คอมพวเตอรมลตมเดยจะตองประกอบดวยองคประกอบทส ำคญ (กดำนนท มลทอง. 2548: 194-196; Linda. 1995: 4-6) ดงตอไปน

1. ขอควำม (Text) หมำยถง ตวหนงสอและขอควำมทสำมำรถสรำงไดหลำยรปแบบหลำยขนำด กำรออกแบบใหขอควำมเคลอนไหวใหสวยงำม แปลกตำ และนำสนใจไดตำมตองกำรอกทงยงสรำงขอควำมใหมกำรเชอมโยงกบค ำส ำคญอนๆ ซงอำจเนนค ำส ำคญเหลำนนดวยสหรอขดเสนใต ทเรยกวำ ไฮเปอรเทกซ(Hypertext) ซงสำมำรถท ำไดโดยกำรเนนสตวอกษร (Heavy Index)เพอใหผใชทรำบต ำแหนงทจะเขำสค ำอธบำย ขอควำม ภำพถำย ภำพวดทศน หรอเสยงตำงๆ ได

2. ภำพกรำฟก (Graphic) หมำยถง ภำพถำย ภำพเขยน หรอน ำเสนอในรปไอคอนภำพกรำฟกนบวำเปนสงส ำคญในสอประสม เนองจำกเปนสงดงดดสำยตำและควำมสนใจของผชมสำมำรถสรำงควำมคดรวบยอดไดดกวำกำรใชขอควำม และใชเปนจดตอประสำนในกำรเชอมโยงหลำยมตไดอยำงนำสนใจ ภำพกรำฟกทใชในสอประสมนยมใชกนมำก 2 รปแบบ คอ 2.1 ภำพกรำฟกแบบบตแมป (Bitmap Graphic) หรอเรยกอกอยำงหนงวำRaster Graphic เปนกรำฟกทสรำงขนโดยใชตำรำงจดภำพ (Grid of Pixels) ในกำรวำดกรำฟกแบบบตแมป จะเปนกำรสรำงกลมของจดภำพแทนทจะเปนกำรวำดรปทรงของวตถเพอเปนภำพขนมำกำรแกไขหรอปรบแตงภำพจงเปนกำรแกไขครงละจดภำพไดเพอควำมละเอยดในกำรท ำงำน ขอไดเปรยบของกรำฟกแบบนคอ สำมำรถแสดงกำรไลเฉดสและเงำอยำงตอเนองจงเหมำะส ำหรบตกแตงภำพถำยและงำนศลปตำงๆ ไดอยำงสวยงำม แตภำพแบบบตแมปมขอจ ำกดอยำงหนงคอ จะเหนเปนรอยหยกเมอขยำยภำพใหญขน ภำพกรำฟกแบบนจะมชอลงทำยดวย .gif, .tiff, .bmp 2.2 ภำพกรำฟกแบบเวกเตอร (Vector Graphic) หรอเรยกอกอยำงหนงวำDraw Graphic เปนกรำฟกเสนสมมตทสรำงขนจำกรปทรงโดยขนอยกบสตรคณตศำสตรภำพกรำฟกแบบนจะเปนเสนเรยบนมนวล

Page 24: ทฤษฎีการออกแบบเว็บ

และมควำมคมชดหำยขยำยใหญขน จงเหมำะส ำหรบงำนประเภททตองกำรเปลยนแปลงขนำดภำพ เชน ภำพวำดลำยเสน กำรสรำงตวอกษร และกำรออกแบบตรำสญลกษณ ภำพกรำฟกแบบนจะมชอลงทำยดวย .eps, .wmf, .pict

3. ภำพแอนเมชน (Animation) เปนภำพกรำฟกเคลอนไหว โดยใชโปรแกรมแอนเมชน (Animation Program) ในกำรสรำง เรำสำมำรถใชภำพทวำดจำกโปรแกรมวำดภำพ (DrawPrograms) หรอภำพจำก Clip Art มำใชในกำรสรำงภำพเคลอนไหวไดโดยสะดวก โดยตองเพมขนตอนกำรเคลอนไหวทละภำพดวย แลวใชสมรรถนะของโปรแกรมในกำรเรยงภำพเหลำนนใหปรำกฏเหนเปนภำพเคลอนไหว เพอใชในกำรน ำเสนอ

4. ภำพเคลอนไหวแบบวดทศน (Full-Motion Video) เปนกำรน ำเสนอภำพเคลอนไหวดวยควำมเรว 30 ภำพตอวนำทดวยควำมคมชดสง (หำกให 15-24 ภำพตอวนำทจะเปนภำพคมชดต ำ)รปแบบภำพเคลอนไหวแบบวดทศนจะตองถำยภำพกอนดวยกลองวดทศน แลวจงตดตอดวยโปรแกรมสรำงภำพเคลอนไหว เชน Adobe Premiere และ Ulead Video Studio ปกตแลวไฟลภำพลกษณะนจะมขนำดใหญมำก จงตองลดขนำดไฟลใหเลกลงดวยกำรใชเทคนคกำรบบอดภำพ (Compression)รปแบบทใชในกำรบบอดทวไป ไดแก Quicktime, AVI และ MPEC 1 ใชกบแผนวซด MPEC 2 ใชกบแผนดวด และ MPEC 4 ใชในกำรประชมทำงไกลดวยวดทศน และ Streaming Media

5. เสยง (Sound) เสยงทใชในมลตมเดยไมวำจะเปนเสยงพด เสยงเพลง หรอเสยงเอฟเฟกตตำงๆ จะตองจดรปแบบเฉพำะเพอใหคอมพวเตอรสำมำรถเขำใจและใชงำนได โดยกำรบนทกลงคอมพวเตอรและแปลงเสยงจำกระบบแอนะลอกใหเปนดจทล แตเดมรปแบบเสยงทนยมใชม 2รปแบบ คอ เวฟ (WAV: Waveform) จะบนทกเสยงจรงดงเชนเสยงเพลงและเปนไฟลขนำดใหญและ มด (MIDI: Musical Instrument Digital Interface) เปนกำรสงเครำะหเสยงเพอสรำงเสยงใหม ขนมำ จงท ำใหมขนำดเลกกวำไฟลเวฟ แตคณภำพเสยงจะดอยกวำ ในปจจบนไฟลเสยงทนยมใชกน อยำงแพรหลำยอกรปแบบหนง เนองจำกเปนไฟลขนำดเลกกวำมำกคอ MP3 6. กำรปฏสมพนธ (Interactive) นบเปนคณสมบตทมควำมโดดเดนกวำสออนทผใชสำมำรถโตตอบกบสอไดดวยตนเอง และเลอกทจะเขำสสวนใดสวนหนงของกำรน ำเสนอตำมควำมพงพอใจได ทงน กำรปฏสมพนธสำมำรถเชอมตอกบองคประกอบของมลตมเดยชนดตำงๆ

Page 25: ทฤษฎีการออกแบบเว็บ

การจดการเรยนการสอนผานเวบ

การสอนผานเวบ (Web-Based Instruction) เทคโนโลยการเรยนร ส าหรบโลกไรพรมแดน

ในสงคมของยคขำวสำรดงเชนปจจบนน กำรสอสำรในรปแบบตำง ๆ ไดถกพฒนำขน เพอตอบสนองควำมตองกำรของคนเรำใหไดรบควำมสะดวก รวดเรวมำกขน อนเตอรเนตเปนเครอขำยคอมพวเตอรทมขนำดใหญทสด เกดจำกกำรเชอมตอคอมพวเตอรจำกทวทกมมโลกเขำดวยกน โดยมจดประสงคคอกำรแลกเปลยนขอมลขำวสำรรวมกน จดเรมตนของอนเตอรเนต เกดขนเมอประมำณ 20 กวำปมำแลว โดยเรมจำกเครอขำย อำรพำเนต (ARPANET) ของกระทรวงกลำโหมของสหรฐอเมรกำ ซงมจดประสงคทจะแลกเปลยนขอมลวจยทำงกำรทหำร หลงจำกนนระบบเครอขำยยอยอน ๆ จงท ำกำรเชอมตอและขยำยแวดวงออกไปทวโลก ท ำใหสำมำรถแลกเปลยนขอมลขำวสำรในรปแบบขอควำม รปภำพ วดโอ จำกคนละซกโลกไดภำยในเสยวนำท โดยทมคำใชจำยถกทสดเมอเปรยบเทยบกบกำรสอสำรประเภทอน ฉะนน ถำสำมำรถน ำเทคโนโลยน มำสนบสนนกำรเรยนกำรสอนและประยกตใชกบกำรเรยนกำรสอนในสถำนศกษำได จะท ำใหเกดกำรตดตอสอสำร อภปรำย ถกเถยงแลกเปลยน และสอบถำมขอมลขำวสำรควำมคดเหนทงกบผสนใจศกษำในสอเรองเดยวกนหรอกบผเชยวชำญในสำขำตำง ๆ กำรเรยนกำรสอนผำนเวบ (Web-Based Instruction) เปนอกหนงกระแสของกำรประยกตใชอนเตอรเนตทก ำลงมำแรง ภำยใตระบบนจะมกำรจดกำรทกอยำงใหแกผเรยนผสอน โดยทผเรยนสำมำรถเตรยมกำรเรยนลวงหนำ ทบทวนเนอหำหรอเขำมำศกษำเพมเตมเมอเกด ขอสงสย สำมำรถเลอกวชำทจะเรยน ลงทะเบยนกำรเรยน กำรช ำระคำลงทะเบยน ผเรยนสำมำรถเลอกเรยนไดแบบภำยในสถำนศกษำ หรอภำยนอกสถำนศกษำโดยผำนเครอขำยอนเตอรเนต โดยจะมกำรบนทกขอมล และมเอกสำรประกอบ ตลอดจนบรรยำกำศกำรสอนบนทกไวในระบบฐำนขอมลทงหมด จะเหนไดวำอนเตอรเนตไดกลำยเปนสอกำรศกษำของโลกยคใหม ชวยเปดโลกกวำงใหแกผเรยนและเปนแหลงรวบรวมขมทรพยทำงปญญำอยำงมหำศำล ในลกษณะทสอประเภทอนไมสำมำรถกระท ำได ผเรยนจะมควำมสะดวกตอกำรคนหำขอมล ไมวำจะอยสถำนทใดกสำมำรถเขำไปใชเครอขำยไดอยำงเทำเทยมกน ไมวำจะเปนกำรศกษำในลกษณะทเรยนรวมกนหรอเรยนตำงหองกนหรอแมกระทงตำงสถำบนกสำมำรถแลกเปลยนควำมรอยำงตอเนองไดตลอดเวลำ ทงระหวำงครกบนกเรยนและระหวำงผเรยนเอง เครอขำยคอมพวเตอรจะเปนตวเชอมใหผเรยนเขำถงผใหค ำปรกษำหรอผเชยวชำญไดโดยตรง อกทงยงเออใหเกดกำรปฏสมพนธระหวำงผเรยนและผสอนทงเวลำจรงหรอตำงเวลำกน ท ำใหเกดสภำวะแวดลอมทตองมกำรประสำนงำนกน (Collaborative environment) ผเรยนสำมำรถควบคมจงหวะกำรเรยนไดดวยตนเองท ำใหเกดสงแวดลอมยดหยนแกผเรยน

Page 26: ทฤษฎีการออกแบบเว็บ

ความหมายของการสอนผานเวบ

กำรสอนผำนเวบ (Web-Based Instruction) หมำยถง บทเรยนคอมพวเตอรชวยสอนทน ำเสนอผำนเครอขำยคอมพวเตอร โดยใชเวบเบรำเซอรเปนตวจดกำร ดงนน จงมควำมแตกตำงกบคอมพวเตอรชวยสอนธรรมดำอยบำงในสวนของกำรใชงำน ไดแก สวนของระบบกำรตดตอกบผใช (User Interfacing System) ระบบกำรน ำเสนอบทเรยน (Delivery System) ระบบกำรสบทองขอมล (Navigation System) และระบบกำรจดกำรบทเรยน (Computer Managed System) (มนตชย เทยนทอง 2545, 355)กำรสอนผำนเวบ (Web-Based Instruction) หมำยถง กำรจดกำรเรยนกำรสอนโดยใชศกยภำพของเครอขำยอนเตอรเนต ท ำใหกำรเรยนกำรสอนสำมำรถเชอมโยงไปยงแหลงขอมลตำง ๆ ทอยในเครอขำยไดทกเวลำและทกสถำนทตำมควำมตองกำรของผเรยนและผสอน นอกจำกนผเรยนและผสอนยงสำมำรถปฏสมพนธกนไดโดยผำนระบบเครอขำยคอมพวเตอร (ฤทธชย ออนมง 2546, 66)

กำรสอนผำนเวบกบคอมพวเตอรชวยสอน เปนสอกำรสอนทมลกษณะคลำยคลงกน จนผสอนบำงคนคดวำคอสงเดยวกน แตในควำมเปนจรง กำรสอนผำนเวบกบคอมพวเตอรชวยสอนมขอแตกตำงกน คอกำรสอนผำนเวบ ท ำงำนบนระบบเครอขำยอนเตอรเนต ผเรยนและผสอน สำมำรถตดตอสอสำรถงกนได และผสอนสำมำรถตดตำมพฤตกรรมกำรเรยน ตลอดจนผลกำรเรยนของผเรยนได สวนคอมพวเตอรชวยสอนท ำงำนภำยใตระบบเครองเดยว (Standalone) หรออำจท ำภำยใตเครอขำยภำยในองคกร (Local Area Network : LAN) และคอมพวเตอรชวยสอน ไมไดออกแบบเพอกำรสอสำรถงกนได

องคประกอบของการสอนผานเวบ

1.ควำมเปนระบบ โดยแบงเปน 3 สวน คอ 1.1 สวนน ำเขำ (Input) ประกอบดวย ผเรยน ผสอน วตถประสงคของกำรเรยน ฐำนควำมร กำรสอสำรหรอกจกรรม กำรวดและประเมนผล 1.2 สวนกระบวนกำร (Process) เปนกำรสรำงสถำนกำรณหรอกำรจดสภำวะกำรเรยนกำรสอน โดยใชสวนน ำเขำในกำรบรหำรจดกำร เพอใหเกดประโยชนสงสดและบรรลวตถประสงคทตงไว 1.3 สวนผลลพธ (Output) คอ ผลสมฤทธทำงกำรเรยนทไดจำกกำรวดและประเมนผล

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

Page 27: ทฤษฎีการออกแบบเว็บ

3. กำรสอสำรหรอกจกรรม ในกำรออกแบบบทเรยนผำนเวบ ผออกแบบตองมกจกรรมใหผเรยนเกดปฏสมพนธเพอน ำไปสเปำหมำยแหงกำรเรยนร เชน กำรใชบรกำร Web Chat, Web board, Searchเพอใหผเรยนสำมำรถตดตอสอสำรขอสงสย ระหวำงผเรยนกบผเรยน หรอผเรยนกบผสอนได

4. Learning Root เปนกำรก ำหนดแหลงควำมรภำยนอกทเกยวของกบบทเรยน โดยมเงอนไข เชน แหลงควำมรภำยนอก ทมควำมยำกเปนล ำดบ หรอเกยวของกบหวขอกำรเรยนเปนล ำดบ กำรก ำหนด Leaning Root โดยใชเทคนค Frame จะชวยใหผเรยนไมเกดภำวะหลงทำง

การออกแบบสรางบทเรยนผานเวบ

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

กำรออกแบบโปรแกรมทดจะตองค ำนงถง 2 สวน คอ สวนทส ำคญและสวนเพมเตม สวนทส ำคญจะอยในเวบ และเปนบทเรยน ประกอบดวย กำรโตตอบซงกนและกน กำรใชสอประสมระบบเปด กำรคนหำทเชอมโยงถงกนได เครองมอทใชไดทกแหงทกท กำรเชอมตอเครอขำยทวโลก สวนเพมเตม คอ ควำมสะดวกสบำย สำมำรถเรยนรไดดวยตนเอง ใชงำย (พรรณ เกษกมล2546, 50-51)

Page 28: ทฤษฎีการออกแบบเว็บ

วธการจดการสอนผานเวบ

วธกำรจดกำรสอนผำนเวบ สำมำรถจดในรปแบบกำรสอนแบบเขำชนเรยนและไมตองเขำชนเรยน ตำมควำมเหมำะสมของเนอหำของแตละวชำ กำรสอนผำนเวบผสอนจะตองมกำรเตรยมกำรลวงหนำ โดยเฉพำะอยำงยงกำรเตรยมควำมพรอมของตวผสอนในกำรฝกฝนทกษะทำงคอมพวเตอรและสรำงควำมคนเคยกบเครองมอตำง ๆ บนเครอขำย เพอใหกำรจดกำรเรยนกำรสอนเปนไปอยำงมประสทธภำพ เชน กำรสรำงโฮมเพจส ำหรบรำยวชำของผสอนเองทสำมำรถเชอมโยงแหลงควำมรตำง ๆ ทเหมำะสมและเปนประโยชนส ำหรบผเรยนกำรสอนบนเวบใหเกดประสทธภำพสงสดตองมกำรออกแบบบทเรยนตำมหลกกำรออกแบบและพฒนำระบบกำรสอน (Instructional design and development) เพอใหกำรสอนผำนเวบมควำมใกลเคยงกบกำรสอนในหองเรยนแบบปกตมำกทสด กำรจดกำรเรยนกำรสอนผำนเวบนนมขนตอนกำรจดกำรเรยนกำรสอน ดงน

1.ก ำหนดวตถประสงคของกำรเรยนกำรสอน

2.กำรวเครำะหผเรยน

3.กำรออกแบบเนอหำรำยวชำใชเนอหำตำมหลกสตรและสอดคลองกบควำมตองกำรของผเรยน จดล ำดบเนอหำจ ำแนกตำมหวขอ ตำมหลกกำรเรยนรและลกษณะเฉพำะในแตละหวขอ ก ำหนดระยะเวลำและตำรำงกำรศกษำในแตละหวขอ ก ำหนดวธกำรศกษำ ก ำหนดสอทใชประกอบกำรศกษำในแตละหวขอ ก ำหนดวธกำรประเมนผล ก ำหนดควำมรและทกษะพนฐำนทจ ำเปนตอกำรเรยนและสรำงประมวลรำยวชำ

4. กำรก ำหนดกจกรรมกำรเรยนกำรสอนผำนเวบ โดยใชคณสมบตของอนเตอรเนตทเหมำะสมกบกจกรรมกำรเรยนกำรสอนนน ๆ

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

6. สรำงเวบเพจเนอหำควำมรตำมหวขอของกำรเรยนกำรสอนรำยสปดำห

7. กำรเตรยมควำมพรอมใหกบผเรยน โดยกำรแจงวตถประสงคทำงกำรเรยน อธบำยเนอหำ และวธกำรเรยนกำรสอน

8. จดกำรเรยนกำรสอนตำมแบบทก ำหนดไว

Page 29: ทฤษฎีการออกแบบเว็บ

9. กำรประเมนผล โดยท ำกำรประเมนผลทงระหวำงเรยนและเมอสนสดกำรเรยน รวมทงกำรเรยน ประเมนผลผสอนและกำรประเมนผลกำรจดกำรเรยนกำรสอนทงรำยวชำ เพอน ำขอมลไปปรบปรงแกไขกำรเรยนกำรสอนใหมประสทธภำพมำกยงขนตอไป

ขอค านงในการจดการเรยนการสอนผานเวบ

กำรจดกำรเรยนกำรสอนผำนเวบ ควรค ำนงถงประเดนตำง ๆ ตอไปน

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

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

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

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

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

ดงนนกำรน ำประโยชนของอนเตอรเนตในใชในกำรพฒนำบทเรยน จงเปนกำรจดสภำพแวดลอมกำรเรยนกำรสอนทประยกตคณลกษณะของอนเตอรเนต โดยน ำทรพยำกรทมอยในเวลดไวดเวบ (World Wide Web) มำเปนสอกลำงเพอสงเสรมสนบสนนใหเกดกำรเรยนร ในรปแบบตำง ๆ ไมวำจะเปนแหลงขอมลอำงอง เอกสำรประกอบกำรเรยน บทเรยนส ำเรจรป หรอแมกระทงหลกสตรวชำ เนองจำกเวลดไวดเวบเปนบรกำรบน

Page 30: ทฤษฎีการออกแบบเว็บ

อนเตอรเนตทมแหลงขอมลอยมำกมำยและหลำยรปแบบ ทงตวอกษร ภำพนง กำรเคลอนไหวหรอเสยง โดยอำศยคณลกษณะของกำรเชอมโยงหลำยมต (Hyperlink) ทงในรปแบบของขอควำมหลำยมต (Hypertext) หรอสอหลำยมต (Hypermedia) เพอเชอมโยงแหลงขอมลทเกยวของไวดวยกน เปนกำรน ำประโยชนของเทคโนโลยสำรสนเทศ เพอกำรคนควำขอมลในกำรเรยนรดวยตนเองและสนองตอบแนวคดในกำรจดกำรเรยนกำรสอนทเนนผเรยนเปนหลก นนคอมใชกำรสอนทเปนกำรถำยทอดควำมรจำกครผสอนเพยงฝำยเดยว แตเปนกำรเรยนรของผเรยนดวยวธกำรทหลำกหลำยและเกดขนไดทกสถำนท ทกเวลำ โดยใชเทคโนโลยและสอสำรสำรสนเทศตำงๆใหเปนประโยชน ซงสอตำง ๆเหลำนสำมำรถกระตนใหผเรยนสำมำรถเรยนรและแกปญหำไดอยำงอสระ ทงนเพรำะขอมลบนเวบมลกษณะเปนพลวตร (Dynamic) ท ำใหเนอหำกำรเรยนมควำมยดหยนมำกกวำแบบเดม และเปลยนแปลงไปตำมควำมตองกำรของผเรยนเปนส ำคญและเปดโอกำสใหผสอนสำมำรถปรบปรงเนอหำหลกสตรใหทนสมยไดอยำงสะดวกสบำย

ประเภทของเวบไซต

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

1. เวบทา (Portal Site) อำจเรยกอกชอหนงวำ เวบวำไรต ซงหมำยถงเวบทใหบรกำรตำงๆ ไวมำกมำย มกประกอบไปดวยบรกำร เสรชเอนจน ทรวมลงคของเวบไซตทนำสนใจไวมำกมำยใหเรำไดคนหำ รวมถงบรกำรทเกยวกบเรองรำวทมสำระและบนเทงหลำกหลำยประเภท ดหนงฟงเพลง ดดวง ทองเทยว ไอท เกม สขภำพ ฯลฯ

2.เวบขาว (News Site) เปนเวบทสรำงขนโดยองคกรขำวหรอสถำบนสอสำร มวลชนตำงๆ ทมสอมวลชนประเภทตำงๆ ของตนอยเปนหลก เชน สถำนโทรทศน สถำนวทย หนงสอพมพ นตยสำร วรสำร หรอแมกระทง กระทรวง ทบวง กรมตำงๆ ซงผใชสำมำรถคนหำขอมลและตดตำมขำวไดทกเวลำ

3. เวบขอมล (Information Site)เปนเวบทใหบรกำรเกยวกบกำรสบคน ขอมลขำวสำร หรอขอเทจจรงตำงๆ ทนำสนใจ องคกรตำงๆ มกสรำงเวบขอมลของตนขนมำเพอเปนชองทำงใหประชำชนหรอกลมบคคลท สนใจ เขำมำศกษำคนควำขอมลทเกยวของกบองคกรของตน

Page 31: ทฤษฎีการออกแบบเว็บ

4. เวบธรกจหรอการตลาด (Business/Marketing Site) สรำงขนโดย องคกรธรกจตำง ๆ มจดประสงคในกำรประชำสมพนธองคกรและเพมผลก ำไรทำงกำรคำดวย โดยเนอหำสวนใหญหรอเกอบทงหมดมกจะเปนกำรน ำเสนอเกยวกบรำยละเอยด และควำมนำสนใจของสนคำและบรกำร

5. เวบการศกษา (Educational Site) สวนใหญสรำงขนโดยสถำบนกำรศกษำตำงๆ หรอองคกรทงของภำครฐและเอกชนทมนโยบำยในกำรเผยแพรควำมร และใหโอกำสในกำรคนควำหำขอมลเพอกำรศกษำแกนกเรยน นสต นกศกษำ รวมถงประชำชนทวไป เวบกำรศกษำใหขอมลเกยวกบกำรเรยนรทเปนทำงกำรและไมเปนทำงกำร บรกำรกำรเรยนรแบบออนไลน หรอทเรยกวำ อเลรนนง (E-Learning) ตำง ๆ

6. เวบบนเทง (Entertainment Site) เปนเวบน ำเสนอและใหบรกำรตำงๆ เพอเสรมสรำงควำมบนเทง จะเปนเรองรำวเกยวกน ดนตร ภำพยนตร ดำรำ กฬำ เกม ควำมรก บทกลอน กำรตน เรองข ำขน รวมถงบรกำรดำวนโหลดโลโกและรงโทนส ำหรบโทรศพทเคลอนทดวย

7. เวบองคกรทไมแสวงหาผลก าไร (Non-profit Organization Site) สวนใหญสรำงขนโดยบคคลหรอองคกำรตำง ๆ ทมนโยบำยในกำรสรำงและชวยเหลอสงคมโดยทไมหวงผลก ำไรหรอคำตอบแทน ซงกลมบคคลหรอองคกำรเหลำนไดแก สมำคม ชมรม มลนธ และโครงกำรตำงๆ โดยอำจจะมจดประสงคเฉพำะทแตกตำงกนเชน เพอท ำควำมด สรำงสรรคสงคม พทกษสงแวดลอม ปกปองสทธมนษยชน รณรงคไมสบบหร เปนตน

8. เวบสวนตว (Personal Site) บำงครงอำจเปนเวบของคนๆ เดยว เพอนฝง หรอครอบครวกได โดยอำจจะจดท ำขนดวยเหตผลทแตกตำงกน เชน แนะน ำตนเอง แนะน ำกลมเพอน โชวรปภำพ แสดงควำมคดเหน เขยนไดอำรประจ ำวน น ำเสนอผลงำน ถำยทอดประสบกำรณเกยวกบสงทเชยวชำญหรอสนใจ

สวนประกอบของเวบไซต

สวนประกอบทส าคญของเวบไซต มอย 3 สวนคอ

1. หนาเวบไชต (Web Page) ซงจะมกหนำขนอยกบวำเวบไซตมขอมลมำกหรอนอย ทงนสวนทเปนเนอหำ คณอำจเปนผจ ำเตรยมขนมำเอง หรออำจวำจำงใหบรษททรบออกแบบ และพฒนำเวบไซตเปนผจดท ำให หรอ ถำหำกคณคำดหวงผลดำนกำรตลำด ของเวบไซตแลว อำจวำจำงใหบรษททรบท ำกำรตลำดออนไลนเปนผจดท ำเนอหำให เพอใหเกดประสทธภำพสงสดดำนกำรตลำดบนเครอขำยอนเทอรเนตกได สงถดมำทตองค ำนงถง คอ โครงสรำงของเวบไซตไปเชนไร มควำมสอดคลอง กบ สงทลกคำของเวบไซตตองกำรทรำบแลวรยง เรองกำรออกแบบหนำตำของเวบไซต กเปนเรองทจะลมไมไดเชนกน เพรำะคงปฏเสธไมไดวำทกคน ตองกำรอำนขอมลทกระฉบ ครบถวน อำนงำย คนหำสงทตองกำรไดงำย หรอถกจดวำงไวในต ำแหนงทนำสนใจ และสดทำยทจะขำดไมได คอ คณมกำรปรบปรงเนอหำในเวบไซตบำงหรอไม เพรำะหำกลกคำทเคยเขำมำยงเวบไซต รสกไดวำไมมสงทตองกำรแลว กจะจำกไปโดยไมกลบมำอก

Page 32: ทฤษฎีการออกแบบเว็บ

2. พนทเกบเวบไชต (Web Hosting) ซงกคอ พนทจดเกบขอมลทงหมดของเวบไซตนนเอง คณอำจจะใหทำงผรบออกแบบ และพฒนำเวบไซตเปนผจดหำใหกไดถำหำกคณยงไมมควำมช ำนำญพอ เพรำะ Web Hosting นถอวำเปนสวนประกอบทส ำคญมำกของเวบไซต ซง สงผลโดยตรงถงควำมเรว ในกำรเขำถงขอมล เพรำะขดควำมสำมำรถของ Web Hosting แตละบรษทจะ มควำมแตกตำงกนไป เชน มโครงสรำงทเหมำะสมกบลกคำของเวบไซต ทสวนใหญอยในประเทศเดยวกบเครอขำยของ Web Hosting หรอ มโครงขำยระหวำงประเทศขนำดใหญ เพอรองรบลกคำของเวบไซตจำกทวโลก รวมถงรำคำทสงผลตำมประสทธภำพของ Web Hosting ดวย

3. ชอของเวบไซต หรอ ชอโดเมน (Domain Name) ซงชอเวบไซตจะตองไมซ ำกนทวโลก ดงนนกอนสรำงเวบไซต เรำจะตองมกำรตรวจสอบวำชอเวบไซตทเรำจะใช วำงอยหรอไม ถำวำงเรำจงสำมำรถจดทะเบยนขอใชชอได โดยเรำสำมำรถท ำกำรตรวจสอบชอโดเมน ไดดวยตวเอง หรอใหผทใหบรกำรออกแบบ และพฒนำเวบไซต (Website Design & Development Company) หรอผใหบรกำรเชำพนท (Web Hosting) เปนผด ำเนนกำรให

การประเมนเวบไซต

แนวการประเมนเวบไซต 1. หนำทของเวบไซต (Authority) เกยวกบหนำทของเวบทสรำงขนนนตองดวำใครหรอผใชเวบน อะไรคอควำมถกตอง เหมำะสม ชอบธรรม ระหวำงควำมสมพนธของเรอง และ กำรรบประกนคณภำพของเวบเพจนทมตอผชม 2. ควำมถกตอง (Accuracy) แหลงขอมลและขอเทจจรงทน ำมำสรำงเวบสำมำรถแยกแยะเปนประเดนรำยกำรตำงๆ สำมำรถตรวจสอบยอนหลงไดหรอไม 3. จดประสงค (Objective) จดมงหมำยในกำรสรำงชดเจนและบอกควำมสมพนธของสงทตองกำรนนชดเจน 4. ควำมเปนปจจบน (Currency) เวบเพจทสรำงขนนนตองแสดงวนททเปนปจจบนดวย เชน บอกวำสรำงเมอใด และมกำรแกไขครงหลงสดเมอใด 5. ควำมครอบคลม (Coverage) กำรสรำงเวบไซตตองใหตรงกบจดสนใจ หวเรองมควำมชดเจน เหมำะกบรปภำพ โครงเรองและเนอหำสำระวธกำรคนหำขอมลในเวบไซตชดเจน

ทมา : ชลตำ ไวรกษ. กำรพฒนำเวบไซตเพอประชำสมพนธองคกร : กรณศกษำสโมสรทำรซำน ฮท เพนท บอล เชยงใหม. วทยำนพนธศลปศำสตรมหำบณฑต. มหำวทยำลยเชยงใหม , กนยำยน 2551. ทมา : เตมโชค มำนตสกล. กำรพฒนำเวบไซต; พำณชยอเลกทรอนกส; เวบไซต -- กำรออกแบบ. วทยำนพนธศลปศำสตรมหำบณฑต.มหำวทยำลยเชยงใหม , 2554