การสร้าง UX ที่สมบูรณ์แบบด้วยการแฮ็กเว็บไซต์ 11 รายการ

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

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

UX มีความสำคัญมากแค่ไหน

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

ปัจจัยที่มีผลต่อ UX

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

แบบฟอร์มเว็บไซต์

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

สารละลาย:

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

ข้อความตัวยึดตำแหน่งในเขตข้อมูล

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

สารละลาย:

เพื่อป้องกันไม่ให้ลูกค้าถูกรบกวนและยังทำให้พวกเขาป้อนข้อมูลที่ถูกต้อง ตรวจสอบให้แน่ใจว่าข้อความตัวแทนหายไปทันทีที่ลูกค้าป้อนข้อมูล

การจัดรูปแบบในแอตทริบิวต์

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

สารละลาย:

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

ป้องกันข้อความแสดงข้อผิดพลาด

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

สารละลาย:

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

ส่วนหัวขนาดใหญ่

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

สารละลาย:

ในการแก้ปัญหานี้ ผู้ดูแลระบบสามารถขอให้ผู้พัฒนาไม่ใช้ส่วนหัวการนำทางคงที่ขนาดใหญ่เหล่านี้ และใช้ส่วนหัวแบบธรรมดาที่ช่วยให้ผู้ใช้สามารถอ่านข้อความได้อย่างถูกต้อง

นำการออกแบบที่ตอบสนองมาใช้

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

สารละลาย:

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

ใช้เฉดสีที่สว่างกว่าสำหรับคอนทราสต์

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

สารละลาย:

คุณสามารถใช้เฉดสีที่อ่อนกว่าเป็นคอนทราสต์ได้ ฉันเคยเห็นตัวเองในเว็บไซต์อันดับต้น ๆ หลายแห่ง พวกเขาใช้เฉดสีที่สว่างกว่าอย่างชาญฉลาด เช่น สีเหลือง สีขาวซีด สีขาวเมฆ และแม้กระทั่งสีส้มอ่อนเป็นพื้นหลัง

ข้อความและรูปภาพ

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

สารละลาย:

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

การเลือกสี

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

สารละลาย:

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

คำกระตุ้นการตัดสินใจ

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

โซลูชั่น:

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

ฟังก์ชันสัมผัสสำหรับอุปกรณ์เคลื่อนที่

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

สารละลาย:

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

บทสรุป

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