ระบบขายสินคา้ ออนไลนป์ ระเภทร้านขายเส้ือผา้ เดก็ E-commerce for Baby Kits Shopจดั ทาโดยนายนวพล คลา้ ยสาหร่ายนายสุทธิรักษ์ สนธ์ิสาราญโครงการน้ีเป็ นส่วนหน่ึงของการศึกษาตามหลกั สูตรประกาศนียบตั รวชิ าชีพช้นั สูง สาขาวชิ าคอมพิวเตอร์ธุรกิจ วทิ ยาลยั เทคโนโลยอี รรถวทิ ยพ์ ณิชยการ ปี การศึกษา 2559
บทคดั ย่อหวั ขอ้ โครงการ ระบบการขายของออนไลน์ ร้านขายเส้ือผา้ เดก็ ( Baby Kits Shop )ผจู้ ดั ทาโครงการ นายนวพล คลา้ ยสาหร่าย นายสุทธิรักษ์ สนธ์ิสาราญอาจารยท์ ่ีปรึกษา อาจารยฐ์ ิติรัตน์ นยั พฒั น์อาจารยท์ ี่ปรึกษาร่วม อาจารยศ์ ิริพร สงบภยัสาขาวชิ า สาขาวชิ าคอมพวิ เตอร์ธุรกิจสถาบนั วทิ ยาลยั เทคโนโลยอี รรถวทิ ยพ์ ณิชยการ ปี การศึกษา 2559---------------------------------------------------------------------------------------------------------------------- บทคัดย่อ ในการจดั ทาโครงการเล่มน้ีได้จัดทาข้ึนเกี่ยวกับเว็บไซต์เพ่ือพฒั นาการขาย เพื่อทาการทดสอบทางดา้ นธุรกิจออนไลน์ เพื่อให้สาหรับนกั ศึกษาที่กาลงั จะจบการศึกษาจบใหม่หรือศึกษาไปดว้ ยทางานไปดว้ ยมีรายไดเ้ สริมในดา้ นการขายของแบบออนไลน์นอกจากน้ันทางเว็บไซต์ได้มีการเก็บขอ้ มูลของผูท้ ่ีเข้ามาใช้งานเพ่ือผูใ้ ช้งานจะได้เป็ นสมาชิกสามารถยนื ยนั บุคคลได้ โครงการเล่มน้ีมีการรวบรวมการขายเส้ือผา้ เด็กและนามาพฒั นาเป็ นเว็บไซต์ขายของออนไลนแ์ ละเป็นสื่อการติดต่อสื่อสารได้
บทที่ 1 บทนำ1.1 ภูมหิ ลงั และควำมเป็ นมำ เน่ืองจากปัจจุบนั มีความกา้ วหนา้ ทางดา้ นเทคโนโลยีไปไกลมากท้งั ดา้ น การคมนาคม และดา้ นการติดต่อสื่อสาร Internet จึงเขา้ มามีส่วนสาคญั ในการดารงชีวิตชีวิตประจาวนั ไม่วา่ จะเป็ นการติดตอ่ ธุรกิจ Social Network รวมไปถึงการติดต่อซ้ือขายสินคา้ ผา่ นเวบ็ ไซตต์ า่ ง ๆ การซ้ือขายในปัจจุบนั ผูซ้ ้ือบางกลุ่มมีความตอ้ งการสินคา้ ท่ีหาได้ยาก จึงยากต่อการซ้ือสินคา้ และ สินคา้ บางชนิดกเ็ ป็นสินคา้ ที่ยงั ไมไ่ ดร้ ับความนิยมทางสังคมมากนกั จึงทาใหก้ ารซ้ือขายทางทอ้ งตลาด หรือตลาดทว่ั ๆ ไปน้นั หาไดย้ าก หรือในกรณีสินคา้ ที่ตอ้ งการอย่ไู กล จึงทาให้ผซู้ ้ือซ้ือสินคา้ ไดล้ าบาก เน่ืองจากระยะที่ไกลหรือสภาพการคมนาคมท่ีย่าแย่ จึงทาให้การซ้ือขายผา่ นเวบ็ ไซตอ์ อนไลนเ์ ขา้ มามีบทบาทในสงั คมอยา่ งมากและไดร้ ับความนิยมมากเช่นกนั จากท่ีกล่าวมาเบ้ืองตน้ ผจู้ ดั ทาไดเ้ ล็งเห็นความสาคญั ของระบบ E-commerce ท่ีเขา้ มาช่วยในการขายสินคา้ และ อานวยความสะดวกในดา้ นขอ้ มูลการขายรวมท้งั ขอ้ มูลทางดา้ นการตดั สินใจรวมท้งั ไดม้ ีระบบการขายท่ีมีมาตรฐานเดียวกนั ท้งั หมดโดยการจดั ระบบ E-commerce เพ่ือเป็ นช่องทางการขายสินคา้ อีกช่องทางหน่ึงซ่ึงจะช่วยเพิม่ ความสะดวกสบายใหก้ บั ลูกคา้1.2 วตั ถุประสงค์โครงกำร 1. เพ่ือสร้างเว็บไซต์เก่ียวกับขายสินค้าผ่านเว็บไซต์ขาย สินค้า และ อุปกรณ์ต่าง ๆ สาหรับเด็ก 2. เพือ่ ใหผ้ ทู้ ี่สนใจสามารถเขา้ เยย่ี มชม สินคา้ และ สงั่ ซ้ือ สินคา้ ผา่ นระบบอินเทอร์เน็ต 3. เพื่อศึกษาข้นั ตอนการพฒั นาระบบขายสินคา้ ออนไลนอ์ ยา่ งถูกตอ้ ง1.3 ขอบเขตกำรศึกษำ 1. สามารถ เพ่ิม ลบ แกไ้ ข รายการสินคา้ ได้ 2. สามารถคานวณราคาสินคา้ ตามรายการท่ีลูกคา้ สั่งได้ 3. สามารถแกไ้ ขขอ้ มูลส่วนตวั ของสมาชิกได้ 4. สามารถ Login เขา้ สู่หนา้ สมาชิกได้1.4 ประโยชน์ทคี่ ำดว่ำจะได้รับ 1. สามารถนาไปเป็นเวบ็ ไซตข์ าย สินคา้ และอุปกรณ์ต่าง ๆ สาหรับเด็กไดจ้ ริง 2. ผทู้ ี่สนใจสามารถเขา้ ชมสินคา้ ผา่ นทางอินเทอร์เน็ตและสง่ั ซ้ือสินคา้ ออนไลนไ์ ด้ 3. จดั ทาเวบ็ ไซตส์ าหรับขายสินคา้ ออนไลนไ์ ดอ้ ยา่ งมีประสิทธิภาพ
1.5 แผนกำรดำเนินงำน (Gantt chart) รำยกำร มถิ ุนำยน 59 กรกฎำคม 59 สิงหำคม 59 กนั ยำยน 59 ระยะเวลำเสนอหวั ขอ้ 1234 1234 1234 1234โครงการ รอบท่ี 1(บทที่1) พฤศจิกำยน 59 ธนั วำคม 59 มกรำคม 60 20-23 มิถุนายน 59ประกาศผลหวั ขอ้โครงการ รอบที่ 1 1234 1234 1234 27 มิถุนายน 59เสนอหวั ขอ้โครงการ รอบที่ 2 28-29 มิถุนายน 59(บทที่1)ประกาศผลหวั ขอ้ 4 กรกฎาคม 59โครงการ รอบท่ี 2 11-23 กรกฎาคม 59ส่งบทที่ 2 26 ก.ค. – 20 ส.ค. 59ส่งบทท่ี 3สอบหวั ขอ้ 3 กนั ยายน 59โครงการส่งความคืบหนา้ 12-16 กนั ยายน 5970%ส่งความคืบหนา้ 19-30 กนั ยายน 5980% กมุ ภำพนั ธ์ 60 หมำยเหตุ รำยกำร 1234 1-3 พฤศจิกายน 59ส่งความคืบหนา้ เป็นตน้ ไป100%สอบโปรแกรม 4 และ 12ระดบั ปวช3/ปวส2 พฤศจิกายน 2559ส่งบทที่ 4 6-16 ธนั วาคม 59 16-20 มกราคม 60ส่งบทที่ 5ส่งรูปเล่ม ซีดี และ 24 มกราคม –ค่าเขา้ เล่ม 14 กุมภาพนั ธ์ 2560 ตำรำงที่ 1.1 แผนการดาเนินงาน (Gantt chart) 65
1.6 เครื่องมือทใ่ี ช้ 1. โปรแกรม Adobe Dreamweaver CS6 ใชใ้ นการสร้างเวบ็ ไซต์ 2. โปรแกรม Adobe Photoshop CS6 ในเพ่อื สร้างภาพ Logo ป่ ุม แบนเนอร์ของเวบ็ ไซต์ 3. โปรแกรม AppServ ใชใ้ นการอ่านไฟล์ PHP1.7 งบประมำณกำรดำเนินงำนลำดบั รำยกำร จำนวน รำคำ 1 ค่ากระดาษ /รีม 150 บาท 2 คา่ เครื่องปริ้น - 2400 บาท 3 แผน่ ซีดี 12 แผน่ 120 บาท 4 ค่าเขา้ เล่ม /คร้ัง 300 บาท 2,970 บำท รวมเป็ นเงินตำรำงท่ี 1.2 งบประมาณการดาเนินงาน 66
บทท2ี่ ระบบงำนและทฤษฏที ่ีเกยี่ วข้อง2.1 ระบบงำนในปัจจุบัน Index Home Login N Y N Y รูปท่ี 2.1 Flow chart ระบบงานปัจจุบนั 67
รูปแบบการส่ังซ้ือสินคา้ ออนไลน์ ซ่ึงการสั่งซ้ือผา่ นทางระบบอินเทอร์เน็ต การเลือกซ้ือสินคา้ ทางอินเทอร์เน็ตน้นั กเ็ ป็นส่วนหน่ึงในชีวติ ประจาวนั ของคนส่วนใหญ่ มนุษยส์ มยั น้ีส่วนมากตอ้ งไดใ้ ชค้ อมพิวเตอร์เวบ็ ไซต์ ต่าง ๆ การส่ังซ้ือสินคา้ ออนไลน์ก็เป็ นส่วนหน่ึง อีกดงั ในปัจจุบนั จะเห็นไดว้ ่ามีคุณแม่มือใหม่ที่มีอตั ราท่ีเพ่ิมมากข้ึน สินคา้ และอุปกรณ์ที่เกี่ยวขอ้ งกบั เจา้ ตวั เล็ก และอุปกรณ์เสริมอ่ืน ๆ จึงมีการพฒั นาเทคโนโลยีต่าง ๆ ระบบอินเทอร์เน็ตก็มีส่วนสาคญั อยา่ งมาก ไม่วา่ จะติดตอ่ ส่ือสาร การทางานผา่ นระบบอินเทอร์เน็ต การเรียนการสอน อื่น ๆ และการส่ังซ้ือสินคา้ออนไลน์บนระบบอินเทอร์เน็ตก็เป็ นหน่ึงในการใชบ้ ริการ การส่ังซ้ือสินคา้ ท่ีสะดวกสบายของคนส่วนใหญ่ และการสง่ั ซ้ือสินคา้ ออนไลน์ก็มีขอ้ ดี เช่น สินคา้ หรืออุปกรณ์บางชนิดเป็ นของนาเขา้ ไม่มีขายในประเทศและการสั่งซ้ือสินคา้ ออนไลน์จะช่วยลดภาระค่าใชจ้ ่ายในการเดินทางเพ่ือความสะดวกสบายแก่ผบู้ ิโภค และเราน้นั อาจเป็นทางเลือกหน่ึงของเวบ็ ไซตข์ ายสินคา้ อุปกรณ์ท่ีเก่ียวขอ้ งกบั เคร่ืองดนตรี จากที่กล่าวมาขา้ งตน้ คณะผจู้ ดั ทาจึงสนใจท่ีจะจดั ทาเวบ็ ไซตป์ ระเภท E-Commerceท่ีขายสินคา้ ออนไลน์เกี่ยวกบั เส้ือผา้ เด็ก และ อุปกรณืของใชต้ ่าง ๆ เพ่ือให้มีความสะดวกสบายในการสง่ั ซ้ือสินคา้ ออนไลน์2.2 ปัญหำทเ่ี กดิ ขึน้ ในระบบงำนปัจจุบัน การส่งั สินคา้ ออนไลน์ระบบอินเตอร์เน็ตในปัจจุบนั ยงั มีขอ้ เสียดงั น้ี1. ความน่าเช่ือถือของเวบ็ ไซตข์ ายสินคา้ ออนไลน์2. การออกแบบหนา้ เวบ็ เพจยงั ไม่น่าสนใจ3. ระบบการสงั่ ซ้ือที่ทาใหส้ บั สนตอ่ ผทู้ ี่สนสัง่ ซ้ือ2.3 ทฤษฏที เี่ กย่ี วข้อง การออกแบบเก่ียวขอ้ งกบั เวบ็ ไซต์เวบ็ ไซตเ์ ป็นสื่อท่ีไดร้ ับความนิยมอยา่ งมากบนอินเตอร์เน็ต ซ่ึงเวบ็ ไซตเ์ ป็ นส่ือท่ีอยใู่ นความควบคุมของผูใ้ ช้โดยสมบูรณ์ กล่าวคือ ผูใ้ ช้สามารถตดั สินใจเลือกไดว้ ่าจะดูเว็บไซต์ใดและจะไม่เลือกดูเว็บไซต์ใด ได้ตามต้องการ จึงทาให้ผูใ้ ช้ไม่มีความอดทนต่ออุปสรรคและปัญหาที่เกิดจากการออกแบบเวบ็ ไซตผ์ ดิ พลาดถา้ ผใู้ ชเ้ ห็นวา่ เวบ็ ที่กาลงั ดูอยนู่ ้นั ไมม่ ีประโยชน์ตอ่ ตวั เขา หรือไม่เขา้ ใจวา่เวบ็ ไซตน์ ้ีจะใชง้ านอยา่ งไร เขากส็ ามารถที่จะเปลี่ยนไปดูเวบ็ ไซตอ์ ื่นๆ ไดอ้ ยา่ งรวดเร็ว เน่ืองจากในปัจจุบนั มีเวบ็ ไซตอ์ ยมู่ ากมาย และยงั มีเวบ็ ไซดท์ ่ีเกิดข้ึนใหม่ ๆ ทุกวนั ผใู้ ชจ้ ึงมีทางเลือกมากข้ึน และสามารถเปรียบเทียบคุณภาพของเวบ็ ไซดต์ ่าง ๆ ไดเ้ องเวบ็ ไซดท์ ี่ไดร้ ับการออกแบบอยา่ งสวยงาม มีการใช้งานท่ีสะดวก ย่อมได้รับความสนใจจากผูใ้ ช้ มากกว่าเว็บไซด์ที่ดูสับสนวุ่นวาย มีข้อมูลมากมายแต่หาอะไรไม่เจอ นอกจากน้ียงั ใชเ้ วลาในการแสดงผลแต่ละหนา้ นานเกินไป ซ่ึงปัญหา 68
เหล่าน้ีล้วนเป็ นผลมาจากการออกแบบเว็บไซด์ไม่ดีท้งั สิ้นดังน้ัน การออกแบบเว็บไซด์จึงเป็ นกระบวนการสาคญั ในการสร้างเวบ็ ไซด์ ใหป้ ระทบั ใจผใู้ ช้ ทาใหเ้ ขาอยากกลบั เขา้ มาเวบ็ ไซดเ์ ดิมอีกในอนาคต ซ่ึงนอกจากตอ้ งพฒั นาเวบ็ ไซด์ที่ดีมีประโยชน์แล้ว ยงั ตอ้ งคานึงถึงการแข่งขนั กบั เวบ็ไซดอ์ ื่น ๆ อีกดว้ ยองค์ประกอบของกำรออกแบบเวบ็ ไซต์ การออกแบบเวบ็ ไซตท์ ่ีมีประสิทธิภาพน้นั ตอ้ งคานึงถึง องคป์ ระกอบสาคญั ดงั ต่อไปน้ี 1. ความเรียบง่าย (Simplicity)หมายถึง การจากดั องค์ประกอบเสริมให้เหลือเฉพาะองค์ประกอบหลกั กล่าวคือในการส่ือสารเน้ือหากบั ผูใ้ ช้น้ัน เราตอ้ งเลือกเสนอสิ่งที่เราตอ้ งการนาเสนอจริง ๆ ออกมาในส่วนของกราฟิ กสีสัน ตวั อกั ษรและภาพเคลื่อนไหว ตอ้ งเลือกให้พอเหมาะ ถา้ หากมีมากเกินไปจะรบกวนสายตาและสร้างความคาราญต่อผูใ้ ช้ตวั อยา่ งเวบ็ ไซต์ท่ีไดร้ ับการออกแบบที่ดี ไดแ้ ก่ เวบ็ ไซต์ของบริษทัใหญ่ ๆ อย่างเช่น Apple Adobe Microsoft ท่ีมีการออกแบบเว็บไซต์ในรูปแบบท่ีเรียบง่าย ไม่ซบั ซอ้ น และใชง้ านอยา่ งสะดวก 2. ความสม่าเสมอ ( Consistency) หมายถึง การสร้างความสม่าเสมอให้เกิดข้ึนตลอดท้งั เวบ็ ไซต์ โดยอาจเลือกใช้รูปแบบเดียวกนั ตลอดท้งั เว็บไซต์ก็ได้ เพราะถ้าหากว่าแต่ละหน้าในเว็บไซต์น้นั มีความแตกต่างกนั มากจนเกินไปอาจทาให้ผู้ใช้เกิดความสับสนและไม่แน่ใจว่ากาลังอยู่ในเว็บไซต์เดิมหรื อไม่เพราะฉะน้ันการออกแบบเวบ็ ไซต์ในแต่ละหน้าควรที่จะมีรูปแบบ สไตล์ของกราฟิ ก ระบบเนวิเกชนั่ (Navigation) และโทนสีที่มีความคลา้ ยคลึงกนั ตลอดท้งั เวบ็ ไซต์ 3. ความเป็นเอกลกั ษณ์ (Identity) ในการออกแบบเวบ็ ไซต์ตอ้ งคานึงถึงลกั ษณะขององค์กรเป็ นหลกั เน่ืองจากเว็บไซต์จะสะทอ้ นถึงเอกลกั ษณ์และลกั ษณะขององคก์ ร การเลือกใช้ตวั อกั ษร ชุดสี รูปภาพหรือกราฟิ ก จะมีผลตอ่ รูปแบบของเวบ็ ไซตเ์ ป็นอยา่ งมาก ตวั อยา่ งเช่น ถา้ เราตอ้ งออกแบบเวบ็ ไซตข์ องธนาคารแต่เรากลบั เลือกสีสันและกราฟิ กมากมาย อาจทาใหผ้ ใู้ ชค้ ิดวา่ เป็นเวบ็ ไซตข์ องสวนสนุกซ่ึงส่งผลต่อความเชื่อถือขององคก์ รได้ 4. เน้ือหา (Useful Content) ถือเป็ นส่ิงสาคญั ที่สุดในเว็บไซต์ เน้ือหาในเวบ็ ไซต์ตอ้ งสมบูรณ์และได้รับการปรับปรุงพฒั นาให้ทันสมยั อยู่เสมอ ผูพ้ ฒั นาตอ้ งเตรียมข้อมูลและเน้ือหาท่ีผูใ้ ช้ตอ้ งการให้ถูกต้องและสมบูรณ์ เน้ือหาที่สาคญั ที่สุดคือเน้ือหาท่ีทีมผพู้ ฒั นาสร้างสรรคข์ ้ึนมาเอง และไม่ไปซ้ากบั เวบ็ อื่นเพราะจะถือเป็นสิ่งท่ีดึงดูดผใู้ ชใ้ หเ้ ขา้ มาเวบ็ ไซตไ์ ดเ้ สมอ แตถ่ า้ เป็นเวบ็ ที่ลิงคข์ อ้ มูลจากเวบ็ อ่ืน ๆ มาเม่ือใดกต็ ามที่ผใู้ ชท้ ราบวา่ ขอ้ มูลน้นั มาจากเวบ็ ใด ผใู้ ชก้ ็ไม่จาเป็นตอ้ งกลบั มาใชง้ านลิงคเ์ หล่าน้นั 69
5. ระบบเนวเิ กชนั่ (User-Friendly Navigation) เป็ นส่วนประกอบที่มีความสาคญั ต่อเวบ็ ไซตม์ าก เพราะจะช่วยไม่ให้ผใู้ ชเ้ กิดความสับสนระหว่างดูเวบ็ ไซต์ ระบบเนวิเกชนั่ จึงเปรียบเสมือนป้ ายบอกทาง ดงั น้นั การออกแบบเนวิเกชนั่ จึงควรใหเ้ ขา้ ใจง่าย ใชง้ านไดส้ ะดวก ถา้ มีการใชก้ ราฟิ กก็ควรสื่อความหมาย ตาแหน่งของการวางเนวิเกชนั่ ก็ควรวางใหส้ ม่าเสมอ เช่น อยตู่ าแหน่งบนสุดของทุกหนา้ เป็ นตน้ ซ่ึงถา้ จะใหด้ ีเมื่อมีเนวเิ กชนั่ท่ีเป็ นกราฟิ กก็ควรเพ่ิมระบบเนวิเกชน่ั ท่ีเป็ นตวั อกั ษรไวส้ ่วนล่างดว้ ย เพื่อช่วยอานวยความสะดวกใหก้ บั ผใู้ ชท้ ่ียกเลิกการแสดงผลภาพกราฟิ กบนเวบ็ เบราเซอร์ 6. คุณภาพของส่ิงท่ีปรากฏใหเ้ ห็นในเวบ็ ไซต์ (Visual Appeal) ลกั ษณะท่ีน่าสนใจของเวบ็ ไซต์น้นั ข้ึนอยกู่ บั ความชอบส่วนบุคคลเป็ นสาคญั แต่โดยรวมแลว้ ก็สามารถสรุปไดว้ า่ เวบ็ ไซตท์ ่ีน่าสนใจน้นั ส่วนประกอบต่าง ๆ ควรมีคุณภาพ เช่น กราฟิ กควรสมบูรณ์ไม่มีรอยหรือขอบข้นั บนั ไดใ้ ห้เห็น ชนิดตวั อกั ษรอ่านง่ายสบายตา มีการเลือกใช้โทนสีท่ีเขา้ กนั อยา่ งสวยงาม เป็นตน้ 7. ความสะดวกของการใชใ้ นสภาพตา่ ง ๆ (Compatibility) การใช้งานของเว็บไซต์น้ันไม่ควรมีขอบจากัด กล่าวคือ ต้องสามารถใช้งานได้ดีในสภาพแวดล้อมที่หลากหลาย ไม่มีการบังคับให้ผู้ใช้ต้องติดต้ังโปรแกรมอื่นใดเพ่ิมเติมนอกเหนือจากเว็บบราวเซอร์ ควรเป็ นเว็บที่แสดงผลได้ดีในทุกระบบปฏิบตั ิการ สามารถแสดงผลได้ในทุกความละเอียดหน้าจอ ซ่ึงหากเป็ นเว็บไซต์ที่มีผูใ้ ช้บริการมากและกลุ่มเป้ าหมายหลากหลายควรใหค้ วามสาคญั กบั เร่ืองน้ีใหม้ าก 8. ความคงท่ีในการออกแบบ (Design Stability) ถา้ ตอ้ งการใหผ้ ใู้ ชง้ านรู้สึกวา่ เวบ็ ไซตม์ ีคุณภาพ ถูกตอ้ ง และเช่ือถือได้ ควรให้ความสาคญักบั การออกแบบเวบ็ ไซตเ์ ป็นอยา่ งมาก ตอ้ งออกแบบวางแผนและเรียบเรียงเน้ือหาอยา่ งรอบคอบ ถา้เวบ็ ที่จดั ทาข้ึนอยา่ งลวก ๆ ไม่มีมาตรฐานการออกแบบและระบบการจดั การขอ้ มูล ถา้ มีปัญหามากข้ึนอาจส่งผลใหเ้ กิดปัญหาและทาใหผ้ ใู้ ชห้ มดความเช่ือถือ 9. ความคงที่ของการทางาน (Function Stability) ระบบการทางานต่าง ๆ ในเวบ็ ไซตค์ วรมีความถูกตอ้ งแน่นอน ซ่ึงตอ้ งไดร้ ับการออกแบบสร้างสรรคแ์ ละตรวจสอบอยเู่ สมอ ตวั อยา่ งเช่น ลิงคต์ ่าง ๆ ในเวบ็ ไซต์ ตอ้ งตรวจสอบวา่ ยงั สามารถลิงคข์ อ้ มูลไดถ้ ูกตอ้ งหรือไม่ เพราะเวบ็ ไซตอ์ ื่นอาจมีการเปล่ียนแปลงไดต้ ลอดเวลา ปัญหาที่เกิดจากลิงค์ ก็คือ ลิงคข์ าด ซ่ึงพบไดบ้ ่อยเป็นปัญหาท่ีสร้างความราคาญกบั ผใู้ ชเ้ ป็นอยา่ งมากกำรออกแบบเวบ็ ไซต์ 70
ในการออกแบบเวบ็ ไซต์น้นั ประกอบดว้ ยกระบวนการต่าง ๆ มากมาย เช่น การออกแบบโครงสร้าง ลกั ษณะหน้าตา หรือการเขียนโปรแกรม แต่มีหลายคนที่พฒั นาเว็บไซต์ โดยขาดการวางแผนและทางานไมเ่ ป็นระบบ ตวั อยา่ งเช่น การลงมือออกแบบโดยการใชโ้ ปรแกรมช่วยสร้างเวบ็เน้ือหาและรูปแบบก็เป็ นไปตามที่นึกข้ึนไดข้ ณะน้นั และเม่ือเห็นว่าดูดีแลว้ ก็เปิ ดตวั เลย ทาให้เวบ็น้นั มีเป้ าหมายและแนวทางที่ไม่แน่นอน ผลลพั ธ์ที่ไดจ้ ึงเสี่ยงกบั ความลม้ เหลวค่อนขา้ งมากความล้มเหลวท่ีพบเห็นได้ท่ัวไป ได้แก่ เว็บท่ีแสดงข้อความว่าอยู่ระหว่างการก่อสร้าง (UnderConstruction หรือ Coming soon) ซ่ึงแสดงใหเ้ ห็นถึงการขาดการวางแผนที่ดีบางเวบ็ ถือไดว้ า่ ตายไปแลว้ เน่ืองจากขอ้ มลู ไม่ทนั สมยั ขาดการพฒั นาปรับปรุงเทคโนโลยีลา้ สมยั ลิงคผ์ ิดพลาด สิ่งเหล่าน้ีแสดงให้เห็นถึงการขาดการดูแล ตรวจสอบและพฒั นาให้ทนั สมยั อยู่เสมอการออกแบบเวบ็ ไซต์อย่างถูกตอ้ งจะช่วยลดความผิดพลาดเหล่าน้ี และช่วยลดความเส่ียงท่ีจะทาให้เว็บประสบความล้มเหลว การออกแบบเว็บไซต์ที่ดีต้องอาศัยการออกแบบและจัดระบบข้อมูลอย่างเหมาะสมกระบวนการแรกของการออกแบบเวบ็ ไซตค์ ือการกาหนดเป้ าหมายของเวบ็ ไซตก์ าหนดกลุ่มผูใ้ ช้ซ่ึงการจะใหไ้ ดม้ าซ่ึงขอ้ มูล ผูพ้ ฒั นาตอ้ งเรียนรู้ผใู้ ช้ หรือจาลองสถานการณ์ ส่ิงเหล่าน้ีจะช่วยใหเ้ ราสามารถออกแบบเน้ือหาและการใช้งานเวบ็ ไซต์ไดอ้ ย่างเหมาะสม ตรงกบั ความตอ้ งการของผใู้ ช้อยา่ งแทจ้ ริงกำหนดเป้ ำหมำยของเวบ็ ไซต์ ข้นั ตอนแรกของการออกแบบเว็บไซต์ คือการกาหนดเป้ าหมายของเว็บไซต์ให้แน่ชัดเสียก่อน เพื่อจะไดอ้ อกแบบการใช้งานไดต้ รงกบั เป้ าหมายท่ีไดต้ ้งั เอาไว้ โดยทว่ั ไปมกั จะเขา้ ใจว่าการทาเวบ็ ไซตม์ ีจุดมุ่งหมายเพ่ือบริการขอ้ มูลของหน่วยงานหรือองคก์ รเท่าน้นั แต่ในความเป็ นจริงแลว้ เวบ็ ไซตแ์ ตล่ ะแห่งก็จะมีเป้ าหมายของตนเองแตกตา่ งกนั ออกไปกำหนดกล่มุ ผู้ใช้เป้ ำหมำย ผอู้ อกแบบเวบ็ ไซตจ์ าเป็ นตอ้ งทราบกลุ่มผูใ้ ชเ้ ป้ าหมายที่เขา้ มาใชบ้ ริการเวบ็ ไซต์ เพ่ือที่จะไดต้ อบสนองความตอ้ งการของผูใ้ ช้ไดอ้ ยา่ งชดั เจน ตวั อย่างเช่นเวบ็ ไซตท์ ี่มีกลุ่มผูใ้ ชห้ ลากหลายเช่น เซิร์ชเอ็นจิน เวบ็ ท่า และเวบ็ ไดเรกทอรี่ แต่เวบ็ ไซต์ส่วนใหญ่น้นั จะตอบสนองความตอ้ งการเฉพาะกลุ่มเท่าน้ัน ไม่สาหรับทุกคน เพราะคุณไม่สามารถตอบสนองความตอ้ งการของคนท่ีหลากหลายไดใ้ นเวบ็ ไซตเ์ ดียวออกแบบหน้ำเวบ็ ไซต์ (Page Design) หน้าเวบ็ เป็ นสิ่งแรกท่ีผใู้ ชจ้ ะไดเ้ ห็นขณะท่ีเปิ ดเขา้ สู่เวบ็ ไซต์ และยงั เป็ นสิ่งแรกท่ีแสดงถึงประสิทธิภาพในการออกแบบเวบ็ ไซตอ์ ีกดว้ ย หนา้ เวบ็ จึงเป็ นสิ่งสาคญั มาก เพราะเป็ นสื่อกลางให้ผูช้ มสามารถใช้ประโยชน์จากข้อมูลของระบบงานของเว็บไซต์น้ันได้ โดยปกติหน้าเว็บจะ 71
ประกอบดว้ ย รูปภาพ ตวั อกั ษร สีพ้ืน ระบบเนวิเกชนั่ และองคป์ ระกอบอ่ืน ๆ ท่ีช่วยส่ือความหมายของเน้ือหาและอานวยความสะดวกตอ่ การใชง้ านหลกั สาคญั ในการออกแบบหน้าเว็บก็คือ การใช้รูปภาพและองคป์ ระกอบต่าง ๆ ร่วมกนั เพื่อสื่อความหมาย เกี่ยวกับเน้ือหาหรือลักษณะสาคัญของเว็บไซต์ โดยมีเป้ าหมายสาคัญเพื่อการสื่อความหมายที่ชดั เจนและน่าสนใจ บนพ้ืนฐานของความเรียบง่ายและความสะดวกของผใู้ ช้กำรออกแบบเวบ็ ไซต์ ต้องคำนึงถงึ 1. ความเรียบง่าย ไดแ้ ก่ มีรูปแบบที่เรียบง่าย ไม่ซบั ซ้อน และใชง้ านไดส้ ะดวก ไม่มีกราฟิ กหรือตวั อกั ษรที่เคลื่อนไหวอยตู่ ลอดเวลา ชนิดและสีของตวั อกั ษรไม่มากจนเกินไปทาใหว้ นุ่ วาย 2. ความสม่าเสมอ ไดแ้ ก่ ใชร้ ูปแบบเดียวกนั ตลอดท้งั เวบ็ ไซต์ เช่น รูปแบบของหนา้ สไตล์ของกราฟิ ก ระบบเนวเิ กชนั และโทนสี ควรมีความคลา้ ยคลึงกนั ตลอดท้งั เวบ็ ไซต์ 3. ความเป็ นเอกลักษณ์ การออกแบบเว็บไซต์ควรคานึงถึงลักษณะขององค์กร เพราะรูปแบบของเวบ็ ไซตจ์ ะสะทอ้ นถึงเอกลกั ษณ์และลกั ษณะขององคก์ รน้นั ๆ เช่น ถา้ เป็ นเวบ็ ไซตข์ องทาง ราชการ จะตอ้ งดูน่าเช่ือถือไม่เหมือนสวนสนุก ฯลฯ 4. เน้ือหาท่ีมีประโยชน์ เน้ือหาเป็ นสิ่งท่ีสาคญั ท่ีสุดในเวบ็ ไซต์ ดงั น้นั ควรจดั เตรียมเน้ือหาและขอ้ มูลท่ีผูใ้ ช้ตอ้ งการให้ถูกตอ้ ง และสมบูรณ์ มีการปรับปรุงและเพ่ิมเติมให้ทนั เหตุการณ์อยู่เสมอ เน้ือหาไม่ควรซ้ากบั เวบ็ ไซตอ์ ่ืน จึงจะดึงดูดความสนใจ 5. ระบบเนวเิ กชนั ท่ีใชง้ านง่าย ตอ้ งออกแบบใหผ้ ใู้ ชเ้ ขา้ ใจง่ายและใชง้ านสะดวก ใชก้ ราฟิ กท่ีสื่อความหมายร่วมกบั คาอธิบายท่ีชดั เจน มีรูปแบบและลาดบั ของรายการท่ีสม่าเสมอ เช่น วางไว้ตาแหน่งเดียวกนั ของทุกหนา้ 6. ลักษณะที่น่าสนใจ หน้าตาของเว็บไซต์จะต้องมีความสัมพันธ์กับคุณภาพขององค์ประกอบต่างๆ เช่น คุณภาพของกราฟิ กที่จะตอ้ งสมบูรณ์ การใชส้ ี การใช้ตวั อกั ษรที่อ่านง่ายสบายตา การใชโ้ ทนสีที่เขา้ กนั ลกั ษณะหนา้ ตาที่น่าสนใจน้นั ข้ึนอยกู่ บั ความชอบของแต่ละบุคคล 7. การใช้งานอย่างไม่จากดั ผูใ้ ช้ส่วนใหญ่สามารถเขา้ ถึงได้มากที่สุดเลือกใช้บราวเซอร์ชนิดใดก็ไดใ้ นการเขา้ ถึงเน้ือหาสามารถแสดงผลไดท้ ุกระบบปฏิบตั ิการและความละเอียดหนา้ จอตา่ ง ๆ กนั อยา่ งไมม่ ีปัญหาเป็นลกั ษณะสาคญั สาหรับผใู้ ชท้ ่ีมีจานวนมาก 8. คุณภาพในการออกแบบ การออกแบบและเรียบเรียงเน้ือหาอย่างรอบคอบ สร้างความรู้สึกวา่ เวบ็ ไซตม์ ี….คุณภาพ ถูกตอ้ ง และเชื่อถือได้ 9. ลิงค์ต่างๆ จะตอ้ งเชื่อมโยงไปหน้าที่มีอยู่จริงและถูกตอ้ ง ระบบการทางานต่าง ๆ ในเวบ็ ไซตจ์ ะตอ้ งมีความแน่นอนและทาหนา้ ท่ีไดอ้ ยา่ งถูก 72
กำรออกแบบโครงสร้ำงเวบ็ ไซต์ (Site Structure Design) โครงสร้างเวบ็ ไซท์ ( Site Structure ) เป็ นแผนผงั ของการลาดบั เน้ือหาหรือการจดั วางตาแหน่งเวบ็ เพจท้งั หมด ซ่ึงจะทาใหเ้ รารู้วา่ ท้งั เวบ็ ไซทป์ ระกอบไปดว้ ยเน้ือหาอะไรบา้ ง และมีเวบ็เพจหนา้ ไหนท่ีเก่ียวขอ้ งเช่ือมโยงถึงกนั ดงั น้นั การออกแบบโครงสร้างเวบ็ ไซทจ์ ึงเป็ นเรื่องสาคญัเปรียบเสมือนกบั การเขียนแบบอาคารก่อนที่จะลงมือสร้าง เพราะจะทาให้เรามองเห็นหนา้ ตาของเวบ็ ไซทเ์ ป็ นรูปธรรมมากข้ึน สามารถออกแบบระบบเนวิเกชนั่ ไดเ้ หมาะสม และเป็ นแนวทางการทางานที่ชดั เจน สาหรับข้นั ตอนต่อๆไป นอกจากน้ีโครงสร้างเวบ็ ไซทท์ ี่ดียงั ช่วยใหผ้ ชู้ มไม่สับสนและคน้ หาขอ้ มูลที่ตอ้ งการไดอ้ ยา่ งรวดเร็ววธิ ีการจดั โครงสร้างเวบ็ ไซทส์ ามารถทาไดห้ ลายแบบ แตแ่ นวคิดหลกั ๆที่นิยมใชก้ นั มีอยู่ 2 แบบคือจดั ตามกลุ่มเน้ือหา ( Content-based Structure )จดั ตามกลุ่มผชู้ ม ( User-based Structure )รูปแบบของโครงสร้ำงเวบ็ ไซต์เราสามารถวางรูปแบบโครงสร้างเวบ็ ไซทไ์ ดห้ ลายแบบตามความเหมาะสม เช่น แบบเรียงลาดบั (Sequence) เหมาะสาหรับเวบ็ ไซทท์ ี่มีจานวนเวบ็ เพจไม่มากนกั หรือเวบ็ไซทท์ ี่มีการนาเสนอขอ้ มลู แบบทีละข้นั ตอน แบบระดบั ช้นั (Hierarchy) เหมาะสาหรับเวบ็ ไซทท์ ี่มีจานวนเวบ็ เพจมากข้ึน เป็ นรูปแบบท่ีเราจะพบไดท้ วั่ ไป แบบผสม (Combination) เหมาะสาหรับเวบ็ ไซทท์ ี่ซบั ซ้อน เป็ นการนาขอ้ ดีของรูปแบบท้งั 2 ขา้ งตน้ มาผสมกนัทฤษฎกี ำรใช้โปรแกรม 1. ทฤษฏี HTML คือ ภาษาที่ใช้ในการเขียนเวบ็ เพจ ย่อมาจากคา ว่า Hypertext Markup Language โดยHypertext หมายถึง ขอ้ ความท่ีเช่ือมต่อกนั ผา่ นลิงค์ (Hyperlink) Markup หมายถึง วิธีในการเขียนขอ้ ความ language หมายถึงภาษา ดงั น้นั HTML จึงหมายถึง ภาษาท่ีใชใ้ นการเขียนขอ้ ความ ลงบนเอกสารท่ีต่างก็เช่ือมถึงกนั ใน Cyberspace ผา่ น Hyperlink นน่ั เองHTML เริ่มข้ึนเมื่อ ปี 1990 เพื่อตอบสนองความตอ้ งการในการส่ือสารแลกเปลี่ยนขอ้ มูลกนั ของนกั วิทยาศาสตร์ระหวา่ งสถาบนัและมหาวิทยาลยั ต่างๆทวั่ โลก โดย Tim Berners-Lee นกั พฒั นาของ CERN ไดพ้ ฒั นาภาษาที่มีรากฐานมาจาก SGML ซ่ึงเป็นภาษาท่ีซบั ซอ้ นและยากต่อการเรียนรู้ จนมาเป็ นภาษาท่ีใชไ้ ดง้ ่ายและสะดวกในการแลกเปลี่ยนเอกสารทางวทิ ยาศาสตร์ผา่ นการเชื่อมโยงกนั ดว้ ยลิงคใ์ นหนา้ เอกสาร เม่ือWorld Wide Web เป็ นที่แพร่หลาย HTML จึงถูกนามาใชจ้ นเกิดการแพร่หลายออกไปยงั ทวั่ โลกจากความง่ายตอ่ การใชง้ านHTML ในปัจจุบนั พฒั นามาจนถึง HTML 4.01 และ HTML 5 นอกจากน้ี 73
ยงั มีการพฒั นาไปเป็ น XHTML ซ่ึงคือ Extended HTML มีความสามารถและมาตรฐานท่ีมากกวา่ เดิมโดยอยภู่ ายใตก้ ารควบคุมของ W3C (World Wide Web Consortium) 2. ทฤษฏี PHP เกิดในปี 1994 โดย RasmusLerdorf โปรแกรมเมอร์อเมริกนั ไดค้ ิดคน้ สร้างเคร่ืองมือที่ใชใ้ นการพฒั นาเวบ็ ส่วนตวั โดยใชข้ อ้ ดีของภาษา C และ Perl เรียกวา่ Personal Home Page และไดส้ ร้างส่วนติดต่อกบั ฐานขอ้ มูลที่ชื่อวา่ Form Interpreter ( FI ) รวมท้งั สองส่วน เรียกวา่ PHP/FI ซ่ึงเป็ นจุดเร่ิมตน้ ของ PHP มีผทู้ ี่เขา้ มาเยยี่ มชมเวบ็ ไซตแ์ ละชอบจึงติดตอ่ ขอเอาโคด้ ไปใช้ และนา ไปพฒั นาต่อในลกั ษณะของ Open Source ภายหลงั มีความนิยมข้ึนเป็ นอยา่ งมากภายใน 3 ปี มีเวบ็ ไซตท์ ี่ใช้PHP/FIในติดต่อฐานขอ้ มูลและแสดงผลแบบ ไดนามิกและอ่ืนๆ มากกวา่ 50,000 ไซต์ PHP2 (ในตอนน้นั ใชช้ ่ือวา่ PHP/FI) ในช่วงระหว่าง 1995-1997 RasmusLerdorf ไดม้ ีผทู้ ่ีมาช่วยพฒั นาอีก 2คนคือ ZeevSuraski และ AndiGutmans ชาวอิสราเอล ซ่ึงปรับปรุงโคด้ ของ Lerdorf ใหม่โดยใช้C++ ให้มีความสามารถจดั การเกี่ยวกับแบบฟอร์มขอ้ มูลท่ีถูกสร้างมาจากภาษาHTML และสนบั สนุนการติดต่อกบั โปรแกรมจดั การฐานขอ้ มูล MySQL จึงทาให้ PHP เริ่มถูกใชม้ ากข้ึนอยา่ งรวดเร็ว และเริ่มมีผูส้ นบั สนุนการใช้งาน PHP มากข้ึน โดยในปลายปี 1996 PHP ถูกนา ไปใช้ประมาณ15,000 เว็บทั่วโลก และเพิ่มจานวนข้ึนเร่ือย ๆ ต่อมามีผูม้ าช่วยพฒั นาอีก 3 คน คือStigBakken รับผดิ ชอบความสามารถในการติดต่อ Oracle, Shane Caraveo รับผิดชอบดูแล PHP บนWindow9x/NT, และ Jim Winstead รับผดิ ชอบการตรวจความบกพร่องต่าง ๆ และไดเ้ ปลี่ยนชื่อเป็ นProfessionalHome Page ในเวอร์ชนั่ ที่ 2PHP3 ออกมาในช่วงระหวา่ งเดือน มิถุนายน 1997 ถึง 1999มีคุณสมบตั ิเด่นคือสนบั สนุนระบบปฏิบตั ิการท้งั Window 95/98/ME/NT, Linux และเวบ็ เซร์ฟเวอร์อย่าง IIS, PWS, Apache,OmniHTTPd สนบั สนุนระบบฐานขอ้ มูลได้หลายรูปแบบเช่น SQLServer, MySQL, mSQL, Oracle,Informix, ODBCPHP4 ต้งั แต่ 1999 - 2007 ซ่ึงไดเ้ พ่ิม Functionsการทางานในดา้ นต่าง ๆ ใหม้ ากและง่ายข้ึนโดย บริษทั Zend ซ่ึงมี Zeev และ AndiGutmansไดร้ ่วมก่อต้งั ข้ึน (http://www.zend.com ) ในเวอร์ชน่ั น้ีจะเป็ น compile script ซ่ึงในเวอร์ชน่ั หนา้ น้ีจะเป็ นembed script interpreter ในปัจจุบนั มีคนไดใ้ ช้ PHPสูงกวา่ 5,100,000 ไซตใ์ นทวั่ โลก และผพู้ ฒั นาไดต้ ้งั ช่ือของ PHP ใหม่วา่ PHP: Hypertext Preprocessor ซ่ึงหมายถึงมีประสิทธิภาพระดบั โปรเฟสเซอร์สาหรับไฮเปอร์เท็กซ์ PHP5 ต้งั แต่ 2007-ปัจจุบนั มี ไดเ้ พ่ิม Functions การทางานในดา้ นต่างๆเช่น Object Oriented Model 1. การกาหนดสโคป public/private/protected 2. Exception handling 3. XML และ Web Service 4. MySQLiและ SQLite 5. Zend Engine 2.0 74
ลกั ษณะเด่นของ PHP 1. สามารถใชไ้ ดฟ้ รี 2. PHP เป็นโปรแกรมวงิ่ ขา้ ง Sever ดงั น้นั ขีดความสามารถไมจ่ า กดั 3. Conlatfun นนั่ คือ PHP วง่ิ บนเคร่ือง UNIX ,Linux ,Windows ไดห้ มด 4. เรียนรู้ง่าย เน่ืองจาก PHP ฝั่งเขา้ ไปใน HTML และใชโ้ ครงสร้างและไวยากรณ์ภาษา ง่ายๆ 5. ใชร้ ่วมกบั XML ไดท้ นั ที 6. ใชก้ บั ระบบแฟ้ มขอ้ มลู ได้ 7. ใชก้ บั ขอ้ มลู ตวั อกั ษรไดอ้ ยา่ งมีประสิทธิภาพ 8. ใชก้ บั โครงสร้างขอ้ มูลใชไ้ ดแ้ บบ Scalar ,Array ,Associative array 9. ใชก้ บั การประมวลผลภาพได้ทฤษฎโี ปรแกรมฐำนข้อมูล โปรแกรมฐานขอ้ มูล เป็ นโปรแกรมหรือซอฟแวร์ท่ีช่วยจดั การขอ้ มูลหรือรายการต่าง ๆ ท่ีอยใู่ นฐานขอ้ มูลไม่ว่าจะเป็ นการจดั เก็บ การเรียกใช้ การปรับปรุงขอ้ มูล โปรแกรมฐานขอ้ มูล จะช่วยใหผ้ ใู้ ชส้ ามารถคน้ หาขอ้ มลู ไดอ้ ยา่ งรวดเร็ว ซ่ึงโปรแกรมฐานขอ้ มูลที่นิยมใชม้ ีอยดู่ ว้ ยกนั หลายตวั เช่น Access, FoxPro, Clipper, dBase, FoxBase, Oracle, SQL เป็ นตน้ โดยแต่ละโปรแกรมจะมีความสามารถต่างกนั บางโปรแกรมใช้ง่ายแต่จะจากดั ขอบเขตการใชง้ านบางโปรแกรมใชง้ านยากกวา่ แต่จะมีความสามารถในการทางานมากกวา่ โปรแกรม Access นบั เป็ นโปรแกรมที่นิยมใชก้ นัมากในขณะน้ี โดยเฉพาะในระบบฐานขอ้ มลู ขนาดใหญ่สามารถสร้างแบบฟอร์มท่ีตอ้ งการจะเรียกดูขอ้ มูลในฐานขอ้ มูล หลงั จากบนั ทึกขอ้ มูลในฐานขอ้ มูลเรียบร้อยแลว้ จะสามารถคน้ หาหรือเรียกดูขอ้ มูลจากเขตขอ้ มูลใดก็ไดน้ อกจากน้ี Access ยงั มีระบบรักษาความปลอดภยั ของขอ้ มูลโดยการกาหนดรหสั ผา่ นเพือ่ ป้ องกนั ความปลอดภยั ของขอ้ มลู ในระบบไดด้ ว้ ย โปรแกรม FoxPro เป็ นโปรแกรมฐานขอ้ มูลท่ีมีผใู้ ชง้ านมากที่สุดเนื่องจากใชง้ ่ายท้งั วิธีการเรียกจากเมนูของ FoxPro และประยุกต์โปรแกรมข้ึนใช้งานโปรแกรมท่ีเขียนดว้ ย FoxPro จะสามารถใช้กลบั dBase คาสั่งและฟังก์ช้ันต่างๆใน dBase จะสามารถใช้งานบน FoxPro ได้นอกจากน้ีใน FoxPro ยงั มีเครื่องมือช่วยในการเขียนโปรแกรม เช่น การสร้างรายงาน โปรแกรม dBase เป็ นโปรแกรมฐานขอ้ มูลชนิดหน่ึงการใช้งานจะคล้ายกบั โปรแกรมFoxPro ขอ้ มูลรายงานท่ีอยู่ในไฟล์บน dBase จะสามารถส่งไปประมวลผลในโปรแกรม WordProcessor ได้ และแมแ้ ต่ Excel กส็ ามารถอา่ นไฟล์ .DBF ที่สร้างข้ึนโดยโปรแกรม dBase ไดด้ ว้ ย 75
โปรแกรม SQL เป็ นโปรแกรมฐานขอ้ มูลที่มีโครงสร้างของภาษาที่เขา้ ใจง่ายไม่ซบั ซอ้ น มีประสิทธิภาพการทางานสูง สามารถทางานที่ซบั ซอ้ นไดโ้ ดยใชค้ าสงั่ เพยี งไม่ก่ีคาส่ังโปรแกรม SQLจึงเหมาะที่จะใชก้ บั ระบบฐานขอ้ มูลเชิงสัมพนั ธ์ และเป็ นภาษาหน่ึงที่มีผนู้ ิยมใชก้ นั มากโดยทว่ั ไปโปรแกรมฐานขอ้ มูลของบริษทั ต่าง ๆ ท่ีมีใชอ้ ยใู่ นปัจจุบนั เช่น Oracle, DB2 ก็มกั จะมีคาส่ัง SQL ท่ีต่างจากมาตรฐานไปบา้ งเพ่อื นใหเ้ ป็นจุดเด่นของแต่ละโปรแกรมไป ความสาคญั ของการประมวลผลแบบระบบฐานข้อมูลจากการจัดเก็บข้อมูลรวมเป็ นฐานขอ้ มูลจะก่อใหเ้ กิดประโยชน์ดงั น้ี 1. สามารถลดความซ้าซอ้ นของขอ้ มลู ได้การเก็บขอ้ มูลชนิดเดียวกนั ไวห้ ลาย ๆ ท่ีทาให้เกิดความซ้าซอ้ น (Redundancy) ดงั น้นั การนาขอ้ มูลมารวมเก็บไวใ้ นฐานขอ้ มูล จะชาวลดปัญหาการเกิดความซ้าซ้อนของขอ้ มูลได้ โดยระบบจดั การฐานขอ้ มูล (Database Management System : DBMS) จะช่วยควบคุมความซ้าซอ้ นไดเ้ นื่องจากระบบจดั การฐานขอ้ มูลจะทราบไดต้ ลอดเวลาวา่ มีขอ้ มลู ซ้าซอ้ นกนั อยทู่ ่ีใดบา้ ง 2. หลีกเล่ียงความขดั แยง้ ของขอ้ มูลไดห้ ากมีการเก็บขอ้ มูลชนิดเดียวกนั ไวห้ ลาย ๆ ท่ีและมีการปรับปรุงขอ้ มูลเดียวกนั น้ี แต่ปรับปรุงไม่ครบทุกท่ีท่ีมีขอ้ มูลเก็บอย่กู ็จะทาให้เกิดปัญหาขอ้ มูลชนิดเดียวกนั อาจมีค่าไมเ่ หมือนกนั ในแตล่ ะท่ีท่ีเก็บขอ้ มลู อยู่ จึงก่อให้เกิดความขดั แยง้ ของขอ้ มูลข้ึน(Inconsistency) 3. สามารถใชข้ อ้ มลู ร่วมกนั ไดฐ้ านขอ้ มูลจะเป็ นการจดั เก็บขอ้ มูลรวมไวด้ ว้ ยกนั ดงั น้นั หากผใู้ ชต้ อ้ งการใชข้ อ้ มูลในฐานขอ้ มลู ที่มาจากแฟ้ มขอ้ มลู ตา่ ง ๆ ก็จะทาไดโ้ ดยง่าย 4. สามารถรักษาความถูกต้องเชื่อถือได้ของข้อมูลบางคร้ังพบว่าการจดั เก็บข้อมูลในฐานขอ้ มูลอาจมีขอ้ ผิดพลาดเกิดข้ึน เช่น จากการที่ผูป้ ้ อนขอ้ มูลป้ อนขอ้ มูลผิดพลาดคือป้ อนจากตวั เลขหน่ึงไปเป็นอีกตวั เลขหน่ึงโดยเฉพาะกรณีมีผใู้ ชห้ ลายคนตอ้ งใชข้ อ้ มูลจากฐานขอ้ มูลร่วมกนัหากผูใ้ ช้คนใดคนหน่ึงแก้ไขข้อมูลผิดพลาดก็ทาให้ผูอ้ ื่นได้รับผลกระทบตามไปด้วย ในระบบจดั การฐานขอ้ มลู (DBMS) จะสามารถใส่กฎเกณฑเ์ พื่อควบคุมความผดิ พลาดท่ีเกิดข้ึน 5. สามารถกาหนดความเป็ นมาตรฐานเดียวกนั ของขอ้ มูลไดก้ ารเก็บขอ้ มูลร่วมกนั ไวใ้ นฐานขอ้ มูลจะทาให้สามารถกาหนดมาตรฐานของขอ้ มูลไดร้ วมท้งั มาตรฐานต่าง ๆ ในการจดั เก็บขอ้ มลู ใหเ้ ป็นไปในลกั ษณะเดียวกนั ได้ เช่นการกาหนดรูปแบบการเขียนวนั ที่ในลกั ษณะวนั /เดือน/ปีหรือ ปี /เดือน/วนั ท้งั น้ีจะมีผทู้ ่ีคอยบริหารฐานขอ้ มลู ที่เราเรียกวา่ ผบู้ ริหารฐานขอ้ มลู(Database Administrator: DBA) เป็นผกู้ าหนดมาตรฐานต่างๆ 6. สามารถกาหนดระบบความปลอดภยั ของขอ้ มูลไดร้ ะบบความปลอดภยั ในท่ีน้ี เป็ นการป้ องกันไม่ให้ผูใ้ ช้ท่ีไม่มีสิทธิมาใช้ หรือมาเห็นข้อมูลบางอย่างในระบบผูบ้ ริหารฐานขอ้ มูลจะสามารถกาหนดระดบั การเรียกใชข้ อ้ มลู ของผใู้ ชแ้ ต่ละคนไดต้ ามความเหมาะสม 76
7. เกิดความเป็ นอิสระของขอ้ มูลในระบบฐานขอ้ มูลจะมีตวั จดั การฐานขอ้ มูลท่ีทาหนา้ ท่ีเป็ นตวั เชื่อมโยงกบั ฐานขอ้ มูล โปรแกรมต่าง ๆ อาจไม่จาเป็ นตอ้ งมีโครงสร้างขอ้ มูลทุกคร้ัง ดงั น้นัการแกไ้ ขขอ้ มูลบางคร้ัง จึงอาจกระทาเฉพาะกบั โปรแกรมท่ีเรียกใช้ขอ้ มูลท่ีเปลี่ยนแปลงเท่าน้ันส่วนโปรแกรมที่ไม่ไดเ้ รียกใชข้ อ้ มลู ดงั กล่าว ก็จะเป็นอิสระจากการเปลี่ยนแปลง 3. ทฤษฎสี ี สีเป็ นสิ่งที่มีความสาคญั ต่อวิถีชีวิต นบั แต่สมยั ดึกดาบรรพจ์ นถึงปัจจุบนั ไดน้ าสีมาใชใ้ ห้เกิดประโยชน์โดยใชเ้ ป็ นสัญลกั ษณ์ในการถ่ายทอดความหมายอยา่ งใดอยา่ งหน่ึง สีจึงเป็ นสิ่งท่ีควรศึกษาเพื่อใชป้ ระโยชนก์ บั วถิ ีชีวติ ของเราเพราะสรรพสิ่งท้งั หลายที่แวดลอ้ มตวั เราประกอบไปดว้ ยสีท้งั สิ้นในงานศิลปะสีเป็นองคป์ ระกอบสาคญั อยา่ งหน่ึงและในวถิ ีชีวติ ของเราสีเป็นองคป์ ระกอบท่ีมีอิทธิพลต่อ ความรู้สึก อารมณ์ และจิตใจแม่สี ประกอบดว้ ย สี แดง สีเหลือง และสีน้าเงิน ซ่ึงเม่ือนาแม่สีท้งั สามมาผสมกนั ในอตั ราส่วนต่าง ๆ ก็จะเกิดสีข้ึนมามากมาย ซ่ึงประโยชน์ จากการที่เรานาสีมาผสมกนั ทาให้เรา สามารถเลือกสีต่าง ๆ มาใช้ไดต้ ามความพอใจ สร้างสรรค์ผลงานศิลปะท่ีงดงามตามความพอใจขอผสู้ ร้างสีที่เกิดจากการนาเอาแม่สีมาผสมกนั เกิดสีใหม่เม่ือนามาจดั เรียงอยา่ งเป็นระบบรวมเรียกวา่ วงจรสี รูปท่ี 2.2 ภาพแสดงวงจรของสีที่เกิดจากการนาแมส่ ีมาผสมกนั การเกิดสีดงั ภาพ เกิดจากการนาเอาแม่สีมาผสมกนั ในอตั ราส่วนต่างๆกนั ซ่ึงสรุปไดด้ งั น้ีสีข้นั ที่1 (Primary Color) คือสีพ้นื ฐานมีแมส่ ี 3 สี 1. สีพ้ืนฐานแม่สีรูปท2ี่ .3 สีพ้นื ฐานแม่สี 77
1. แดง 2. สีเหลือง 3. สีน้าเงิน สีข้นั ที่ 2 (Binary Color) คือสีท่ีเกิดจากการนาเอาสีข้นั ท่ี 1 หรือแม่สีมาผสมกนั ในอตั ราส่วนเทา่ กนั จะทาใหเ้ กิดสีใหม่ 3 สีไดแ้ ก่ 1. สีเขียวเกิดจากการนาเอา สีเหลือง กบั สีน้าเงิน มาผสมกนั ในอตั ราส่วนเท่า ๆ กนั 2. สีส้ม เกิดจากการนาเอา สีเหลือง กบั สีแดง มาผสมกนั ในอตั ราส่วนท่ีเท่า ๆ กนั 3. สีม่วง เกิดจากการนาเอา สีน้าเงิน กบั สีแดง มาผสมกนั ในอตั ราส่วนที่เทา่ ๆ กนัสีข้นั ที่ 3 (Intermediate Color) คือ สีท่ีเกิดจากการผสมกนั ระหวา่ งสีของแม่สีกีบสีข้นั ที่ 2 จะเกิดสีข้ึนอีก 6 สีไดแ้ ก่ รูปที่ 2.4 สีเหลืองแกมเขียว -สีเหลืองแกมเขียว เกิดจาก การผสมกนั ระหวา่ งสีเหลืองกบั สีเขียวอยา่ งละเทา่ ๆ กนั รูปที่ 2.5 สีน้าเงินแกมม่วง -สีน้าเงินแกมมว่ ง เกิดจากการผสมกนั ระหวา่ งสีน้าเงินกบั สีมว่ งอยา่ งละเทา่ ๆ กนั รูปที่ 2.6 สีแดงแกมม่วง -สีแดงแกมม่วง เกิดจากการผสมกนั ระหวา่ งสีแดงกบั สีม่วงอยา่ งละเท่า ๆ กนั รูปท่ี 2.7 สีแดงแกมส้ม-สีแดงแกมส้ม เกิดจากการผสมกนั ระหวา่ งสีแดงกบั สีส้มอยา่ งละเท่า ๆ กนั 78
รูปท่ี 2.8 สีเหลืองแกมส้ม -สีเหลืองแกมส้ม เกิดจากการผสมกนั ระหวา่ งสีเหลืองกบั สีส้มอยา่ งละเท่า ๆ กนั รูปท่ี 2.9 สีน้าเงินแกมเขียว - สีน้าเงินแกมเขียวเกิดจากการผสมกนั ระหวา่ งสีน้าเงินกบั สีเขียวอยา่ งละเทา่ ๆ กนัคุณลกั ษณะของสีมี 3 ประการ คือ - สีแทห้ รือความเป็นสี(Hue) หมายถึงสีที่อยใู่ นวงจรสีธรรมชาติท้งั 12 สีสีท่ีเราเห็นอยทู่ ุกวนั น้ีแบ่งเป็น 2 วรรณะ โดยแบง่ วงจรสีออกเป็น 2 ส่วน จากสีเหลืองวนไปถึงสีม่วง คือ - สีร้อน (Warm Color) ใหค้ วามรู้สึกรุนแรงร้อนต่ืนเตน้ ประกอบดว้ ย สีเหลืองสีมว่ งสีเหลืองส้ม สีส้ม สีแดงส้ม สีแดง สีมว่ งส้ม - สีเยน็ (Cool Color) ให้ความรู้สึกเยน็ สงบสบายตาประกอบดว้ ย สีเหลือง สีเขียวเหลือง สีเขียว สีน้าเงินเขียว สีน้าเงิน สีม่วงน้าเงิน สีม่วงเราจะเห็นวา่ สีเหลือง และสีม่วง เป็ นสีที่อยไู่ ดท้ ้งั 2วรรณะ คือเป็นสีกลาง เป็นไดท้ ้งั สีร้อน และสีเยน็ควำมเข้มของสี (Intensity) เกิดจาก สีแท้ คือสีท่ีเกิดจากการผสมกนั ในวงจรสี เป็ นสีหลกั ที่ผสมข้ึนตามกฎเกณฑแ์ ละไมถ่ ูกผสมดว้ ยสีกลางหรือสีอื่น ๆ จะมีค่าความเขม้ สูงสุด หรือแรงจดั ที่สุด เป็ นค่าความแทข้ องสีที่ไม่ถูกเจือปน เม่ือสีเหล่าน้ี อยทู่ ่ามกลางสีอ่ืน ๆ ที่ถูกผสมใหเ้ ขม้ ข้ึน หรืออ่อนลง ให้มืด หม่น หรือเปล่ียนคา่ ไปแลว้ สีแทจ้ ะแสดงความแรงของสีปรากฏออกมาใหเ้ ห็น อยา่ งชดั เจน ซ่ึงจะทาให้เกิดจุดสนใจข้ึนในผลงานลกั ษณะเช่นน้ี เหมือนกบั ดอกเฟื่ องฟ้ าสีชมพสู ด หรือบานเยน็ ที่อยทู่ ่ามกลางใบเฟ่ื องฟ้ าท่ีเขียวจดั ๆ หรือ พลุที่ถูกจุดส่องสวา่ งในยามเทศกาล ตดั กบั สีมืด ๆ ทึบ ๆ ของทอ้ งผา้ ยามค่าคืน เป็นตน้นำ้ หนักของสี (Value) เป็นการใชส้ ีโดยใหม้ ีค่าน้าหนกั ในระดบั ตา่ ง ๆ กนั และมีสีหลาย ๆ สี ซ่ึงถา้ เป็นสีเดียว ก็จะมีลกั ษณะเป็ นสีเอกรงค์ การใชค้ ่าน้าหนกั ของสี จะทาใหเ้ กิดความกลมกลืน เกิดระยะใกลไ้ กล ต้ืนลึก ถา้ มีคา่ น้าหนกั หลาย ๆ ระดบั สีกจ็ ะกลมกลืนกนั มากข้ึนแต่ถา้ มีเพียง1 - 2 ระดบั ท่ีห่างกนั จะทาใหเ้ กิดความแตกตา่ งควำมรู้สึกของสี การใชว้ รรณะร้อนเช่นสีแดงส้ม ทาให้เกิดความรู้สึกอบอุ่น ทา้ ทาย เคล่ือนไหวสิ่งต่าง ๆ ท่ีเราสมั ผสั ดว้ ยสายตา จะทาใหเ้ กิดความรู้สึกข้ึนภายในต่อเรา ทนั ทีท่ีเรามองเห็นสี ไม่วา่ จะเป็ น การแต่งกาย บา้ นท่ีอยู่อาศยั เครื่องใช้ต่าง ๆ แลว้ เราจะทาอย่างไร จึงจะใช้สีไดอ้ ย่างเหมาะสม และ 79
สอดคลอ้ งกบั หลกั จิตวิทยา เราจะตอ้ งเขา้ ใจว่าสีใดให้ความรู้สึกต่อมนุษยอ์ ย่างไร ซ่ึงความรู้สึกเก่ียวกบั สีสามารถจาแนกออกไดด้ งั น้ีรูป สี ความหมาย สีแดง ให้ความรู้สึกร้อนรุนแรง กระตุน้ ตื่นเตน้ เร้าใจ ความอุดมสมบูรณ์ ความมง่ั คงั่ ความรัก สีส้ม ให้ความรู้สึก ร้อน มีชีวิตชีวา วยั รุ่น ความคึกคะนอง การปลดปล่อย ความเปร้ียว การระวงั สีเหลือง ใหค้ วามรู้สึกแจ่มใส ความสดใส ความร่าเริง ความมีชีวติ ใหม่ ความสุขสีเขียว ให้ความรู้สึกสงบ เงียบ ร่มเย็น การพกั ผอ่ น การผ่อนคลาย ธรรมชาติสีน้าเงิน ความสุขมุ เยอื กเยน็สีมว่ งสีฟ้ า ให้ความรู้สึกสงบเงียบ สุขุม สุภาพ ละเอียด สง่างาม มีศกั ด์ิศรี เป็ นสีดา ระเบียบถ่อมตนสีชมพูสีเทา ให้ความรู้สึก มีเสน่ห์ น่าติดตาม มีอานาจความรัก ความเศร้าความสงบสีทอง ความผดิ หวงั ความสูงศกั ด์ิ ให้ความรู้สึก ปลอดโปร่งโล่ง กวา้ ง เบา โปร่งใส สะอาด ปลอดภัย ความสวา่ ง ใหค้ วามรู้สึก มืด ลึกลบั ความสิ้นหวงั จุดจบ ความตาย โหดร้าย อดทน หนกั แน่น เขม้ แขง็ มีพลงั ความเศร้า ใหค้ วามรู้สึกอบอุ่น อ่อนโยน นุ่มนวล อ่อนหวาน ความรัก ความน่ารัก ความสดใส ใหค้ วามรู้สึก เศร้า อาลยั ทอ้ แท้ ความลึกลบั ความหดหู่ ความชรา สุขมุ ความสงบ ความเงียบ สุภาพ ถ่อมตน ให้ความรู้สึก ความหรูหรา โอ่อ่า มีราคา สูงค่า สิ่งสาคญั ความมง่ั คงั่ ความเจริญรุ่งเรือง ตำรำงท่ี 2.1 ความรู้สึกของสี 80
สีกบั กำรออกแบบ ผูส้ ร้างสรรคง์ านออกแบบจะเป็ นผทู้ ่ีเกี่ยวขอ้ งกบั การใช้สีโดยตรงมณั ฑนากรจะคิดคน้ สีข้ึนมาเพอ่ื ใชใ้ นงานตกแต่งคนออกแบบฉากเวทีการแสดงจะคิดคน้ สีเก่ียวกบั แสง จิตรกรก็จะคิดคน้สีข้ึนมาระบายใหเ้ หมาะสมกบั ความคิดและจินตนาการของตนแลว้ ตวั เราจะคิดคน้ สีข้ึนมาเพื่อความงามความสุขสาหรับเรามิไดห้ รือสีที่ใชส้ าหรับการออกแบบน้นั ถา้ เราจะใชใ้ หเ้ กิดความสวยงามตรงตามความตอ้ งการของเรา มีหลกั ในการใชก้ วา้ งๆ อยู่ 2 ประการ คือ การใชส้ ีกลมกลืนกนั และการใช้สีตดั กนั การใช้สีกลมกลืนกนั การใชส้ ีให้กลมกลืนกนั เป็ นการใชส้ ีหรือน้าหนกั ของสีให้ใกลเ้ คียงกนั หรือคลา้ ยคลึงกนั เช่น การใช้สีแบบเอกรงค์เป็ นการใช้สีสีเดียวที่มีน้าหนกั อ่อนแก่หลายลาดบัการใชส้ ีขา้ งเคียงเป็นการใชส้ ีท่ีเคียงกนั 2 – 3 สี ในวงสี เช่น สีแดง สีส้มแดง และสีม่วงแดง การใช้สีใกลเ้ คียงเป็นการใชส้ ีที่อยเู่ รียงกนั ในวงสีไม่เกิน 5 สี ตลอดจนการใชส้ ีวรรณะร้อนและวรรณะเยน็(warm tone colors and cool tone colors) ดงั ไดก้ ล่าวมาแลว้ การใชส้ ีตดั กนั สีตดั กนั คือสีท่ีอยตู่ รงขา้ มกนั ในวงจรสี การใชส้ ีใหต้ ดั กนั มีความจาเป็ นมากในงานออกแบบ เพราะช่วยใหเ้ กิดความน่าสนใจในทนั ทีท่ีพบเห็น สีตดั กนั อยา่ งแทจ้ ริงมีอยดู่ ว้ ยกนั6คู่สีคือ - สีเหลือง ตรงขา้ มกบั สีม่วง - สีส้ม ตรงขา้ มกบั สีน้าเงิน -สีแดง ตรงขา้ มกบั สีเขียว -สีเหลืองส้ม ตรงขามกบั สีม่วงน้าเงิน -สีส้มแดง ตรงขา้ มกบั น้าเงินเขียว -สีม่วงแดง ตรงขา้ มกบั สีเหลืองเขียว การใช้สีตดั กนั ควรคานึงถึงความเป็ นเอกภาพด้วย วิธีการใช้มีหลายวิธี เช่น ใช้สีให้มีปริมาณตา่ งกนั เช่น ใชส้ ีแดง 20 % สีเขียว 80% หรือ ใชเ้ น้ือสีผสมในกนั และกนั หรือใชส้ ีหน่ึงสีใดผสมกบั สีคูท่ ี่ตดั กนั ดว้ ยปริมาณเล็กนอ้ ยรวมท้งั การเอาสีที่ตดั กนั มาทาใหเ้ ป็นลวดลายเล็ก ๆ สลบั กนัในผลงานชิ้นหน่ึง อาจจะใชส้ ีใหก้ ลมกลืนกนั หรือตดั กนั เพียงอยา่ งใดอยา่ งหน่ึงหรืออาจจะใชพ้ ร้อมกนั ท้งั 2 อยา่ ง ท้งั น้ีแลว้ แตค่ วามตอ้ งการและความคิดสร้างสรรคข์ องเราไม่มีหลกั การหรือรูปแบบที่ตายตวั ในงานออกแบบหรือการจดั ภาพหากเรารู้จกั ใช้สีให้มีสภาพโดยรวมเป็ นวรรณะร้อน หรื อวรรณะเยน็ เราจะสามารถควบคุมและสร้างสรรคภ์ าพใหเ้ กิดความประสานกลมกลืนงดงามไดง้ ่ายข้ึนเพราะสีมีอิทธิพลต่อ มวล ปริมาตร และช่องว่างสีมีคุณสมบตั ิท่ีทาให้เกิดความกลมกลืน หรือขดั แยง้ ได้ สีสามารถขบั เน้นให้ให้เกิดจุดเด่น และการรวมกนั ให้เกิดเป็ นหน่วยเดียวกนั ไดเ้ ราในฐานะผูใ้ ช้สีตอ้ งนาหลกั การต่างๆของสีไปประยุกต์ใช้ให้สอดคล้องกบั เป้ าหมายในงานของเราเพราะสีมีผลต่อการออกแบบคือ 81
-สร้างความรู้สึกสีใหค้ วามรู้สึกตอ่ ผพู้ บเห็นแตกต่างกนั ไปท้งั น้ีข้ึนอยกู่ บั ประสบการณ์และภูมิหลงั ของแต่ละคนสีบางสีสามารถรักษาบาบดั โรคจิตบางชนิดไดก้ ารใช้สีภายในหรือภายนอกอาคารจะมีผลตอ่ การสัมผสั และสร้างบรรยากาศได้ -สร้างความน่าสนใจสีมีอิทธิพลต่องานศิลปะการออกแบบจะช่วยสร้างความประทบั ใจและความน่าสนใจเป็นอนั ดบั แรกท่ีพบเห็น -สีบอกสัญลกั ษณ์ของวตั ถุซ่ึงเกิดจากประสบการณ์หรือภูมิหลงั เช่นสีแดงสัญลกั ษณ์ของไฟหรืออนั ตรายสีเขียวสัญลกั ษณ์แทนพืชหรือความปลอดภยั เป็นตน้ -สีช่วยใหเ้ กิดการรับรู้การออกแบบตอ้ งการใหผ้ พู้ บเห็นเกิดการจดจาใจรูปแบบแลผลงานหรือเกิดความประทบั ใจ การใชส้ ีจะตอ้ งสะดุดตา และมีเอกภาพ3. หลกั กำรพนื้ ฐำนในกำรออกแบบกำรขำยสินค้ำออนไลน์ 1. ศึกษาสินคา้ ที่เราสนใจจะขาย - คุณควรมีสินคา้ หรือผลิตภณั ฑ์ท่ีสนใจและตอ้ งการจะขายเสียก่อน และควรเขา้ ใจจุดแขง็ จุดอ่อน ของสินคา้ ของคุณ รวมถึงจุดขายท่ีแตกต่างจากคู่แข่งในตลาดให้ดีก่อนท่ีจะนาสินคา้ เขา้ สู่ตลาด และควรตอบคาถามให้ไดว้ า่ ทาไมผใู้ ช้ถึงเลือกซ้ือ และเลือกใชส้ ินคา้ หรือบริการของคุณ ซ่ึงหากคุณสามารถตอบโจทยเ์ หล่าน้ีได้ จะช่วยใหค้ ุณสามารถประกอบธุรกิจไดป้ ระสบความสาเร็จไดม้ ากข้ึนนนั่ เองคะ่ 2. ศึกษาทาความเขา้ ใจกบั พาณิชยอ์ ิเล็กทรอนิกส์ - การทาร้านคา้ ออนไลน์ หรือที่เรียกอยา่ งเป็ นทางการว่าพาณิชยอ์ ิเล็กทรอนิกส์น้นั คือการทาการคา้ ขายและธุรกรรมซ้ือขายผ่านทางระบบออนไลน์ หรือทางอินเตอร์เน็ตนัน่ เอง ซี่ึงช่วยให้คุณสามารถขายสินคา้ ของคุณได้ทุกที่ ท่ีอินเตอร์เน็ตสามารถเขา้ ถึง โดยไม่ตอ้ งเช่าพ้ืนท่ีหนา้ ร้านในแหล่งชุมชนซ่ึงมีค่าใชจ้ ่ายสูง และช่วยให้คุณประหยดั ค่าใชจ้ ่ายไปไดม้ าก อีกท้งั เปิ ดโอกาสให้ผูซ้ ้ือจากทว่ั โลกไดม้ ีโอกาสพบเห็นสินคา้ของคุณ สาหรับผูซ้ ้ือช่วยให้สะดวกสบายไม่ต้องเดินทางฝ่ ารถติดไปซ้ือสินค้าจากหน้าร้านคา้โดยตรง เพยี งเลือกสินคา้ ผา่ นอินเตอร์เน็ตอยทู่ ่ีบา้ น ชาระเงินผา่ นระบบท่ีน่าเชื่อถือ และรอสินคา้ มาส่งถึงท่ีบา้ น 3. เลือกระบบร้านคา้ ออนไลน์ - คุณสามารถเลือกเปิ ดร้านคา้ ออนไลน์ไดห้ ลากหลายรูปแบบ โดยทว่ั ไปท่ีนิยมมี 2 รูปแบบ คือ ใช้บริการร้านคา้ สาเร็จรูป ซ่ึงสามารถหาเว็บไซต์ที่ให้บริการเปิ ดร้านคา้ เหล่าน้ีไดม้ ามากเล่น weloveshopping, tarad.com, lnwshop, shopspot เป็ นตน้หรือ คุณสามารถเลือกใช้โปรแกรมสาเร็จรูป เพื่อติดต้งั ปรับแต่งได้ด้วยตวั เอง มีอิสระในการปรับแต่งมากกวา่ แตอ่ าจจะยงุ่ ยากกวา่ ในการเร่ิมตน้ เช่น PrestaShop, Mageto เป็นตน้ 4. จดั แต่งหน้าร้านคา้ ออนไลน์ รูปแบบ สีสัน ป้ ายร้าน - เมื่อคุณเลือกบริการร้านคา้ ได้แลว้ ก็เร่ิมตกแต่งร้านคา้ ให้เหมาะสมและดึงดูด หลีกเลี่ยงการตกแต่งร้านคา้ ให้กระพริบ และมี 82
ลูกเล่นมากเกินความจาเป็ น ยิ่งทาใหผ้ ูใ้ ชง้ งงวย และใชง้ านไดย้ าก ควรเน้นท่ีสินคา้ ให้ดูคน้ หาง่ายและสะอาดตา น่าเช่ือถือ และคน้ หาสินคา้ และสัง่ ซ้ือไดง้ ่าย 5. จดั หมวดหมู่สินคา้ ลงรูปสินคา้ อพั เดทขอ้ มูล และราคาสินคา้ ลงเวบ็ ไซต์ - จากน้นั จดัหมวดหมู่สินคา้ ให้เหมาะสม ลงรายละเอียดสินคา้ ให้เรียบร้อย นารูปสินคา้ ท่ีชดั เจนสวยงาม เพ่ือช่วยดึงดูดลูกคา้ ไดม้ ากข้ึน 6. ทาการตลาดโปรโมทร้านออนไลน์ - การเปิ ดร้านคา้ ออนไลน์ในโลกอินเตอร์เน็ตท่ีกวา้ งใหญ่ อาจทาใหผ้ ซู้ ้ือไม่สามารถเขา้ ถึงเวบ็ ไซตข์ องเราไดง้ ่าย คุณควรทาการโปรโมทเวบ็ ไซต์เพื่อให้เป็ นท่ีรู้จกั และคน้ หาไดง้ ่ายผา่ นทาง Google ซ่ึงเรียกวา่ Search Engine Optimization หรือเรียกส้ันๆ วา่ SEO ซ่ึงจะอธิบายเทคนิคในบทต่อ ๆ ไปค่ะ3.5. มีการพฒั นาอยา่ งต่อเนื่อง การเรียนการสอนที่มีคุณภาพควรไดร้ ับการพฒั นาอยา่ งต่อเนื่อง เริ่มจากการวางแผน การนาไปทดลองใชจ้ ริงและนาผลการทดลองและขอ้ เสนอแนะจากผเู้ รียนมาปรับปรุงการเรียนการสอนให้มีคุณภาพมากข้ึนการพฒั นาอยา่ งตอ่ เนื่องเช่นน้ีจะทาใหก้ ารเรียนการสอนมีคุณภาพ 3.6. มีการประเมินผลครอบคลุมท้งั กระบวนการเรียนการสอนและการประเมินผลผเู้ รียนท้งั น้ีเพ่ือนาผลการประเมินไปใช้ในการพฒั นาการเรียนการสอนให้มีประสิทธิภาพ ประสิทธิผลและน่าสนใจมากข้ึน การประเมินผลผูเ้ รียน ไม่ควรมีจุดมุ่งหมายเพียงเพื่อทราบผลการเรียนรู้ของผเู้ รียนเท่าน้นั แตค่ วรใหไ้ ดข้ อ้ มลู ที่นาไปพฒั นาผเู้ รียนใหบ้ รรลุจุดประสงคก์ ารเรียนรู้ 3.7. องค์ประกอบการเรียนการสอนมีความสัมพนั ธ์กนั องค์ประกอบการเรียนการสอนเช่น จุดประสงค์การเรียนรู้ กิจกรรมการเรียนการสอน และการวดั ประเมินผล ควรมีความสัมพนั ธ์สอดคล้องกนั และเหมาะสมกบั ผูเ้ รียนและบริบทการเรียนรู้ ทาให้ผูเ้ รียนบรรลุจุดประสงค์การเรียนรู้ที่ตอ้ งการ หลกั การพ้ืนฐานในการออกแบบการเรียนการสอนท่ีนามากล่าวขา้ งต้นน้ีเป็ นแนวทางทั่วไปสาหรั บนักออกแบบการเรี ยนการสอนที่เริ่ มต้นการทางานในด้านน้ี ได้นาไปประยกุ ตใ์ ชใ้ หเ้ หมาะสมกบั สภาพและบริบทการเรียนการสอนข้นั ตอนของกระบวนการออกแบบส่ือการเรียนการการวเิ คราะห์ สอนการพฒั นา การปรับปรุง การประเมินรูปท่ี 2.10 ข้นั ตอนของการออกแบบส่ือการเรียนการสอน 83
รูปแบบแอดดี (ADDIE model) การออกแบบการเรียนการสอนตามรูปแบบแอดดี (ADDIE model) ประกอบดว้ ยกิจกรรมในการดาเนินงาน 5 กิจกรรม ไดแ้ ก่ การวเิ คราะห์ (analyze) การออกแบบ (design) การพฒั นา(develop) การนาไปใช้ (implement) และการประเมินผล (evaluate) ซ่ึงเม่ือพิจารณาใหด้ ีแลว้ มีลกั ษณะคล้ายกระบวนการแกป้ ัญหาอย่างเป็ นระบบ เร่ิมจากการวิเคราะห์ปัญหา (analyze) การนาเสนอแนวทางการแก้ปัญหา (design) การเตรียมการแก้ปัญหา (develop) การทดลองการแกป้ ัญหา (implement) และสุดทา้ ยประเมินแนวทางการแกป้ ัญหาว่าประสบความสาเร็จหรือไม่(evaluate) รูปแบบ ADDIE น้ีจึงเป็ นรูปแบบท่ีสามารถนาไปประยกุ ตใ์ ชใ้ นการออกแบบการเรียนการสอนในเรื่องต่าง ๆ ไดอ้ ยา่ งกวา้ งขวาง โดยเฉพาะมีผนู้ ิยมนาไปใชใ้ นการออกแบบส่ือ วสั ดุการเรียนการสอน เช่น การออกแบบชุดการเรียนการสอน การออกแบบบทเรียนแบบโปรแกรม เป็ นตน้ตลอดจนนาไปใชใ้ นการออกแบบการเรียนการสอนในระดบั มหภาค คือระบบการศึกษาในชุมชนและการออกแบบการเรียนการสอนในระดบั ห้องเรียนเพื่อพฒั นาผลการเรียนรู้ของผเู้ รียนในดา้ นตา่ ง ๆ องคป์ ระกอบของกิจกรรมท้งั 5 งานน้ี การวิเคราะห์การปรับปรุง การปรับปรุงการนาไปใช้ การประเมิน การออกแบบการปรับปรุง การพฒั นา การปรับปรุง รูปที่ 2.11 องคป์ ระกอบของกิจกรรม กิจกรรมที่จะตอ้ งปฏิบตั ิในแต่ละข้นั ตอนของการออกแบบการเรียนการสอนตามรูปแบบของ ADDIE model มีดงั ตอ่ ไปน้ี 84
ข้นั ท่ี 1 การวเิ คราะห์ กิจกรรมที่ปฏิบตั ิในข้นั น้ี ไดแ้ ก่1) การวเิ คราะห์ปัญหาและความตอ้ งการในการเรียนการสอนหรือการฝึกอบรม2) การวเิ คราะห์ระบบ สิ่งแวดลอ้ ม และสภาพขององคก์ ร เพ่ือพจิ ารณาถึงทรัพยากรและอุปสรรค3) การศึกษาลกั ษณะของกลุ่มประชากร4) การวเิ คราะห์เป้ าหมายและจุดประสงคว์ า่ เป็ นการเรียนรู้ในลกั ษณะใด เช่น การเรียนรู้เน้ือหา การเรียนรู้ทกั ษะ หรือการเรียนรู้ที่เป็นความตอ้ งการเฉพาะข้นั ที่ 2 การออกแบบ กิจกรรมที่ปฏิบตั ิในข้นั น้ี ไดแ้ ก่1) การกาหนดเป้ าหมาย จุดประสงคท์ ่ีสามารถสงั เกตได้ วดั ได้2) การจดั ลาดบั เป้ าหมายและจุดประสงคใ์ หง้ ่ายตอ่ การเรียนและการปฏิบตั ิ3) การวางแผนการประเมินผลการเรียนรู้และการปฏิบตั ิ4) การพิจารณากลวิธีการเรียนการสอนให้เหมาะกบั เน้ือหา การจดั กลุ่มการทากิจกรรมของผเู้ รียนในลกั ษณะต่าง ๆ ในลกั ษณะกลุ่มและรายบุคคล5) การคดั เลือกสื่อการเรียนการสอนข้นั ที่ 3 การพฒั นา กิจกรรมท่ีปฏิบตั ิในข้นั น้ี ไดแ้ ก่1) การสร้างส่ือ/กิจกรรมหรือโปรแกรมการเรียนการสอนตามท่ีไดอ้ อกแบบไว้2) การทดสอบ (try out) สื่อ/กิจกรรมหรือโปรแกรมการเรียนการสอนกบั กลุ่มเป้ าหมาย3) การปรับปรุงส่ือ/กิจกรรมหรือโปรแกรมการเรียนการสอนข้นั ท่ี 4 การนาไปใช้ กิจกรรมที่ปฏิบตั ิในข้นั น้ี ไดแ้ ก่ 1) การเผยแพร่ส่ือ/กิจกรรมหรือโปรแกรมการเรียนการสอนท่ีสร้างข้ึน เช่น การติดต้งั การซ่อมบารุงส่ือ การจดั อบรมใหค้ รูรู้วธิ ีการใชส้ ่ือ/กิจกรรมหรือโปรแกรมการเรียนการสอนท่ีสร้างข้ึนการใหค้ าแนะนาและนิเทศการใชส้ ื่อ/กิจกรรมหรือโปรแกรมการเรียนการสอน 2) การให้ความช่วยเหลือ สนบั สนุนให้ครูยอมรับส่ือ/กิจกรรมหรือโปรแกรมการเรียนการสอนที่สร้างข้ึนและนาส่ือไปใช้ข้นั ท่ี 5 การประเมิน กิจกรรมท่ีปฏิบตั ิในข้นั น้ี ไดแ้ ก่ 1) การสร้างเครื่องมือเพ่ือประเมินส่ือ/กิจกรรมหรือโปรแกรมการเรียนการสอนตามจุดประสงคท์ ่ีกาหนดไว้ 2) การทดสอบ (try-out) ส่ือ/กิจกรรมหรือโปรแกรมการเรียนการสอนและเคร่ืองมือวดัประเมินผลกบั กลุ่มตวั อย่าง เพื่อวินิจฉยั ผลการเรียนรู้ท่ีเกิดจากผเู้ รียน และรวบรวมขอ้ มูลเก่ียวกบัความสาเร็จและความลม้ เหลวในการใชโ้ ปรแกรมการเรียนการสอนที่สร้างข้ึนเพ่ือนาไปปรับปรุงใหส้ มบรู ณ์ 85
3) การประเมินภายหลงั การนาสื่อ/กิจกรรมหรือโปรแกรมการเรียนการสอนไปใชก้ บั กลุ่มประชากร4. ฐำนข้อมูล (Database) เป็ นที่เก็บรวบรวมขอ้ มูลและความสัมพนั ธ์ระหว่างขอ้ มูลอยา่ งมีแบบแผนเป็ นระบบรวมขององค์กรใด ๆ เป็ นการบริหารจดั การขอ้ มูลโดยโปรแกรมประยุกต์ด้านการจดั การฐานขอ้ มูลท้งั หลาย ต้งั แต่ข้นั ตอนการนาเขา้ การประมวลผล การจดั เก็บ การสืบคน้ การแสดงผลสารสนเทศตลอดจนการประยกุ ตใ์ ชง้ านตามเงื่อนไขของผใู้ ชก้ ารจดั การขอ้ มูลใหเ้ ป็นระบบฐานขอ้ มูล จะส่งผลการจดั การสารสนเทศขององค์กรมีลกั ษณะที่ดีหลายประการคือ ลดการเก็บขอ้ มูลที่ซ้าซ้อนรักษาความถูกตอ้ งของขอ้ มูลการป้ องกนั และรักษาความปลอดภยั ใหก้ บั ขอ้ มูลทาไดอ้ ยา่ งสะดวกสามารถใชข้ อ้ มลู ร่วมกนั ไดซ้ ่ึงระบบฐานขอ้ มูลประกอบดว้ ย 3 องคป์ ระกอบหลกั คือ ฐานขอ้ มูล (Database)ระบบจดั การฐานขอ้ มลู (Database Management System: DBMS) และบุคลากร (People)โครงสร้างระบบขอ้ มลู แบบลาดบั ช้นั (Hierarchy)พ้ืนฐานของโครงสร้างระบบขอ้ มูลท่ีดี โดยส่วนใหญ่จะจดั อย่ใู นรูปของลาดบั ช้นั เน่ืองจากมีการแบ่งแยกกลุ่มอย่างชดั เจน อีกท้งั ความสัมพนั ธ์ระหวา่ งช้นั ขอ้ มูลก็เป็ นส่ิงท่ีเราคุน้ เคย และไม่ยากเกินจะเขา้ ใจ เช่น ในท่ีทางานท่ีคุณมีหวั หนา้ รองหวั หนา้ อยชู่ ้นั ตน้ ๆ ของโครงสร้าง ต่อจากน้นัก็เป็นพนกั งาน ลูกนอ้ ง ฯลฯ รองลงไปเรื่อย ๆ รูปที่ 2.12 โครงสร้างระบบขอ้ มลู แบบลาดบั ช้นัเน่ืองจากความแพร่หลายในการใช้โครงสร้างระบบข้อมูลแบบน้ี เมื่อเรานามาใช้กบั ขอ้ มูลในเวบ็ ไซตก์ ็จะทาให้ผูใ้ ช้เขา้ ใจโครงสร้างของขอ้ มูลที่ซบั ซ้อนในเวบ็ ไดง้ ่ายและรวดเร็ว ซ่ึงถือเป็ นโครงสร้างที่เหมาะสมกบั ขอ้ มูลบนเวบ็ มาก เพราะในทุกวนั ๆ เว็บจะเริ่มจากหนา้ โฮมเพจก่อนเสมอ แลว้ จึงแบ่งแยกออกเป็ นส่วนยอ่ ย ๆ และดว้ ยวิธีการจดั ลาดบั ช้นั จากบนลงล่าง ทาให้คุณสามารถกาหนดขอบเขตของเน้ือหาภายในเวบ็ ไซตไ์ ดอ้ ยา่ งรวดเร็ว โดยเริ่มจากการกาหนดหัวขอ้หลกั ของขอ้ มูล แลว้ จึงเลือกใชแ้ บบแผนระบบขอ้ มูล (Organizational scheme) ที่เหมาะสมกบัขอ้ มลู ของคุณที่สุด 86
หลกั การออกแบบโครงสร้างระบบขอ้ มลู แบบลาดบั ช้นัในการออกแบบโครงสร้างระบบขอ้ มลู แบบลาดบั ช้นั ควรยดึ หลกั 2 ประการ ดงั น้ี 1.แต่ละกลุ่มขอ้ มูลควรแยกจากกนั อยา่ งชดั เจน ไม่มีส่วนใดร่วมหรือซ้ากนั ในแบบแผนระบบขอ้ มูลประเภทหน่ึง ๆ คุณมีหนา้ ที่ในการสร้างความสมดุลระหวา่ งการรวมหรือไม่รวมรายการลงในกลุ่มใดกลุ่ม 2.การพิจารณาถึงความกวา้ งและความลึกของโครงสร้างระบบขอ้ มูล ความกวา้ งในที่น้ีหมายถึงจานวนรายการที่มีอยใู่ นแต่ละช้นั ขอ้ มูล ส่วนความลึก หมายถึง จานวนช้นั ของขอ้ มูลในโครงสร้าง ถา้ โครงสร้างขอ้ มูลมีลกั ษณะแคบและลึกมาก ผใู้ ชจ้ ะตอ้ งคลิกหลายคร้ังกวา่ จะเขา้ ถึงส่ิงที่ตอ้ งการ ในทางตรงกนั ขา้ มถา้ โครงสร้างระบบขอ้ มูลมีลกั ษณะกวา้ งและต้ืนมาก ผใู้ ชจ้ ะตอ้ งเผชิญกบั รายการท่ีมีใหเ้ ลือกจานวนมากในแตล่ ะเมนูสญั ลกั ษณ์ระบบกระแสขอ้ มลู 87
สญั ลกั ษณ์ ( Symbol ) ความหมาย ( Symbol Name ) Source Destination สัญลกั ษณ์ส่ิงท่ีอยภู่ ายนอกระบบ Process สญั ลกั ษณ์การประมวลผล Data Store สัญลกั ษณ์การเก็บขอ้ มลู Data Flow สญั ลกั ษณ์เส้นทางการไหลของขอ้ มลู ตำรำงท่ี 2.2 แสดงสัญลกั ษณ์ระบบกระแสขอ้ มลู แผนภาพแสดงการไหลกระแสของขอ้ มูล (Data Flow Diagram: DFD) Data Flow Diagramเป็ นเคร่ืองมือของนักวิเคราะห์ระบบท่ีช่วยให้สามารถเข้าใจกระบวนการท างานของแต่ละหน่วยงานซ่ึงทราบถึงการรับส่งขอ้ มูลการประสานงานระหวา่ งกิจกรรมต่างๆ ในการดาเนินงานซ่ึงเป็ นแบบจาลองของระบบแสดงถึงการไหลของขอ้ มูลท้งั INPUT และ OUTPUTระหวา่ งระบบกบัแหล่งกาเนิดรวมท้งั ปลายทางของการส่งขอ้ มูลซ่ึงอาจเป็นแผนก บุคคล หรือระบบอื่นโดยข้ึนอยกู่ บัระบบงานและการทางานประสานงานภายในระบบน้นั นอกจากน้ียงั ช่วยใหร้ ู้ถึงความตอ้ งการขอ้ มูลและขอ้ บกพร่อง(ปัญหา)ในระบบงานเดิมเพือ่ ใชใ้ นการออกแบบการปฏิบตั ิงานในระบบใหม่ (DataFlow Diagram (DFD)เป็ นภาพแสดงการเปลี่ยนแปลงขอ้ มูลในขณะไหลผ่านกระบวนการทางานต่าง ๆของระบบสารสนเทศDFDจึงเป็ นโครงสร้างของระบบงานสารสนเทศท่ีส่ือเขา้ ใจในการทางานของระบบงานในรูปแบบของความสัมพนั ธ์ระหวา่ งกระแสขอ้ มูลและโปรเซสDFDภายในDFDทาใหเ้ ราเขา้ ใจส่วนประกอบของงาน เขา้ ใจการใชข้ อ้ มูลในแต่ละโปรเซส และขอ้ มูลที่เป็ นผล 88
จากการทางานโปรเซสโดยโครงสร้างจะเร่ิมจากระดบั สูงสุดซ่ึงจะแสดงส่วนท่ีอยภู่ ายนอกระบบส่วนน้ีสาคญั เพราะวา่ เป็นส่วนที่บอกวา่ ระบบน้นั ๆ ไดร้ ับขอ้ มลู มาจากที่ใด และผลลพั ธ์ต่าง ๆ ท่ีใดและผลลพั ธ์ต่าง ๆ ถูกส่งไปท่ีใดบา้ งDFD ในระดบั ลึกลงไปจะไม่แสดงส่ิงที่อยนู่ อกระบบ คือ ไม่มีสิ่งน้ีเป็ นส่วนประกอบโดยปกติ จะวางแหล่งท่ีมาของขอ้ มูลไวท้ างซ้ายมือของ DFDและส่วนภายนอกท่ีรับผลลพั ธ์ของระบบจะอยู่ทางขวามือ ท้งั น้ีเพื่อให้อยใู่ นรูปแบบของกระแสขอ้ มูลจากซ้ายไปขวา แต่หลาย ๆ กรณีน้ี เราจะวางขอ้ มูลและผลลพั ธ์ไวใ้ นท่ีเหมาะสมซ่ึงอาจจะอยู่เหนือโปรเซสหรือใตโ้ ปรเซสก็ไดD้ FDระดบั รองลงมา (Low-Level Data Flow Diagram)คือส่วนท่ีแสดงระบบยอ่ ยลงมาจากDFDที่กล่าวมาหรือเรียกวา่ ระดบั แม่เมื่อระดบั แม่ไม่สามารถแสดงรายละเอียดท้งั หมดได้เป็ นตอ้ งแตกLevelยอ่ ยออกมาเพื่อแสดงการประมวลผลน้นั ตามข้นั ตอนการทางานให้ชดั เจนยง่ิ ข้ึนควำมหมำยของโครงสร้ำงข้อมูล โครงสร้างขอ้ มลู (Data Structure) คือ ความสัมพนั ธ์ระหวา่ งขอ้ มูลที่อยใู่ นโครงสร้างน้นั ๆรวมท้งั กระบวนการในการจดั การขอ้ มูลในโครงสร้าง หรือ การจดั เตรียมรูปแบบการเก็บขอ้ มูลในหน่วยความจาอยา่ งมีระเบียบแบบแผน การแทนขอ้ มูลใหอ้ ยใู่ นรูปแบบท่ีถูกตอ้ ง ตลอดจนกรรมวธิ ีการเข้าถึงข้อมูลในโครงสร้างให้เป็ นไปอย่างมีประสิทธิภาพ การจัดระบบโครงสร้างข้อมูล(Information Architecture) ในกระบวนการพฒั นาเวบ็ ไซตท์ ่ีกาลงั จะไดศ้ ึกษาต่อไปน้ีอาศยั หลกั การจดั ระบบโครงสร้างขอ้ มลู ท่ีเรียกวา่ Information Architecture อยใู่ นหลายๆส่วน ต้งั แต่ข้นั แรกจนถึงข้นั ที่ไดเ้ ป็ นรูปแบบโครงสร้างสุดทา้ ย (Final Architecture Plan) ซ่ึงถือเป็ นกระบวนการที่สาคญัมากที่จะทาใหเ้ วบ็ ไซตบ์ รรลุเป้ าหมายท่ีต้งั ไว้ การจดั ระบบโครงสร้างขอ้ มลู การพจิ ารณาวา่ เวบ็ ไซต์ควรจะมีขอ้ มลู และการทางานใดบา้ ง ดว้ ยการสร้างเป็ นแผนผงั โครงสร้างก่อนที่จะเริ่มลงมือพฒั นาเวบ็ เพจ โดยเริ่มจากกการกาหนดเป้ าหมายเวบ็ ไซต์และกลุ่มผใู้ ชเ้ ป้ าหมายต่อมาก็พิจารณาเน้ือหาและการใชง้ านที่จาเป็ นแลว้ นามาจดั กลุ่มให้เป็ นระบบ จากน้นั ก็ถึงเวลาในการออกแบบโครงสร้างขอ้ มูลในหนา้ เวบ็ ใหพ้ ร้อมที่จะนาไปออกแบบกราฟิ กและหนา้ ตาใหส้ มบูรณ์ต่อไป 89
โครงสร้างขอ้ มูลอลั กอริทึมและทฤษฏีท่ีเกี่ยวขอ้ งสัญลกั ษณ์ในการออกแบบโครงสร้างขอ้ มลูสญั ลกั ษณ์ ช่ือเรียก ความหมาย Termination สญั ลกั ษณ์แทนจุดเร่ิมตน้ และสิ้นสุด Process สัญลกั ษณ์กระบวนการต่าง ๆ เช่น Decision การประกาศตวั แปรการบวก เป็ นตน้ สญั ลกั ษณ์เงื่อนไข Data สญั ลกั ษณ์ติดต่อกบั ผูใ้ ชโ้ ดยการรับ ขอ้ มูลและแสดงขอ้ มูล Manual Input สญั ลกั ษณ์การรับขอ้ มูลจากผใู้ ช้ Display สัญลักษณ์การแสดงผลออกจาก Predefined จอภาพ Process สญั ลกั ษณ์ระบุการทางานยอ่ ย Connect หรือฟังกช์ นั ยอ่ ย Arrow สญั ลกั ษณ์จุดเช่ือม สญั ลกั ษณ์เสน้ ทางการดาเนินงาน ตำรำงที่ 2.3 การใชส้ ัญลกั ษณ์ในการออกแบบฐานขอ้ มลู 90
โครงกำรทเี่ กี่ยวข้อง นางสาวเจนจิรา ชื่นสุวรรณ และนางสาวกญั ญาณี ใจเพ็ชร์ ปี การศึกษา(2558)โครงการระบบขายสินคา้ ออนไลน์ประเภทกระเป๋ าชาลแอนด์คีธ มีวตั ถุประสงค์เพ่ือเป็ นแนวทางการขายสินคา้ ออนไลนผ์ า่ นอินเทอร์เน็ต ก่อใหเ้ กิดความสะดวกสบายท้งั ผขู้ ายและผซู้ ้ือ นายชยั ธชั บารุงดี และนางสาวศรสวรรค์ สวา่ งดาว ปี การศึกษา(2558) โครงการระบบขานสินคา้ อุปกรณ์กีฬาทางน้า ในการพฒั นาโครงการน้ี ผพู้ ฒั นาไดน้ าสาระความรู้ท่ีน่าสนใจเกี่ยวกบัสิ่งของท่ีใช้ในการแข่งขนั กีฬาทางน้า เพ่ือตอบสนองความตอ้ งการขงผูท้ ี่ชื่นชอบกีฬาทางน้าและอุปกรณ์กีฬาทางน้า เช่น แวน่ ตากนั น้า เชือกเล่นสกี กระดานโตค้ ลื่น นางสาววลิ าสินี ศรีบาง และนายอานนท์ พรมพิราม ปี การศึกษา(2558) โครงการระบบการขายเบเกอร์รี่ออนไลน์ ผจู้ ดั ทาไดต้ ระหนกั ถึงความสาคญั ของการซ้ือสินคา้ ในการพฒั นาโปรแกรมให้ง่ายต่อการใช้งานเพ่ือให้ทุกคนใช้งานไดส้ ะดวกสบายและรวดเร็ว ดงั น้นั ผูจ้ ดั ทาจึงได้จดั ทาระบบขายเบเกอร์ร่ีออนไลนเ์ พื่อตอบสนองความตอ้ งการและมุ่งตรงไปสู่กลุ่มลูกคา้ ตามแบบท่ีท่านตอ้ งการ2.4 กำรนำระบบคอมพวิ เตอร์ในกำรใช้งำน 1. นาคอมพิวเตอร์มาใช้ในการตกแต่งรูปภาพประกอบเว็บไซต์โดยใช้โปรแกรม Adobe Photoshop CS5.1 2. นาคอมพวิ เตอร์มาใชใ้ นการสร้างเวบ็ ไซตโ์ ดยใชโ้ ปรแกรม Macromedia Dreamweaver 3. นาคอมพวิ เตอร์เขา้ มาใชใ้ นการทา Banner และ Logo 4. นาคอมพวิ เตอร์มาใชใ้ นการคน้ หาขอ้ มูลทาง Internet 5. นาคอมพวิ เตอร์เขา้ มานาเสนอขอ้ มูลในรูปแบบของเวบ็ ไซต์ 6. นาคอมพวิ เตอร์มาใชใ้ นการเกบ็ และ สร้างฐานขอ้ มลู โปรแกรม Server Appserv 2.5.10 91
บทที่ 3 กำรออกแบบระบบงำนด้วยคอมพวิ เตอร์3.1 กำรออกแบบระบบงำน (Flowchart) N Y N Y รูปท่ี 3.1 Flowchart 92
1. Flowchart กำรสมัครสมำชิก เริ่มตน้ สมคั รสมาชิก Y สมคั รสมาชิก กรอกขอ้ มูล ขอ้ มูลซ้ากบั ใน ระบบ N บนั ทึกขอ้ มูล แสดงขอ้ มลู การสมคั ร สมาชิก จบการทางานรูปท่ี 3.2 Flowchart การสมคั รสมาชิก 93
2. Flowchart กำรเข้ำสู่ระบบ เริ่มตน้ เขา้ สู่ระบบ กรอกขอ้ มลู ตรวจสอบ N ขอ้ มูลสมาชิก Y บนั ทึกขอ้ มูล แสดงขอ้ มลู การสมคั ร สมาชิก จบการทางาน รูปท่ี 3.3 Flowchart การเขา้ สู่ระบบ 94
3.2กำรออกแบบแผนภำพบริบท (Context Diagram) ขอ้ มูลรายงานการชาระเงิน ขอ้ มลู รายงานการสง่ั ซ้ือ ขอ้ มูลชาระเงิน ขอ้ มลู สงั่ ซ้ือ ขอ้ มูลรายงานรายละเอียด ขอ้ มูลรายละเอียดสินคา้ ขอ้ มูลราสยิงนาคนา้ สมาชิก ขอ้ มลู สมาชิก 0ลูกคา้ ระบบขายเส้ือผา้ เดก็ ออนไลน์ ผดู้ ูแลระบบ Baby Kite Shop ขอ้ มูลรายงานสมาชิก ขอ้ มลู สมาชิก ขอ้ มูลรายการสินคา้ ขอ้ มลู รายงานรายละเอียด ขอ้ มูลวิธีการชาระเงิน ขอ้ มลู รายสงาินนคกา้ ารชาระเงิน ขอ้ มูลใบเสร็จรับเงิน ขอ้ มลู รายงานใบเสร็จรับเงิน รูปที่ 3.4 การออกแบบแผนภาพบริบท (Context Diagram) 95
3.3กำรออกแบบแผนภำพควำมสัมพนั ธ์ของข้อมูล (Entity Relationship Diagram) รหสั สินคา้ ช่ือสินคา้ รหสั สมาชิก ราคาสินคา้ รหสั ลูกคา้ รูปสินคา้ ชื่อ-นามสกลุ ราคาสินคา้ M ลาดบั สินคา้ สมาชิก ที่อยู่รหสั สินคา้ สินคา้ M ช่ือสินคา้ การสั่งซ้ือ อีเมล์ ก ช่ือผเู้ ขา้ ใช้ เบอร์โทร เพศ M มีสินคา้ 1 ชนิดช่ือสินคา้ รหสั ประเภทสินคา้ รูปที่3.5 E-R Diagramระบบการขายสินคา้ ออนไลน์ประเภทเส้ือผา้ เด็ก 96
3.4 พจนำนุกรมข้อมูล (Data Dictionary)ออกแบบฐานขอ้ มูล ระบบขายสินคา้ ออนไลน์ประเภทเส้ือยดื ดงั น้ี1. ตารางขอ้ มลู สมาชิก (tb_member)Field Name Type Field Side Description หมำยเหตุ PKชื่อฟิ ลด์ ชนิดของข้อมูล ขนำดฟิ ลด์ ใช้เกบ็ ข้อมูลid int 11 รหสั ลูกคา้username varchar 20 ชื่อผเู้ ขา้ ใช้password varchar 30 รหสั ผเู้ ขา้ ใช้name varchar 60 ชื่อลูกคา้sex varchar 5 เพศemail varchar 30 อีเมล์telephone varchar 18 โทรศพั ท์address text ที่อยู่reg_date date วนั ท่ี ตำรำงท่ี 3.1 ตารางขอ้ มลู สมาชิก2. ตารางขอ้ มูลการสง่ั ซ้ือ (tb_order)Field Name Type Field Side Description หมำยเหตุ PKช่ือฟิ ลด์ ชนิดของข้อมูล ขนำดฟิ ลด์ ใช้เกบ็ ข้อมูลId_oreder Int 11 รหสั ผสู้ ัง่ ซ้ือName_order varchar 60 ชื่อผสู้ ง่ั ซ้ือEmail_order varchar 60 อีเมลผ์ สู้ ่งั ซ้ือTel_order varchar 20 เบอร์ผสู้ ่ังซ้ือAddress_order text ที่อยผู่ สู้ ่งั ซ้ือTotal_order int 11 ยอดรวมการ สั่งซ้ือDate_order date วนั ท่ีสง่ั ซ้ือ ตำรำงที่ 3.2 ตารางขอ้ มลู การส่ังซ้ือ 97
3. ตารางขอ้ มลู รายละเอียดสั่งซ้ือ (tb_order_detail)Field Name Type Field Side Description หมำยเหตุ PKชื่อฟิ ลด์ ชนิดของข้อมูล ขนำดฟิ ลด์ ใช้เกบ็ ข้อมูลref_id_order int 11 รหสั สินคา้ref_id_prd int 11 ชื่อสินคา้number int 11 ลาดบั สินคา้price int 11 ราคาสินคา้ ตำรำงที่ 3.3 ตารางขอ้ มูลรายละเอียดสงั่ ซ้ือ4. ตารางขอ้ มลู สินคา้ (tb_product)Field Name Type Field Side Description หมำยเหตุ PKชื่อฟิ ลด์ ชนิดของข้อมูล ขนำดฟิ ลด์ ใช้เกบ็ ข้อมูลid_prd int 11 รหสั สินคา้name_prd varchar 60 ชื่อสินคา้ref_id_prd int 11 อา้ งอิงลาดบั สินคา้detail_prd text รายละเอียดสินคา้price_prd int 11 ราคาสินคา้proto_prd varchar 50 รูปสินคา้ ตำรำงที่ 3.4 ตารางขอ้ มลู สินคา้5. ตารางขอ้ มูลประเภทสินคา้ (tb_type)Field Name Type Field Side Description หมำยเหตุ PKชื่อฟิ ลด์ ชนิดของข้อมูล ขนำดฟิ ลด์ ใช้เกบ็ ข้อมูลid_type int 5 รหสั ประเภท สินคา้name_type varchar 60 ชื่อสินคา้ ตำรำงท่ี 3.5 ตารางขอ้ มลู ประเภทสินคา้ 98
3.5 แผนภำพกำรไหลของข้อมูล (Data Flow Diagram)1. DataFlow Diagram Level 1 D1 แฟ้ มลูกคา้ลูกคา้ ขอ้ มลู ลูกคา้ 1 จดั เก็บขอ้ มูล รายงานการสมคั ร รายงานการสมคั รรายงานการ สมาชิก ผดู้ ูแลระบบเป็ นสมาชิก ชื่อผดู้ ูแลระบบ แฟ้ มลูกคา้ ขอ้ มลู ลูกคา้ D1 ชื่อผใู้ ช/้ รหสั ผา่ น 2 ตรวจสอบยนื ยนั การเขา้ สู่ระบบ เขา้ สู่ระบบ ชื่อผใู้ ช/้ รหสั ผา่ น ยนื ยนั การตรวจสอบ สงั่ ซ้ือสินคา้ ขอ้ มูลลูกคา้ D2 แฟ้ มขอ้ มลู สินคา้ แฟ้ มขอ้ มลู การสง่ั ซ้ือรายงานการสง่ั ซ้ือ 3 คน้ หารหสั สินคา้ คียร์ หสั สินคา้ สง่ั ซ้ือสินคา้ รายละเอียดสินคา้รายละเอียดสินคา้ รายงานการชาระเงิน ชาระเงิน รายงานการสั่งซ้ือ ใบเสร็จรับเงิน ขอ้ มลู การสง่ั ซ้ือ D3 4 คน้ หารายการสั่งซ้ือ รายงาน รายการสงั่ ซ้ือสินคา้ รายงานการสั่งซ้ือสินคา้ คน้ หารายการส่ังซ้ือรูปท่ี 3.6Dataflow DiagramLevel1 ระบบการขายเส้ือผา้ เด็ก 99
2. Data Flow Diagram Level 1 Process 1 ขอ้ มลู ลูกคา้ 1.1ลูกคา้ คียข์ อ้ มลู สมคั รสมาชิก 1.2 ขอ้ มลู ลูกคา้ D1 แฟ้ มลูกคา้ บนั ทึกขอ้ มลู การสมคั ร 1.3 ขอ้ มลู ลูกคา้ ผดู้ ูแลระบบ แสดงขอ้ มูลสมาชิกรูปท่ี 3.7Data Flow Diagram Level 1 Process 1 ระบบ สมาชิก 100
3. Data Flow Diagram Level 1 Process 2 ขอ้ มูลลูกคา้ 2.1 ขอ้ มูลผดู้ ูแลระบบลูกคา้ คียข์ อ้ มลู เขา้ สู่ระบบ 1.2 ขอ้ มูลลูกคา้ D1 แฟ้ มลูกคา้ ตรวจสอบการเขา้ ระบบแสดงผลการเขา้ สู่ 1.3 แสดงผลการเขา้ สู่ระบบ ผดู้ ูแลระบบระบบ แสดงผลการเขา้ สู่ระบบรูปที่ 3.8Data Flow Diagram Level 1 Process 2 ระบบ สมาชิก 101
4. Data Flow Diagram Level 1 Process 3ลูกคา้ 3.1 ขอ้ มลู สินคา้ คียร์ หสั สินคา้ ขอ้ มูลใบเสร็จ ขอ้ มูลสินคา้ 3.2 ขอ้ มูลสินคา้ D2 แฟ้ มขอ้ มูลสินคา้ คน้ หารหสั สินคา้ ขอ้ มลู สินคา้ 3.3 รายการสินคา้ แสดงรายการสินคา้ ขอ้ มูลสินคา้ 3.4 สง่ั ซ้ือสินคา้ ขอ้ มลู สินคา้ D3 แฟ้ มขอ้ มูลการสงั่ ซ้ือ ขอ้ มูลการสงั่ ซ้ือ 3.5 บนั ทึกสินคา้ ขอ้ มลู การสง่ั ซ้ือ 3.6 ชาระเงิน ขอ้ มูลการชาระเงิน 3.7 ใบเสร็จรูปที่ 3.9Data Flow Diagram Level 1 Process 3ระบบส่งั ซ้ือสินคา้ 102
5. Dataflow Diagram Level 1 Process 4ผดู้ ูแลระบบ ขอ้ มูล 4.1 การสงั่ ซ้ือ เลือกรายการ 4.2 ขอ้ มลู การสงั่ ซ้ือ แฟ้ มขอ้ มลู การสง่ั ซ้ือ คน้ หาขอ้ มูล ขอ้ มลู การสงั่ ซ้ือ D2 ขอ้ มลู การสง่ั ซ้ือ 4.3 ยนื ยนั การคน้ หา ขอ้ มูลการสงั่ ซ้ือขอ้ มลู การสง่ั ซ้ือ 4.4 แสดงรายการ รูปที่ 3.10Data Flow Diagram Level 1Process 4แสดงผลรายงาน 103
3.6 กำรดำเนินเนือ้ เรื่อง Site Map หนา้ แรก หนา้ หลกั Login สินคา้ วธิ ีการสัง่ ซ้ือ วธิ ีการชาระเงิน สาระน่ารู้ ติดต่อเรา ของใช้ แบบทดสอบ คุณแม่ 1104 2 3 4 รูปท่ี 3.11การออกแบบ Site Map เสิ้อ 1 2 3 4
3.7 กำรออกแบบบทนำเนินเร่ือง (Story Board รูปที่ 3.12 แสดงหนา้ Index1พอกดเขา้ มาหนา้ แรกจะเจอกบั ระบบ login ก่อนเขา้ สู่บทเรียนรูปท่ี 3.13 แสดงหนา้ login 105
ถา้ ยงั ไมม่ ีสมาชิกกดป่ ุมที่สมคั รสมาชิก รูปท่ี 3.14 แสดงหนา้ สมคั รสมาชิกถา้ Loginสาเร็จแลว้ จะรันเขา้ มาสู่หนา้ แรกของเวบ็ ไซต์รูปท่ี 3.15 แสดงหนา้ หลกั 106
กดที่ป่ ุมสินคา้ จะแสดงหมวดหมู่และสินคา้ ใหม่ รูปที่ 3.16 แสดงหนา้ แบบฝึกหดั ก่อนเรียนสง่ั ซ้ือเสร็จสินคา้ จะไปเก็บอยใู่ นฐานขอ้ มลูรูปท่ี 3.17 แสดงการส่งซ้ือเรียบร้อย 107
การส่ังซ้ือสินคา้ รูปท่ี 3.18 แสดงหนา้ การส่งั ซ้ือสินคา้วธิ ีการชาระเงิน รูปท่ี 3.19 แสดงหนา้ วธิ ีการชาระเงิน 108
พอกดที่ป่ ุมผจู้ ดั ทา จะเจอหนา้ ผจู้ ดั ทาแบบน้ี รูปที่ 3.20 แสดงหนา้ ผจู้ ดั ทา3.5 กำรออกแบบสิ่งนำเข้ำ(Input Data) และส่ิงนำออก(Output Data)กำรออกแบบส่ิงนำเข้ำ(Input Data)1.การนาเอาระบบล็อคอินเขา้ มาใชง้ าน2.การนาฐานขอ้ มลู มาเก่ียวขอ้ ง3.มีการนารายละเอียดสินคา้ รู และราคา4.การโอนเงินผา่ นธนาคาร5.การส่งั ซ้ือ6.ผจู้ ดั ทากำรออกแบบสิ่งนำออก(Output Design)1. หนา้ จอคอมพิวเตอร์แสดงผลงานที่ทาเสร็จแลว้2. เคร่ืองฉาย Projector นาเสนอเพื่อสอบวชิ าโครงการ3.ใช้ speaker ในการออกเสียง4. เครื่องเล่น DVD/VCD ในการแสดงผลงาน 109
บทท4ี่ กำรพฒั นำระบบส่ือกำรขำยออนไลน์ เรื่อง ขำยเสื้อผ้ำเดก็ (Baby kit s shop)4.1 เคร่ืองมอื และอปุ กรณ์ทใี่ ช้ 1. Intel(R) Core(TM) 2 Duo CPU E8400 @ 3.00GHz 2.99 GHz 2. GeForce GT 610 3. HDD 1 TB 4. Notebook ASUS 5. Mouse NUBWO 6. Keyboard NUBWO 7. Flash drive Sandisk8 GB4.2 โปรแกรมท้งั หมดทใ่ี ช้ในกำรพฒั นำ 1. โปรแกรม Adobe Dreamweaver CS6 ใชใ้ นการทาเวบ็ ไซต์ 2. โปรแกรม AdobePhotoshop CS6 ใชใ้ นการตกแต่งรูปภาพ 3. โปรแกรม Appserv 2.5.10 ใชใ้ นการเชื่อมตอ่ ฐานขอ้ มูล 4. โปรแกรม Microsoft Office Word 2010 ใชใ้ นการทาเอกสาร 5. โปรแกรม Microsoft OfficePowerPoint 2010 ใชใ้ นการทางานนาเสนอ 110
.3 กำรตดิ ต้งั โปรแกรมและระบบ 1.โปรแกรม AppserverVersiocn 2.5.10 หนา้ จอแสดงการติดต้งั โปรแกรม AppserverVersiocn 2.5.10ใหค้ ลิกท่ี ป่ ุม Nextเพอ่ื เขา้ สู่ข้นั ตอนการติดต้งั รูปท่ี 4.1 แสดงหนา้ จอการติดต้งั 111
Search
