แนวทางปฏิบัติแนะนำเกี่ยวกับแบบฟอร์มลงชื่อสมัครใช้

ช่วยให้ผู้ใช้ลงชื่อสมัครใช้ เข้าสู่ระบบ และจัดการรายละเอียดบัญชีได้โดยง่าย

Sam Dutton

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

ต่อไปนี้เป็นตัวอย่างแบบฟอร์มการลงชื่อสมัครใช้ที่เรียบง่ายมากซึ่งแสดงแนวทางปฏิบัติแนะนำทั้งหมด

เช็กลิสต์

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

หลีกเลี่ยงการลงชื่อเข้าใช้หากเป็นไปได้

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

แบบฟอร์มการลงชื่อสมัครใช้ที่ดีที่สุดคือไม่มีแบบฟอร์มการลงชื่อสมัครใช้

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

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

แสดงการลงชื่อเข้าใช้อย่างชัดเจน

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

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

// auth2 is initialized with gapi.auth2.init()
if (auth2.isSignedIn.get()) {
  var profile = auth2.currentUser.get().getBasicProfile();
  console.log(`Email: ${profile.getEmail()}`);
}

ระบุวิธีเข้าถึงรายละเอียดบัญชีอย่างชัดเจน

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

ตัดข้อมูลที่ไม่จำเป็นในแบบฟอร์ม

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

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

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

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

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

พิจารณาระยะเวลาของเซสชัน

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

พิจารณาว่าผู้ใช้ใช้อุปกรณ์เคลื่อนที่หรือเดสก์ท็อป และผู้ใช้แชร์ในเดสก์ท็อปหรือแชร์อุปกรณ์

ช่วยให้เครื่องมือจัดการรหัสผ่านแนะนำและจัดเก็บรหัสผ่านอย่างปลอดภัย

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

ด้วยเหตุนี้ การกำหนดโค้ดแบบฟอร์มการลงชื่อสมัครใช้ให้ถูกต้องจึงเป็นเรื่องสำคัญอย่างยิ่ง โดยเฉพาะการใช้ค่าที่ถูกต้องสำหรับฟีเจอร์เติมข้อความอัตโนมัติ สำหรับแบบฟอร์มการลงชื่อสมัครใช้ ให้ใช้ autocomplete="new-password" สำหรับรหัสผ่านใหม่ และเพิ่มค่าที่ถูกต้องสำหรับการเติมข้อความอัตโนมัติลงในช่องอื่นๆ ของแบบฟอร์มเมื่อเป็นไปได้ เช่น autocomplete="email" และ autocomplete="tel" นอกจากนี้ คุณยังช่วยเครื่องมือจัดการรหัสผ่านได้โดยใช้ค่า name และ id ที่ต่างกันในแบบฟอร์มการลงชื่อสมัครใช้และลงชื่อเข้าใช้สำหรับองค์ประกอบ form เอง รวมถึงองค์ประกอบ input, select และ textarea

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

ตรวจสอบว่าผู้ใช้ป้อนรหัสผ่านที่ปลอดภัย

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

อย่างไรก็ตาม ผู้ใช้จํานวนมากต้องการป้อนรหัสผ่านของตนเอง คุณจึงต้องใช้กฎเกี่ยวกับความซับซ้อนของรหัสผ่าน สถาบันมาตรฐานและเทคโนโลยีแห่งชาติของสหรัฐอเมริกาอธิบายวิธีหลีกเลี่ยงรหัสผ่านที่ไม่ปลอดภัย

ไม่อนุญาตรหัสผ่านที่ถูกละเมิด

ไม่ว่าคุณจะเลือกกฎใดสำหรับรหัสผ่าน ก็ไม่ควรอนุญาตให้ใช้รหัสผ่านที่มีการเปิดเผยในการละเมิดความปลอดภัย

เมื่อผู้ใช้ป้อนรหัสผ่านแล้ว คุณต้องตรวจสอบว่ารหัสผ่านดังกล่าวไม่ใช่รหัสผ่านที่ถูกบุกรุกไปแล้ว เว็บไซต์ Have I Been Pwned มี API สำหรับการตรวจสอบรหัสผ่าน หรือคุณจะเรียกใช้ API นี้เป็นบริการด้วยตนเองก็ได้

นอกจากนี้ เครื่องมือจัดการรหัสผ่านของ Google ยังให้คุณตรวจสอบว่ารหัสผ่านที่มีอยู่ถูกบุกรุกหรือไม่

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

ไม่ห้ามการวางรหัสผ่าน

บางเว็บไซต์ไม่อนุญาตให้วางข้อความลงในช่องป้อนรหัสผ่าน

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

อย่าจัดเก็บหรือส่งรหัสผ่านเป็นข้อความธรรมดา

อย่าลืมใส่เกลือและแฮชรหัสผ่าน และอย่าพยายามคิดค้นอัลกอริทึมการแฮชของคุณเอง

ไม่บังคับให้อัปเดตรหัสผ่าน

อย่าบังคับให้ผู้ใช้อัปเดตรหัสผ่านโดยพลการ

การบังคับให้อัปเดตรหัสผ่านอาจทำให้แผนกไอทีต้องเสียค่าใช้จ่าย สร้างความรำคาญให้ผู้ใช้ และไม่ได้ส่งผลมากนักต่อความปลอดภัย นอกจากนี้ ยังอาจกระตุ้นให้ผู้ใช้ใช้รหัสผ่านที่จำง่ายแต่ไม่ปลอดภัย หรือเก็บบันทึกรหัสผ่านไว้เป็นเอกสาร

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

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

เปลี่ยนหรือรีเซ็ตรหัสผ่านได้ง่าย

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

และแน่นอนว่าคุณควรทำให้ผู้ใช้รีเซ็ตรหัสผ่านได้ง่ายๆ หากลืมรหัสผ่าน โครงการความปลอดภัยของเว็บแอปพลิเคชันแบบเปิด (Open Web Application Security Project) มีคำแนะนำโดยละเอียดเกี่ยวกับวิธีจัดการเมื่อลืมรหัสผ่าน

สิ่งสำคัญอย่างยิ่งคือต้องช่วยให้ผู้ใช้เปลี่ยนรหัสผ่านหากพบว่ารหัสผ่านถูกบุกรุก เพื่อรักษาธุรกิจและผู้ใช้ให้ปลอดภัย คุณควรเพิ่ม URL /.well-known/change-password ลงในเว็บไซต์เพื่อเปลี่ยนเส้นทางไปยังหน้าการจัดการรหัสผ่านเพื่อให้ดำเนินการได้ง่ายขึ้น ซึ่งจะช่วยให้เครื่องมือจัดการรหัสผ่านนำผู้ใช้ไปยังหน้าเว็บที่เปลี่ยนรหัสผ่านสำหรับเว็บไซต์ของคุณได้โดยตรง ฟีเจอร์นี้พร้อมใช้งานใน Safari, Chrome และกำลังจะพร้อมใช้งานในเบราว์เซอร์อื่นๆ ช่วยให้ผู้ใช้เปลี่ยนรหัสผ่านได้ง่ายๆ ด้วยการเพิ่ม URL ที่รู้จักกันดีสำหรับเปลี่ยนรหัสผ่านจะอธิบายวิธีใช้ฟีเจอร์นี้

นอกจากนี้ คุณควรทำให้ผู้ใช้ลบบัญชีของตนเองได้ง่ายหากต้องการ

เสนอการเข้าสู่ระบบผ่านผู้ให้บริการข้อมูลประจำตัวของบุคคลที่สาม

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

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

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

การผสานรวม Google Sign-In เข้ากับเว็บแอปอธิบายวิธีเพิ่มการเข้าสู่ระบบแบบรวมศูนย์ลงในตัวเลือกการลงชื่อสมัครใช้ แพลตฟอร์มข้อมูลประจำตัวอื่นๆ อีกมากมายมีให้บริการ

เปลี่ยนบัญชีได้อย่างง่ายดาย

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

ลองใช้การตรวจสอบสิทธิ์แบบหลายปัจจัย

การตรวจสอบสิทธิ์แบบหลายปัจจัยหมายถึงการตรวจสอบว่าผู้ใช้ให้การตรวจสอบสิทธิ์มากกว่า 1 วิธี ตัวอย่างเช่น นอกจากกำหนดให้ผู้ใช้ตั้งรหัสผ่านแล้ว คุณยังอาจบังคับใช้การยืนยันโดยใช้รหัสผ่านแบบใช้ครั้งเดียวที่ส่งทางอีเมลหรือ SMS หรือใช้รหัสแบบใช้ครั้งเดียวที่คีย์ความปลอดภัยหรือเซ็นเซอร์ลายนิ้วมือซึ่งอิงตามแอป แนวทางปฏิบัติแนะนำเกี่ยวกับ OTP ทาง SMS และการเปิดใช้การตรวจสอบสิทธิ์ที่รัดกุมด้วย WebAuthnอธิบายวิธีใช้การตรวจสอบสิทธิ์แบบหลายปัจจัย

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

โปรดระมัดระวังเกี่ยวกับชื่อผู้ใช้

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

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

และโปรดใช้ autocomplete="username" สำหรับชื่อผู้ใช้

ทดสอบในอุปกรณ์ แพลตฟอร์ม เบราว์เซอร์ และเวอร์ชันต่างๆ

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

ใช้ Analytics และ Real User Monitoring

คุณต้องมีข้อมูลภาคสนามและข้อมูลห้องทดลองเพื่อทําความเข้าใจประสบการณ์ของผู้ใช้กับแบบฟอร์มลงชื่อสมัครใช้ Analytics และการตรวจสอบผู้ใช้จริง (RUM) ให้ข้อมูลเกี่ยวกับประสบการณ์การใช้งานจริงของผู้ใช้ เช่น เวลาที่ใช้ในการโหลดหน้าลงชื่อสมัครใช้ คอมโพเนนต์ UI ที่ผู้ใช้โต้ตอบด้วย (หรือไม่โต้ตอบ) และเวลาที่ผู้ใช้ใช้ในการลงชื่อสมัครใช้

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

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

เรียนรู้ต่อไป

• แนวทางปฏิบัติแนะนำสำหรับแบบฟอร์มลงชื่อเข้าใช้
• แนวทางปฏิบัติแนะนำสำหรับแบบฟอร์มการชำระเงินและที่อยู่
• สร้างแบบฟอร์มที่ยอดเยี่ยม
• แนวทางปฏิบัติแนะนำสำหรับการออกแบบแบบฟอร์มบนอุปกรณ์เคลื่อนที่
• การควบคุมแบบฟอร์มที่มีประสิทธิภาพมากขึ้น
• การสร้างแบบฟอร์มที่เข้าถึงได้
• ปรับปรุงขั้นตอนการลงชื่อสมัครใช้โดยใช้ Credential Management API
• ยืนยันหมายเลขโทรศัพท์บนเว็บด้วย WebOTP API

รูปภาพโดย @ecowarriorprincess ใน Unsplash