Introduction to Web Design

Slides:



Advertisements
งานนำเสนอที่คล้ายกัน
บทที่ 1 รู้จักกับการออกแบบเว็บ ไซท์. รู้จักกับการออกแบบเว็บไซท์ ความสำคัญของการออกแบบเว็บไซท์ สร้างความได้เปรียบเหนือคู่แข่ง การออกแบบเว็บไซท์ที่ดี ออกแบบให้ตรงกับเป้าหมายและลักษณะ.
Advertisements

บทที่ 3 การบริหารพนักงานขาย
ระบบสารสนเทศทางธุรกิจ (Business Information Systems)
Medicine คลังยา.
การจัดทำเว็บไซต์สำเร็จรูปด้วยโปรแกรม Joomla!
เป็นหลักสำคัญในการนำเสนอเนื้อหา ของบทเรียนคอมพิวเตอร์ช่วยสอนก็คือ ควร นำเสนอภาพที่เกี่ยวข้องกับเนื้อหา ประกอบ กับคำอธิบายสั้นๆ ง่ายๆ แต่ได้ใจความ การใช้ภาพประกอบจะทำให้ผู้เรียน.
คอมพิวเตอร์ช่วยสอน (CAI)
เครื่องชี้วัดคุณภาพ วัตถุประสงค์: เพื่อให้ผู้เรียน
Mind Mapping อ. พิมพ์ชนก หาคำ 23 เมษายน 2556.
กระบวนการถ่ายทอดความรู้
และสร้างเว็บไซต์ประเภทCMS
นางวราพันธ์ ลังกาวงศ์ ผู้อำนวยการกลุ่มนโยบายและแผน.
การเสริมสร้างความรู้ความเข้าใจ เกี่ยวกับระบบการควบคุมภายใน ระดับสถานศึกษา ประจำปี 2559.
ยินดีต้อนรับผู้เข้าอบรมการพัฒนาเว็บไซต์ สำนักงานการปฏิรูปที่ดินเพื่อเกษตรกรรม.
การพัฒนาโปรแกรมระบบ รายงาน หน่วยงานเวชสารสนเทศ หน่วยงานเวชสารสนเทศ กลุ่มพัฒนาระบบบริการ สุขภาพโรงพยาบาลสุโขทัย.
นาย สรวิศ เตธัญญวรากูล ปวช.3/2 นาย ศิวกร มาลี ปวช.3/2.
การพัฒนาบทเรียนคอมพิวเตอร์ช่วยสอน เรื่อง หลักการทำงานของคอมพิวเตอร์ วิชาคอมพิวเตอร์พื้นฐาน สำหรับนักเรียนชั้นมัธยมศึกษาปีที่ 1 โรงเรียนเฉลิมราชประชาอุทิศ.
WEB DESIGN การออกแบบเว็บไซต์. ความสำคัญและหลักการ ออกแบบเว็บไซต์
1. รู้ถึงความต้องการของตัวเอง ก่อนก่อนเริ่มต้นออกแบบ เมื่อคุณเริ่มคิดจะออกแบบโบรชัวร์ออกมาอย่างไร ให้เริ่มต้น สอบถามลูกค้าของคุณก่อนว่าทำไม เค้าต้องการโบร์ชัวร์
บทที่ 3 นักวิเคราะห์ระบบและการ วิเคราะห์ระบบ. 1. นักวิเคราะห์ระบบ (System Analysis) 1.1 ความหมายของนักวิเคราะห์ระบบ นักวิเคราะห์ระบบ (System Analysis:
ปรานอม ประทีปทวี 25/09/591 หน้าที่ของครูผู้นิเทศ สพม.5.
ซอร์ฟแวร์ ( Software ). Microsoft excel Microsoft excel Microsoft power point.. Link Link.
๕ เรื่องเด่นในร่างรัฐธรรมนูญ
แผนยุทธศาสตร์การคุ้มครองผู้บริโภคแห่งชาติ ฉบับที่ 1 (พ.ศ )
ง21101 การงานอาชีพและเทคโนโลยี ม. 1 เจตคติต่อการประกอบอาชีพ
โดย ศุภกฤษฏิ์ นิวัฒนากูล
โครงงาน(Project) เรื่อง ระบบร้านเช่าหนังสือออนไลน์
การแพร่กระจายนวัตกรรม Diffusion of Innovation
หน่วยที่ 1 ข้อมูลทางการตลาด. สาระการเรียนรู้ 1. ความหมายของข้อมูลทางการตลาด 2. ความสำคัญของข้อมูลทางการตลาด 3. ประโยชน์ของข้อมูลทางการตลาด 4. ข้อจำกัดในการหาข้อมูลทาง.
บทที่ 7 การวิเคราะห์และพัฒนาระบบ
บทที่ 5 เครื่องมือสืบค้นข้อมูล (Search Engine)
ความรู้เบื้องต้น เกี่ยวกับการสร้างเว็บไซต์
กลุ่มคำและประโยค ภาษาไทย ม. ๓
Presentation การจัดการข้อร้องเรียนในธุรกิจบริการ Customer Complaint Management for Service.
บทที่ 8 การควบคุมโครงการ
บทที่ 3 แฟ้มข้อมูลและฐานข้อมูล
กรณีศึกษา : นักเรียน ระดับ ปวช.2 สาขาวิชาการบัญชี
วิธีการกรอกแบบเสนอโครงการในไฟล์ Power point นี้
อำเภออนามัยการเจริญพันธุ์
บัตรยิ้ม สร้างเสริมกำลังใจ
ปัญหาของข้อมูลในระบบHDC
การประเมินผลการปฏิบัติงาน
มหาวิทยาลัยราชภัฏนครปฐม
Chapter 3 Executive Information Systems : EIS
ความรู้เบื้องต้นเกี่ยวกับคอมพิวเตอร์และเทคโนโลยีสารสนเทศ
บทที่ 7 การวิเคราะห์และพัฒนาระบบ
การบริหารโครงการซอฟต์แวร์
พื้นฐานการออกแบบ กราฟิก หมายถึง ศิลปะแขนงหนึ่งซึ่งใช้การสื่อความหมาย ด้วยเส้น สัญลักษณ์ รูปวาด ภาพถ่าย กราฟ แผนภูมิ การ์ตูน ฯลฯ เพื่อให้สามารถสื่อความหมายของข้อมูลได้ถูกต้องตรง.
กลุ่มสาระการเรียนรู้วิทยาศาสตร์
โครงการจัดทำระบบฐานข้อมูล วัตถุเสพติดของกลาง (ระยะที่1)
วิธีการกำหนดค่า Microsoft SharePoint ของคุณ เว็บไซต์ออนไลน์
หลักในการออกแบบเว็บไซต์
รูปแบบ และ ประโยชน์การขายสินค้าออนไลน์
SMS News Distribute Service
วัฏจักรหิน วัฏจักรหิน : วัดวาอาราม หินงามบ้านเรา
หลักในการพัฒนาเว็บไซต์
ความหมาย ความสำคัญ และจุดมุ่งหมายของการศึกษา
Multimedia และระบบความจริงเสมือน Virtual Reality, VR
หน่วยการเรียนรู้ที่ 7 สรุปบทเรียน และแนวทางการนำไปใช้
การวิจัยทางการท่องเที่ยว
งานนำเสนอสำหรับโครงการ นิทรรศการวิทยาศาสตร์
ชัยพฤกษ์รัตนาธิเบศร์ - วงแหวน
อินเทอร์เน็ตเบื้องต้น และการออกแบบเว็บไซต์
แนวทางการออกแบบนิตยสาร
การเขียนเว็บ Web Editor
โครงการถ่ายทอดเทคโนโลยีถนนรีไซเคิลเพื่อลดขยะพลาสติกใน 4 ภูมิภาค
นพ.อภิศักดิ์ วิทยานุกูลลักษณ์ รพ.ธัญญารักษ์เชียงใหม่ กรมการแพทย์
การออกแบบและพัฒนาเว็บไซต์
MTRD 427 Radiation rotection - RSO
กระดาษทำการ (หลักการและภาคปฏิบัติ)
ใบสำเนางานนำเสนอ:

Introduction to Web Design

ความสำคัญของการออกแบบเว็บไซต์ เนื่องจาก - เว็บไซต์เป็นสื่อที่อยู่ในความควบคุมของผู้ใช้โดยสมบูรณ์ ผู้ใช้ สามารถคลิกหรือไม่คลิกได้ตามต้องการ โดยผู้ใช้จะไม่อดทนต่อ อุปสรรคและปัญหาที่เกิดจากการออกแบบผิดพลาด ดังนั้น - การออกแบบเว็บไซต์จึงมีส่วนสำคัญในการสร้างความประทับใจ และทำให้อยากกลับมาใช้บริการอีก ซึ่งเว็บไซต์ดังกล่าวจะต้อง ออกแบบให้มีประโยชน์และสะดวกต่อการใช้งานรวมถึงความสวย งาม, ความรวดเร็วของเว็บไซต์

การสร้างความได้เปรียบเหนือคู่แข่ง ในด้านธุรกิจจำเป็นต้องให้ความสำคัญของการออกแบบมากขึ้น เนื่องจาก - พฤติกรรมการใช้จ่ายบนเว็บ นั้นลูกค้ามีทางเลือกมากขึ้น - สามารถเปรียบเทียบราคา เพื่อหาสินค้าที่ดีที่สุด โดยไม่ต้องเกรงใจผู้ขาย - ไม่มีข้อเสียเปรียบ-ได้เปรียบเรื่องทำเลที่ตั้ง และระยะทาง - ผู้ใช้งานหรือลูกค้าจะประเมินหน่วยงานหรือบริษัทตามลักษณะของเว็บ ไซต์ที่ได้สัมผัส ซึ่งร้านค้าเล็กๆ แต่สามารถออกแบบเว็บไซต์ให้มีความน่า เชื่อถือมากกว่าบริษัทใหญ่ๆ ได้ ดังนั้น การออกแบบเว็บไซต์ที่ดีก็จะทำเกิดความได้เปรียบทางการค้า และมี โอกาสทางธุรกิจมากขึ้น

การออกแบบเว็บไซต์ที่ดี การออกแบบเว็บไซต์ไม่ได้หมายถึงลักษณะหน้าตาของเว็บไซต์เพียงอย่าง เดียว แต่เกี่ยวข้องตั้งแต่ การกำหนดกลุ่มเป้าหมาย, ระบุกลุ่มผู้ใช้, การจัดระบบข้อมูล การสร้างระบบเนวิเกชั่น, การออกแบบหน้าเว็บเพจ รวมไปถึงการใช้กราฟิก, การเลือกใช้สี, การจัดรูปแบบตัวอักษร, รุ่นของ Web Browser, ขนาดหน้าจอมอนิเตอร์, ความละเอียดของจอภาพ เพื่อให้เกิดความสะดวกและพึงพอใจแก่ผู้ใช้ในการใช้งานเว็บไซต์นั้นๆ

ออกแบบให้ตรงกับเป้าหมายและลักษณะของเว็บไซต์ เว็บไซต์แต่ละประเภทต่างมีเป้าหมายและลักษณะที่แตกต่างกัน เช่น เว็บไซต์ Search Engine ซึ่งเป็นแหล่งรวบรวมเว็บไซต์ต่างๆไว้ โดยมีผู้ที่เข้ามาใช้ปริการมากในแต่ละวัน ดังนั้นสิ่งสำคัญในการออกแบบเว็บไซต์ประเภทนี้คือ - สามารถแสดงหน้าเว็บอย่างรวดเร็วเมื่อผู้ใช้เปิดเข้ามาดู - มีระบบสืบค้นข้อมูลที่มีประสิทธิภาพ เพื่อให้ได้ผลลัพธ์ที่รวดเร็ว - มีความสะดวกในการใช้บริการสืบค้นข้อมูล - มีรายละเอียดของผลการสืบค้นที่ดี

ออกแบบให้ตรงกับเป้าหมายและลักษณะของเว็บไซต์ เว็บไซต์เพื่อความบันเทิงหรือที่เกียวกับศิลปะ ซึ่งผู้ใช้หวังที่จะได้พบกับความตื่นเต้นเร้าใจ, ความสวยงาม, ความสนุกสนานและความเพลิดเพลิน ดังนั้นสิ่งสำคัญในการออกแบบเว็บไซต์ประเภทนี้คือ - มีการออกแบบเว็บให้สวยงามและน่าสนใจ - มีการใช้ Plug- ins เพื่อให้เว็บนั้นมีสีสันมากขึ้น - มีการจัดการระบบข้อมูลที่ดีอย่างเป็นระบบ - คำนึงถึงความสวยงามของเว็บไซต์เป็นหลัก

องค์ประกอบของการออกแบบเว็บไซต์อย่างมีประสิทธิภาพ 1. ความเรียบง่าย (Simplicity) 2. ความสม่ำเสมอ (Consistency) 3. ความเป็นเอกลักษณ์ (Identity) 4. เนื้อหาที่มีประโยชน์ (Useful content) 5. มีลักษณะที่น่าสนใจ (Visual Appeal) 6. การใช้งานอย่างไม่จำกัด (Compatibility) 7. คุณภาพในการออกแบบ (Design Stability) 8. ระบบการใช้งานที่ถูกต้อง (Functional Stability)

ความเรียบง่าย (Simplicity) คือการสื่อสารเนื้อหาถึงผู้ใช้โดยจำกัดองค์ประกอบเสริมที่เกี่ยวข้องกับการนำเสนอให้เหลือเฉพาะสิ่งที่จำเป็นเท่านั้น โดยจะมีลักษณะต่างๆคือ - เน้นรูปแบบที่เรียบง่ายไม่ซับซ้อน - สามารถใช้งานได้สะดวก แม้ว่าจะมีข้อมูลมากมายอยู่ในเว็บก็ตาม - ลดการใช้กราฟิกและตัวอักษรที่เคลื่อนไหวตลอกเวลา - การใช้ชนิดและสีของตัวอักษรที่ไม่มากจนเกินไป - ไม่มีการเลี่ยนแปลง Link ซึ่งจะทำให้เกิดความสับสน Ex. www.adobe.com, www.apple.com, www.ibm.com, www.intel.com

ความสม่ำเสมอ (Consistency) การสร้างความสม่ำเสมอทำได้โดย - ใช้รูปแบบเดียวกันตลอกทั้งเว็บ เพราะถ้าลักษณะของแต่ละหน้าเว็บเพจแตกต่างกันมาก ผู้ใช้งานจะเกิดความสับสน ดังนั้นจะต้องออกแบบเว็บเพจให้สิ่งต่างๆ มีความคล้ายคลึงกัน - รูปแบบของหน้าเว็บเพจ - Graphics Style - Navigation System - Colors tone

ความเป็นเอกลักษณ์ (Identity) การออกแบบนั้นจะต้องคำนึงถึงเอกลักษณ์ขององค์กร เนื่องจากรูปแบบของเว็บไซต์สามารถสท้อนถึงเอกลักษณ์และลักษณะขององค์กรได้ เช่น เว็บไซต์ของธนาคาร จึงไม่ควรดูเหมือนสวนสนุก โดยที่การใช้ ชุดสี, ชนิดตัวอักษร, รูปภาพและกราฟิก จะมีผลต่อรูปแบบของเว็บไซต์อย่างมาก

เนื้อหาที่เป็นประโยชน์ (Useful Content) เนื้อหาเป็นสิ่งสำคัญที่สุดของเว็บไซต์ ดังนั้นจะต้องจัดเตรียมเนื้อหาและข้อมูลที่ผู้ใช้ต้องการให้ถูกต้องและสมบูรณ์ โดยจะต้องปรับปรุงให้ทันต่อเหตุการณ์อยู่เสมอ

ระบบเนวิเกชั่นที่ใช้งานง่าย (User-Friendly Navigation) จะต้องออกแบบให้ผู้ใช้เข้าใจและใช้งานได้ง่าย โดย - ใช้กราฟิกที่สื่อความหมาย ร่วมกับคำอธิบายที่ชัดเจน - มีรูปแบบและลำดับของรายการที่สม่ำเสมอ

มีลักษณะที่น่าสนใจ (Visual Appeal)

การใช้งานอย่างไม่จำกัด (Compatibility) ควรออกแบบให้ผู้ใช้ส่วนใหญ่เข้าถึงได้มากที่สุด โดยไม่จำเป็นต้องติดตั้งโปรแกรมใดๆ เพิ่มเติม สามารถแสดงผลได้ทุก Browser และทุกระบบปฏิบัติการที่ความละเอียดหน้าจอต่างๆ กัน อย่างไม่มีปัญหา

คุณภาพในการออกแบบ (Design Stability)

ระบบการใช้งานที่ถูกต้อง (Functional Stability) ระบบการทำงานต่างๆ ในเว็บไซต์จะต้องมีความแน่นอนและทำหน้าที่ได้ถูกต้อง เช่น - การใช้ฟอร์มกรอกข้อมูล จะต้องแน่ใจว่าใช้งานได้จริง หรือ - - ลิงค์ต่างๆที่มีอยู่สามารถเชื่อมโยงไปยังหน้าที่มีอยู่จริง

ปัจจัยสำคัญที่ผู้ใช้ต้องการจากเว็บไซต์ 1. มีเนื้อหาที่เป็นประโยชน์ และตรงกับที่ผู้ใช้ต้องการ 2. มีการปรับปรุงเนื้อหา และพัฒนาเว็บไซต์อยู่เสมอ 3. ใช้เวลาในการดาวน์โหลดน้อย แสดงผลได้รวดเร็ว 4. การใช้งานที่สะดวก เข้าใจง่าย

ทีมงานในการพัฒนาเว็บไซต์ เนื่องจากการพัฒนาเว็บไซต์นั้นมีความหลากหลาย ดังนั้นจึงต้องอาศัยทักษะ, ความรู้, ความชำนาญในหลายๆ ด้าน จึงจำเป็นต้องมีทีมงานเพื่อพัฒนาเว็บไซต์ให้มีประสิทธิภาพ ซึ่งมีหน้าที่รับผิดชอบต่างๆ กันไป

ทีมงานในการพัฒนาเว็บไซต์ Webmaster : เป็นผู้ควบคุมการออกแบบ, เนื้อหาและรายละเอียด ทางเทคนิค รวมทั้งเป็นผู้ที่คิดหาวิธีสร้างความน่า สนใจให้กับเว็บไซต์ เพื่อให้มีผู้เข้ามาใช้บริการมากๆ Information Architect : ทำหน้าที่จัดระเบียบข้อมูลและทดสอบ ประสิทธิภาพในการใช้งาน, Information architect ควรมีพื้นฐานเกี่ยวกับการบริหารจัดการข้อมูลมาก่อน

ทีมงานในการพัฒนาเว็บไซต์ Designer : เป็นผู้ออกแบบลักษณะหน้าตาทั้งหมดของเว็บไซต์ ควรเป็นผู้ที่มีความรู้ด้านศิลปะ สามารถใช้โปรแกรม กราฟิกได้เป็นอย่างดี HTML and JavaScript Coder : รับผิดชอบในการสร้างเว็บเพ็จโดยอาศัยเครื่องมือต่างๆ สามารถแก้ไขข้อมูลในเว็บเพจได้อย่างรวดเร็ว

ทีมงานในการพัฒนาเว็บไซต์ Developer/Programmer : เป็นผู้เขียน Script และโปรแกรมการใช้งานต่างๆ ภายในเว็บไซต์ ควรมีความรู้เกี่ยวกับ HTML, DHTML, JavaScript, ASP, PHP, CGI, Database Development System Administrator : ทำหน้าที่ควบคุมดูแลเว็บเซิร์ฟเวอร์ รวมถึง hardware & Software อื่นๆ ที่เกี่ยวข้อง และสามารถแก้ไข, ปรับตั้งระบบให้ทำงานได้อย่างมีประสิทธิภาพ

ทีมงานในการพัฒนาเว็บไซต์ Content Editor / Writer : เป็นผู้จัดเตรียมเนื้อหาและข้อมูลต่างๆ ทั้งหมดที่จะนำไปไว้ในเว็บเพจ โดยจะต้องสร้างสรรค์เนื้อหาที่ดีมีประโยชน์และน่าสนใจให้กับผู้ใช้งานอยู่เสมอ

โปรแกรมช่วยในการสร้างเว็บไซต์ - Macromedia Dreamweaver - Microsoft FrontPage - Allaire HomeSite - HTML Editor ต่างๆ

ความผิดพลาดในการออกแบบเว็บไซต์ 1. ใช้โครงสร้างแบบ Frame - สร้างความสับสนต่อผู้ใช้ - ไม่สามารถ Bookmark หน้าเว็บเพจที่ต้องการได้ - แสดงชื่อไฟล์หรือ URL ไม่ถูกต้อง - การสั่งพิมพ์จะได้ผลลัพธ์ที่ไม่แน่นอน

ความผิดพลาดในการออกแบบเว็บไซต์ 2. ใช้เทคโนโลยีสูงโดยไม่จำเป็น - ผู้ใช้ไม่พร้อมที่จะใช้งานเทคโนโลยีเหล่านั้น - ต้องเสียเวลาในการดาวน์โหลดข้อมูลนาน - จำเป็นต้องติดตั้งโปรแกรมเพิ่มเติม - ไม่มีผลต่อผู้ใช้งานโดยทั่วไป เพราะผู้ใช้งานจะสนใจข้อมูล มากกว่าเทคโนโลยีที่ใช้

ความผิดพลาดในการออกแบบเว็บไซต์ 3. ใช้ตัวหนังสือหรือภาพเคลื่อนไหวตลอดเวลา - สร้างความรำคาญต่อผู้ใช้งาน - เป็นจุดที่สร้างความสับสนให้กับผู้ใช้งาน 4. มีที่อยู่เว็บไซต์ที่ซับซ้อน (URL) ยากต่อการจดจำและพิมพ์ - ทำให้ผู้ใช้จดจำได้ยาก - ผู้ใช้จะเขียนไม่ถูกต้อง ถ้ามี URL ที่ซับซ้อน

ความผิดพลาดในการออกแบบเว็บไซต์ 5. ไม่มีการแสดงชื่อและที่อยู่เว็บไซต์ในหน้าเว็บเพจ - ผู้ใช้อาจเกิดความสับสนว่ากำลังใช้งานเว็บไซต์ใดอยู่ - ผู้ใช้ไม่สามารถรู้ชื่อและที่อยู่เว็บไซต์ เพื่อเข้ามาใหม่ได้ 6. มีความยาวของหน้ามากเกินไป - มีข้อมูลมาก ทำให้เกิดความสับสน - เสียเวลาในการ Download นาน - ยากต่อการค้นหาข้อมูลที่ต้องการ จากจำนวนข้อมูลมากๆ ในหนึงหน้า

ความผิดพลาดในการออกแบบเว็บไซต์ 7. ขาดระบบเนวิเกชั่นที่มีประสิทธิภาพ - ผู้ใช้ไม่สามารถเข้าถึงข้อมูลที่ต้องการได้ - ผู้ใช้อาจเกิดหลงทางได้ หากระบบเนวิเกชั่นไม่ดี 8. ใช้สีของ Link ไม่เหมาะสม - ทำให้ผู้ใช้ไม่แน่ใจว่าส่วนไหนคือ Link หรือ ส่วนไหนบ้างที่ เคย Link ไปแล้ว หรือ ยังไม่เคย link ไป

ความผิดพลาดในการออกแบบเว็บไซต์ 9. ข้อมูลเก่าไม่มีการปรับปรุงให้ทันสมัย - ไม่ได้รับความเชื่อถือจากผู้ใช้งาน - ผู้เข้ามาใช้บริการน้อย เพราะข้อมูลเป็นข้อมูลเก่า 10. เว็บเพจแสดงผลช้า - ถ้าใช้เวลาโหลดนานกว่า 15 sec อาจทำให้ผู้ใช้ขาดความ สนใจที่จะดูข้อมูลต่อ (มีรายงานการวิจัยว่า ถ้าเกิน 8 Sec ผู้ใช้ กว่า 90 % จะเปลี่ยนไปดูเว็บไซต์อื่นแทน)