Please enable JavaScript.
Coggle requires JavaScript to display documents.
องค์ประกอบของเว็บไซต์ที่ดี - Coggle Diagram
องค์ประกอบของเว็บไซต์ที่ดี
Accessibility : ความสามารถในการเข้าถึงข้อมูล
หนึ่งในองค์ประกอบของเว็บไซต์ที่ดี คือ ต้องสามารถนำเสนอข้อมูลแก่ผู้เข้าเยี่ยมชมเว็บไซต์ได้อย่างครบถ้วน ไม่มีปัญหาเรื่องของการแสดงหน้าเว็บไซต์ ผู้เข้าชมต้องได้รับร้ับความสะดวกในการเข้าถึงข้อมูล เหล่านั้นโดยมีสิ่งที่ต้องคำนึกถึง
เพื่อสนับสนุนการเข้าถึงข้อมูลบนเว็บไซต์ ดังต่อไปนี้
ขนาดของหน้าจอ
คอมพิวเตอร์รุ่นใหม่จะมีความละเอียดของหน้าจอสูงขึ้น รวมถึง “พฤติกรรม” ของผู้บริโภคที่
“เปลี่ยนไป” ด้วยการบริโภคข่าวสารแบบ Real Time ทุกที่ทุกเวลาผ่านอุปกรณ์ทั้ง Tablet
และ Smartphone จนกลายเป็น Multi-Screen Trend ดังนั้น เว็บไซต์ที่ดีต้องสามารถ
แสดงผลได้พอดีกับทุกหน้าขนาดของหน้าจอและอุปกรณ์หลากหลายประเภทด้วย
Web Browser
Web Browser หรือเรียกง่ายๆ ก็คือโปรแกรมที่ใช้ในการการเปิดดเูว็บไซต์ต่างๆ ซึ่งปัจจุบันมี
ให้เลือกใช้มากมาย เชน่ Google Chrome, Mozilla Firefox, Internet Explorer, Safari
เป็นต้นโดยเว็บไซต์ต้องสามารถแสดงผลบนทุก Browser ได้อย่างถูกต้อง เพราะ
หากเข้าไม่ได้ในบาง Browser นั่นหมายถึงคุณอาจจะสูญเสียTraffic จากผู้เข้สชมเยี่ยมชม
เว็บไซต์ที่เข้ามาแล้วไม่สามารถอ่านข้อมูลบนเว็บไซต์ได้
Font ตัวอักษร
ควรใช้Font หรือตัวอักษรแบบมาตรฐาน เช่น Arial, Verdana, Times New Roman,
Tahoma เป็นต้นและหลีกเลี่ยงการใช้ Font ตัวอักษรพิเศษ เพราะหากเครื่องคอมพิวเตอร์
ของผู้เข้าชมเว็บไซต์ไม่มี Font พิเศษติดตั้งไว ้ ก็จะทำให้การแสดงผลผิดไปจากปกติหรือ
อ่านข้อมูลไม่ได ้
การ Tag รูปภาพ
ควรตั้งชื่อให้กับรูปภาพประกอบเว็บไซต์ทุกครั้ง(Alternative Text) เพราะหากไม่ตั้ง
ชื่อรูปภาพ Search Engine ก็จะไม่ทราบว่ารูปภาพนั้นเป็นรูปภาพอะไร ทำให้ไม่สามารถเข้า
มาเก็บข ้อมูลได ้
และสำหรับผู้พิการรทางสายตาที่ใช้โ้ปรแกรมอ่านหน้าเว็บไซต์ด้วยแล้ว Alternative Text นี้
จะถูกแปลงเป็นเสียงอ่านเพื่อสื่อสารให้ผู็ที่ตาบอดรับรู้อีกด้วย
การใช้สี
ระมัดระวังเรื่องการเลือกใช้ตัวอักษรและสีพื้นหลังที่ไม่ใกล้เคียงกันเกินไป รวมถึงหลีกเลี่ยง
การใช้สีเพียงอย่างเดียวเพื่อสื่อความหมายหรือไฮไลท์ ข้อมูลสำคัญเพราะอาจทำให ้ เกิดปัญหาแก่ผู้เช้าชมที่ตาบอดสีโดยควรใช้สัญลักษณ์ร่วมกับการใช้สี เช่น เครื่องหมาย *
สำหรับช่องที่ต้องการกรอกข้อมลู เป็นต้น
Speed : ความเร็วในการแสดงผลข้อมูลบนเว็บไซต์
ในการเปิดเว็บไซต์แต่ละหน้า เว็บไซต์ที่ดีไม่ควรมีองค์ประกอบที่ทำใหผ้เข้าชมเว็บใช้เวลาในการโหลดนาน เกินไป เพราะธรรมชาติของผู้เข้าชมเว็บไซต์อย่างหนึ่ง คือ ผู้ชมจะไม่มีความอดทนสูงมากนักในการค้นหาข้อมูลทาง Internet
ถ้าการเข้าถึงเว็บไซต์ ทำให้เขาต้องเสียเวลามากเกิน ไป ผู้ชมมท่านนั้นก็อาจจะออกจากเว็บไปทันที่! รีบป้องกันไม่ให้เกิด เหตุการณ์แบบนี้เกิดขึ้นได้ รีบปรับปรุงเว็บไซต์ให้แสดงผลข้ออมูลได้เร็วขึ้น ตามวิธีง่ายๆ ดังนี้ค่ะ
เลือกใช้ภาพขนาดไม่ใหญ่
ระมัดระวังเรื่องขนาดของรูปภาพและไฟล์ (มีผลต่อความเร็ว) หากภาพหรือไฟล์บนเว็บไซต์นั้นมี ขนาดใหญ่ ก็จะทำให้เว็บไซต์ของคุณ แสดงผลได้ช้าลงการใส่ ภาพลงบนเว็บไซต์
ควรจะเลือกวิธี “Save for Web” และบันทึกภาพให้มีนามสกุล .JPG หรือ .GIF
ตั้งค่าไม่ให้ Video เล่นอัตโนมัติ
ในการใส่ไฟล์จากพวก Video และ Audio (ภาพและเสยีง) อย่าให้ไฟล์เหล่านี้เล่นอัตโนมัติโดย ทันทีแต่ให ้มีปุ่ม “play” เพื่อให้ผู้เข้าชมเว็บไซต์สามารถเลือกเล่นไฟล์นั้นได้ ด้วยตัวเอง
ใช้บริการ Web Hosting ที่เร็ว
ในกรณีที่เลือกใช้บริการ Web Hosting ควรเลือก Server หรือ Web Hosting ที่เร็วและมี Bandwidth มากพอ (Bandwidth คือ ความเร็วในการรับและส่งข้อมูลบนอนิเตอรเ์น็ต)
ระวังการใช้Code ตกแต่งจากเว็บไซต์อื่น
การใส่ Code Banner, Counter หรือ การเขียน Code มาใส่บนเว็บไซต์นั้นควรระวังเรื่องความเร็ว และเสถียรภาพของระบบของ Server ของผู้ให้บริการ code ที่คุณนำมาติดตั้งด้วย
เช่น หาก server ของ code ที่นำมาติดล่มหรือโหลดช้า จะทำให้เว็บของคุณ เปิดไม่ได้หรือโหลดช้าไปด้วย เป็นต้น
ตรวจสอบการแสดงผลภาพเคลื่อนไหวแบบ Flash
การใช ้Flash Animation หรือ Code ภาพเคลื่อนไหวต่างก็มีผลททำให้ใช้วลาโหลดนานและอาจไม่
สามารถแสดงผลในอุปกรณ์บางประเภท
จึงควรจะทดสอบความเร็วของการแสดงผลของส่วนประกอบต่างๆ ก่อน รวมถึง preview
ตรวจสอบการแสดงผลของเว็บไซต์ก่อนเสมอ ก่อนที่จะโปรโมทเว็บไซต์ของคุณออกไป
จะเห็นได้ว่าข้อมูล องค์ประกอบเว็บไซต์ทั้งหมดข้างต้นล่วนเป็นตัวช่วยที่ทำให้เว็บของเรามีความสวยงาม ดึงดูดสายตา
และสร้างความน่าสนใจแก่ผู้เข้าชม แต่ก็เป็นเหมือน
ดาบสองคม เพราะข้อมูลเหล่านี้จะส่งผลกระทบหลักต่อการโหลดข้อมูล บน
เว็บไซต์ด้วยนะคะ
ดังนั้นหลังจากใส่ข้อมูล บนเว็บแล้วอย่าลืมตรวจสอบการแสดงผลบนขอ้มลู เว็บไซต์จริงทุกครั้งแสดงผลช้าหรือเร็ว
เพียงใด ที่สำคัญเลือกใช้แต่พอดีนะคะ แล้วเว็บไซต์ของคุณ ก็จะเป็นเว็บที่ดีและสวยแน่นอน
Attractiveness : เว็บไซต์ต้องน่าสนใจ ดึงดูดสายตา
เว็บไซต์ที่น่าสนใจและดึงดูด ต้อองสามารถทำให้ ผู้เข้าเยี่ยมชมเว็บไซต์ หยุดอยู่ที่เว็บไซต์ของคุณได้ ทันทีเมื่อเข้ามาครั้งแรก โดยต้องคำนึงถึงวิธีการตาม หลักการ AIDA ดังต่อไปนี้
"Attention" ทำให้ผู้ชมเว็บหยุดเพื่อที่จะอ่านข้อมูล
วิธีการที่ดึงดูดความสนใจที่ดี เช่น การใส่ภาพคนลงบนจุดกึ่งกลางของหน้า
เว็บไซต์เพื่อนสายตาผู้เข้าชมไปที่ภาพนั้นๆ
"Interest" อธิบายเพื่อสร้างความสนใจในตัวสินค้าหรือบริการ
เมื่อใช้ภาพคนอื่นเพื่อดึงดูดให้ผู็ชมเว็บหยุดที่หน้าเว็บไซต์ได้แล้ว ก็ให้เขียนรายละเอียด
เพื่อให้คนสนใจอ่านข้อมูลต่อไปทันทีดังนั้นหากกระบวนการแรก (Attention) ไม่
สามารถทำให้ผู้ชมเว็บหยุดเพื่อที่จะอ่านข้อมูลได้ ก็จะไม่สามารถก่อให้เกิดกระบวนการ
ที่สอง (Interest) ได้เนื่องจากผู้เข้าชมจะไม่สนใจที่จะอ่านข้อความธรรมดา หากไม่มีสิ่งที่ดึงดูดสายตาก่อน
"Desire" ทำให้เกิดความรู้สึกอยากซื้อหรือใช้บริการ
เมื่อเกิด Interest แล ้ว ก็ต้องกระตุ้นให้ผู้ที่กำลังอ่านข้อมูลสินค้าหรือบริการบน
หน้าเว็บไซต์เกิดรู้สึกอยากซื้อหรือใช้บริการ โดยอาจจะแสดงรูปภาพที่โดดเด่น
ของสินค้าหรือบริการเสริมไปได้
"Action" ปิดการขายหรือทำให้ตัดสินใจซื้อสินค้า
ต้องทำให้ผู้เยี่ยมชมเว็บไซต์เกิดการกระทำบางอย่างบนเว็บไซต์ (Call to
action) เชน่ สมัครสมาชิกส่งแบบสอบถามมาที่หน้าเว็บไซต์
ดังนั้น ให้จินตนาการว่า เมื่อผู้เข้าเยี่ยมชมเว็บไซต์ อ่านเนื้อหามาถึงจุดหนึ่งแล้ว คุณอยากให้เขาไปที่หน้าไหนต่อ แล้ววาง ลิงค์อ่านต่อไว ้ที่ข้างๆ เนื้อหานั้นเช่น เว็บไซต์โรงแรม จะวางป่มุ จองห้องพัก ไว้ข้างๆ รูปภาพที่แสดงรายละเอียดของห้องพัก เพื่อให้ผู้ที่สนใจสามารถคลิกที่ปุ่มจองได้ทันที เป็นต้น
Simplicity : ความง่ายในการใช้งาน
เว็บไซต์ที่ดีควรแสดงถึง "ความง่ายของการจัดเรียงข้อมูล" ทำให้ผู้เข้าชมเว็บไซต์นั้นสามารถเข้าถึงข้อมูลที่ต้องการได้ โดยง่าย แต่หากเว็บไซต์มีการจัดเรียงข้อมูลที่ไม่เป็นระเบียบหรือไม่เป็นหมวดหมู่แล้ว ก็จะเพิ่มเวลาในการค้นหาของผู้เข้า ชมเว็บไซต์ จนอาจมีผลให้เขาเหล่านั้นออกจากเว็บไซต์ของคุณไปเลยก็เป็นได ้
• แสดง "เมนู" และ "ปุ่ม" สำหรับคลิกในส่วนต่าง ๆ ของเว็บไซต์
อย่างชัดเจน และหลีดเลี่ยงการ ออกแบบโครงสรา้งเว็บไซต์ที่ซึ่งซับซ้อน เข้าใจยาก
• จัดทำหน้า Sitemap หรือ แผนผังเว็บไซต์สำหรับผู้ใช้เพื่อ เป็นแผนที่บอกเส้นทาง พาผู้เข้าเยี่ยมชมไปยังหน้าเว็บไซต์ที่ต้องการได ้
• ใชแ้ บบฟอรม์ ส าหรบัตดิตอ่ หรอืสง่ัซอื้ เพื่อให ้ง่ายต่อเจ้าของเว็บไซต์ ที่จะติดต่อกลับไปที่ ลกู คา้เพอื่ ใหข้ อ้มูลสนิคา้และบรกิ ารเพมิ่ เตมิ ได ้โดยการสรา้งแบบฟอรม์ แตต่ อ้ งไมบ่ งัคบั ใหผ้ กู้ รอกฟอรม์ ใสข่ อ้มลู เยอะเกินไป
• จัดกลุ่มข้อมูลต่างๆ ในรูปแบบ "Breadcrumb Navigation" ซึ่ง จะเป็นเสมือน เครื่องมือนำทางแก่ผู้เข้าชมเว็บไซต์ ให้สามารถเข้าถึงข ้อมูลในแต่ละหมวดหมู่ที่เกี่ยวข้องกันได ้อย่างเป็นลำดับขั้น โดยง่าย
• ควรสร้าง Link ไปหน้า Homepage จากทุกหน้า เพื่อให ้ผู้เข ้าชมนั้นสามารถคลิกกลับมา เริ่มต ้นที่หน้าแรกของเว็บไซต์ได ้ รวมถึงสร้าง Menu ด้านล่าง (Footer Menu) เพื่อเพิ่มความสะดวกให ้กับผู้เข ้า ชมเว็บไซต์ ให ้สามารถไปยังเมนูอื่นๆ ที่ต ้องการได ้ แม ้จะอยู่ด ้านล่างของหน้า โดยไม่ต ้อง Scroll กลับขึ้นไป ด ้านบน
Credibility : ความน่าเชื่อถือของเว็บไซต์
ด้วยเทคโนโลยีการสื่อสารที่ก้าวหน้าอย่างรวดเร็ว ทำให้ การสร้างตัวต้นตนของธรุ กจิบนโลกออนไลน์กลายเป็นเรอื่ งธรรมดาที่ ไมว่ า่ ใครก็ท าได ้เรมิ่ ตงั้แต่ การใช ้Social Network น าเสนอสนิ คา้และบริการต่างๆ ไปจนถึงการเปิดเว็บไซต์ร้านค้า ออนไลน์ขายสนิ คา้เป็นเรอื่ งเป็นราว ก็ท าไดอ้ ยา่ งงา่ ยและรวดเร็ว
และในมมุ ของผซู้ อื้ แมช้ อ่ งทางออนไลน์จะท าใหก้ ารจับจา่ ยเลอื กซอื้ เลอื กใชส้นิ คา้เป็นไปไดอ้ย่างงา่ ย สะดวกสบาย ไม่ ตอ้ งเสยีเวลาเดนิ ทางไปถงึทรี่ า้น แต่ก็ยังมีผูช้ มเว็บไซตอ์ กี มากทไี่ มก่ ลา้ซอื้ สนิ คา้ออนไลน์เนอื่ งจากยงัไมเ่ ห็น สนิคา้จรงิ ก็ท าใหเ้กดิ ความสงสยั ไมม่ น่ั ใจ และระแวงได้
ดังนั้น เป็นสงิ่ ทสี่ าคญั มากทที่ า่ นเจา้ของเว็บไซตจ์ ะตอ้ งสรา้งความนา่ เชอื่ ถอื ใหผ้ ูเ้ขา้ชมเว็บไซตเ์กดิ ความมน่ั ใจ และวางใจว่าเว็บไซต์ของคุณไมใ่ ช่เว็บไซตห์ ลอกลวง โดยวธิกี ารทจี่ ะชว่ ยใหเ้ว็บไซตข์ องคณุ น่าเชอื่ ถอื มดี งันคี้ ะ่
∙ ดไีซนก์ ารออกแบบเว็บไซต์ควรดนู า่ เชอื่ ถอื เป็นมอือาชพี (Professional Look) มีเนื้อหาอย่างครบถ ้วน มรีูปภาพสนิคา้หรอื บรกิ ารประกอบเนอื้ หาอย่างชดั เจน และจัดขอ้มลู อยา่ งเป็นหมวดหมเู่ พอื่ ความสะดวกในการเขา้ ชม
∙ แสดงทอี่ ยตู่ ดิ ตอ่ ชดั เจน พรอ้ มเบอรโ์ทรศพั ทท์ ตี่ ดิ ตอ่ ได้หรือกรณีที่มีหน้าร้านจริง สามารถแสดงแผนที่ตั้ง เพื่อยืนยันการมีตัวตน และรองรับการติดต่อเข ้ามาของลูกค ้าที่สนใจได ้
∙ สร้างหน้า เกี่ยวกับเรา (About Us) แสดงเนื้อหาของประวัติความเป็นมา ผู้บริหาร วสิ ยั ทัศน์ของบรษิ ัท ภาพ ออฟฟิศ ทีมงาน
∙ มีเครื่องหมายรับรองจากสถาบันต่างๆ (Certification and Accreditation) เชน่ เครอื่ งหมาย DBD Verified, Registered ของกรมพัฒนาธุรกิจการค ้า เป็นตน้ ซงึ่ เจา้ของเว็บไซตจ์ ะตอ้ งน าเว็บไซตไ์ ปผา่ นการตรวจ รับรองจากองค์กรมาตรฐานตา่ งๆ ท าใหเ้กดิ ความน่าเชอื่ ถอื วา่ เว็บไซตน์ อี้ ยใู่ นขอบเขตของกฏหมาย
∙ มีหน้าค าถามที่พบบ่อย FAQ (Frequently Asked Questions) แนะน าข ้อมูลหรือตอบข ้อสงสยั เบอื้ งตน้ ใหก้ ับ ลูกค ้า
∙ มตี วัอยา่ งประสบการณผ์ ูซ้ อื้ ผูใ้ชบ้ รกิ าร (Testimonials) เพื่อแสดงให ้เห็นว่าเว็บไซต์นี้เคยให ้บริการกับ ลกู คา้รายอนื่ ๆ หากลกู คา้มชี อื่ เสยีงในวงสงัคม หรอืเป็นผูท้ มี่ คี วามน่าเชอื่ ถอื ย่อมกอ่ ใหเ้กดิ ผลในทางบวก และ สง่ เสรมิ ภาพลักษณ์ของเว็บไซต์ให ้ดีขึ้น
∙ แสดงเงอื่ นไขและนโยบายในการซอื้ หรอืขายสนิ คา้และบรกิ ารทชี่ ดั เจน ชว่ ยใหเ้ห็นถงึความจรงิใจของ เจ้าของเว็บไซต์ เพราะแสดงขอบเขตของการให ้บริการ และคุณสมบัติของลูกค ้า
∙ ระวงัการใช้Webboard, Guest Book, Comments ถา้จ าเป็นใหใ้ช ้ระบบ Captcha ชว่ ยป้องกนั spam