แบบฟอร์มติดต่อเป็นองค์ประกอบหลักของเว็บไซต์จำนวนมาก แม้ว่าโดยทั่วไปจะตรงไปตรงมา แต่คุณต้องตรวจสอบให้แน่ใจว่าใช้งานง่ายหากคุณต้องการรวบรวมโอกาสในการขายและติดต่อกับผู้ใช้ของคุณ โดยปกติจะไม่เป็นปัญหากับการจราจรในสำนักงาน แต่การใช้แบบฟอร์มอาจเป็นเรื่องยากหากคุณใช้อุปกรณ์เคลื่อนที่
ในบทช่วยสอนนี้เราจะพูดถึงความสำคัญของการออกแบบฟอร์มที่เหมาะกับอุปกรณ์เคลื่อนที่ ต่อไปเราจะแนะนำเคล็ดลับ XNUMX ประการเพื่อให้แน่ใจว่าแบบฟอร์มของคุณทำงานได้อย่างราบรื่นบนอุปกรณ์เคลื่อนที่
มาทำงานกันเถอะ!
ทำไมความสำคัญของรูปแบบของคุณจึงเหมาะกับอุปกรณ์เคลื่อนที่
แบบฟอร์มมีทุกรูปทรงและขนาด ส่วนใหญ่คุณจะต้องจัดการกับแบบฟอร์มการติดต่อ:
แบบฟอร์มการลงทะเบียน (สมัครสมาชิก) ยังเป็นที่นิยมอย่างมากเนื่องจากอนุญาตให้คุณรวบรวมอีเมลและกำหนดเป้าหมายในระหว่างแคมเปญ:
อย่างไรก็ตามแบบฟอร์มสามารถใช้เพื่อวัตถุประสงค์อื่น ๆ ได้ทุกประเภท ตัวอย่างเช่นคุณสามารถรวบรวมข้อมูลโดยใช้ การสำรวจออนไลน์หรือแบบสอบถาม ซึ่งในกรณีนี้คุณจะต้องใช้แบบฟอร์มที่อนุญาตให้ผู้ใช้ป้อนคำตอบ
กล่าวอีกนัยหนึ่งแบบฟอร์มมีความหลากหลายมากและเกือบทุกไซต์ใช้แบบฟอร์มไม่ทางใดก็ทางหนึ่ง ดังนั้นจึงจำเป็นอย่างยิ่งที่แบบฟอร์มของคุณจะต้องใช้งานง่าย (เว้นแต่คุณต้องการมอบประสบการณ์ที่น่าหงุดหงิดให้กับผู้เยี่ยมชมของคุณ)
การใช้แบบฟอร์มจากคอมพิวเตอร์เดสก์ท็อปหรือแล็ปท็อปมักจะง่ายมาก คุณมีเมาส์และคีย์บอร์ดเต็มรูปแบบดังนั้นการเลือกฟิลด์ที่คุณต้องการใช้และป้อนข้อมูลจึงไม่น่าจะเป็นปัญหา อย่างไรก็ตามการท่องเว็บจากสมาร์ทโฟนหรืออุปกรณ์ขนาดกะทัดรัดอื่น ๆ ของคุณมีความยุ่งยาก
เมื่อทำงานโดยใช้นิ้วของคุณบนหน้าจอขนาดเล็กการโต้ตอบกับแบบฟอร์มในบางครั้งอาจเป็นเรื่องยากลำบากเนื่องจากการตัดสินใจออกแบบที่ไม่ดี นี่คือสิ่งที่คุณควรหลีกเลี่ยงในการออกแบบของคุณเอง ท้ายที่สุดหากผู้ใช้มือถือไม่สามารถโต้ตอบกับแบบฟอร์มของคุณคุณอาจสูญเสีย Conversion โอกาสในการขายหรือเพียงแค่รบกวนผู้เยี่ยมชม
นอกจากนี้ยังควรทำความเข้าใจว่าการเข้าชมบนอุปกรณ์เคลื่อนที่มีความสำคัญมากกว่าแหล่งที่มาบนเดสก์ท็อป ในความเป็นจริงการเข้าชมบนมือถือได้แซงหน้าไปแล้วในช่วงไม่กี่ปีที่ผ่านมา ซึ่งหมายความว่าการออกแบบเว็บไซต์ที่เหมาะกับอุปกรณ์เคลื่อนที่ควรเป็นเป้าหมายหลักของคุณเมื่อเริ่มโครงการใหม่
เคล็ดลับ 5 สำหรับการออกแบบฟอร์มมือถือที่ใช้งานง่าย
โชคดีที่การออกแบบรูปแบบที่เหมาะกับอุปกรณ์เคลื่อนที่ไม่ใช่เรื่องยากอย่างที่คุณคิด ในกรณีส่วนใหญ่คุณต้องคำนึงถึงปัจจัยพื้นฐานบางประการและทดสอบแบบฟอร์มของคุณอย่างละเอียดก่อนนำไปใช้ มาพูดถึงวิธีทำกัน!
1 ลบส่วนที่ไม่จำเป็นออกทั้งหมด
ยิ่งแบบฟอร์มของคุณมีฟิลด์มากเท่าไหร่การใช้งานบนมือถือก็จะยากขึ้นเท่านั้น อันที่จริงการใช้แบบฟอร์มบนมือถือนั้นซับซ้อนกว่า ด้วยการลดจำนวนฟิลด์หรือส่วนต่างๆที่รวมอยู่ในแบบฟอร์มของคุณคุณสามารถเพิ่มโอกาสให้ผู้เยี่ยมชมกรอกข้อมูลได้มากที่สุด
นี่คือตัวอย่างรวดเร็วของ แบบฟอร์มติดต่อ ด้วยฟิลด์เพิ่มเติมบางอย่างที่ไม่จำเป็นบนมือถือ:
ในกรณีส่วนใหญ่ ทุกสิ่งที่คุณต้องการสำหรับความยอดเยี่ยม แบบฟอร์มติดต่อ คือชื่อ อีเมล และเนื้อหาของข้อความที่คุณต้องการรับ อย่างอื่นขึ้นอยู่กับประเภทของเว็บไซต์ที่คุณใช้และหากคุณพยายามรวบรวมโอกาสในการขาย
ท้ายที่สุดยิ่งมีช่องน้อยลงเท่าไหร่ผู้เยี่ยมชมอุปกรณ์เคลื่อนที่ก็จะใช้งานได้ง่ายขึ้นเท่านั้น ท้ายที่สุดแล้วการเลือกฟิลด์โดยใช้หน้าจอสัมผัสอาจเป็นเรื่องยุ่งยากไม่ว่าจะได้รับการออกแบบมาดีเพียงใดเพื่อลดจำนวนผู้ใช้ฮ็อพที่ต้องทำ
เป้าหมายของคุณ ณ จุดนี้คือการตรวจสอบแบบฟอร์มที่มีอยู่บนไซต์ของคุณ ดูแต่ละส่วนและพิจารณาว่าคุณต้องการฟิลด์เพิ่มเติมนอกเหนือจากที่กล่าวไว้ก่อนหน้านี้หรือไม่ หากมีช่องที่ไม่จำเป็นให้ลบออก
2 ใช้รายการแบบหล่นลงถ้าเป็นไปได้
พวกเราส่วนใหญ่รู้สึกสะดวกสบายในการพิมพ์บนอุปกรณ์เคลื่อนที่และใช้หน้าจอสัมผัส อย่างไรก็ตามการส่งข้อความหาเพื่อนและกรอกข้อความ แบบฟอร์มติดต่อ เป็นประสบการณ์ที่แตกต่างกันมากสองอย่าง ด้วยสิ่งเหล่านี้ มีโอกาสที่ดีที่คุณจะต้องหงุดหงิดหากคุณต้องพิมพ์ข้อมูลจำนวนมาก
วิธีหนึ่งในการทำให้ชีวิตผู้เยี่ยมชมบนมือถือของคุณง่ายขึ้นคือลดความซับซ้อนของตัวเลือกที่พวกเขาต้องทำเกี่ยวกับองค์ประกอบของไซต์ของคุณ เพื่อให้คุณได้ทราบว่าเรากำลังพูดถึงอะไรอยู่ ลองใช้ประโยชน์จากตัวอย่างก่อนหน้าของเรา การจอง ร้านอาหาร:
เพื่อทำ การจองคุณอาจต้องฝากชื่อ อีเมล โทรศัพท์ et ระบุเวลาและจำนวนคนที่อยู่ด้วย มีสองวิธีที่คุณสามารถสร้างฟิลด์แบบฟอร์มเพื่อตรวจสอบช่วงเวลาของวันได้ การจอง:
- กำหนดค่าเขตข้อมูลที่ยอมรับเฉพาะรายการที่เป็นตัวเลข
- ออกแบบรายการแบบหล่นลงรวมถึงเวลาที่มีอยู่ทั้งหมดสำหรับการจอง
อย่างที่คุณสามารถจินตนาการได้ว่าอย่างหลังนี้ใช้งานง่ายกว่าสำหรับผู้ใช้มือถือ ด้วยวิธีนี้พวกเขาไม่จำเป็นต้องป้อนตัวเลขและสามารถเลือกสิ่งที่ดีที่สุดสำหรับพวกเขาจากตัวเลือกที่คุณใส่ไว้
แนวคิดในการดูแบบฟอร์มของคุณและดูว่ามีฟิลด์ที่คุณสามารถแทนที่ด้วยเมนูแบบเลื่อนลงได้หรือไม่ จะไม่เป็นเช่นนั้นเสมอไปเนื่องจากคุณไม่สามารถใช้เมนูแบบเลื่อนลงเพื่อรวบรวมชื่อหรืออีเมล แต่สามารถใช้ตัวเลือกอื่น ๆ ได้
ไม่ว่าจะใช้งานในกรณีใดคุณต้องแน่ใจว่าเมนูแบบเลื่อนลงของคุณมีตัวเลือกที่ง่ายต่อการเลือกจากอุปกรณ์มือถือ กล่าวอีกนัยหนึ่งคือทำให้เมนูมีขนาดใหญ่พอที่ใครจะไม่ต้องถากถางเพื่อเลือกตัวเลือกที่เหมาะสม
3 ตรวจสอบให้แน่ใจว่าปุ่มส่งของคุณนั้นง่ายต่อการสัมผัส
เคล็ดลับนี้ค่อนข้างง่าย แต่ยังคงต้องกล่าวถึง ทุกรูปแบบที่คุณออกแบบควรมีวิธีให้ผู้ใช้ยืนยันว่าต้องการส่งข้อมูลที่ป้อน ในกรณีส่วนใหญ่นั่นหมายถึงการสร้างปุ่มส่ง:
เมื่อใช้คอมพิวเตอร์ทั่วไปการคลิกปุ่มส่งเป็นสิ่งที่เป็นธรรมชาติที่สุดในโลก อย่างไรก็ตามเราได้พบกับรูปแบบต่างๆบนมือถือซึ่งการกดปุ่มนั้นยากกว่ามาก
หากผู้เยี่ยมชมของคุณไม่สามารถส่งข้อมูลที่พวกเขาป้อนในแบบฟอร์มของคุณความพยายามทั้งหมดของคุณจะสูญเปล่า นอกจากนี้ไม่มีอะไรที่ดูไม่เป็นมืออาชีพเท่าปุ่ม ส่ง ที่ไม่ทำงานตามที่คาดไว้
ในการออกแบบปุ่มส่งที่ดีกว่าสำหรับมือถือต่อไปนี้เป็นเคล็ดลับสามข้อที่ควรพิจารณา:
- ตรวจสอบให้แน่ใจว่ามีขนาดใหญ่พอที่คุณจะแตะบนอุปกรณ์เคลื่อนที่ได้อย่างง่ายดาย
- อย่าวางปุ่มของคุณไว้ใกล้กับรายการอื่นมากเกินไปเพื่อที่ผู้ใช้จะไม่ได้สัมผัสอย่างถูกต้อง
- เน้นปุ่มของคุณเช่นใช้สีตัดกันหรือตัวอักษรที่สร้างสรรค์
ยิ่งไปกว่านั้นคุณจะต้องทดสอบปุ่มของคุณก่อนที่ไซต์ของคุณจะเผยแพร่ เราจะลงลึกมากขึ้นเกี่ยวกับวิธีการทำในอีกสักครู่ สำหรับตอนนี้เรามาพูดถึงประสิทธิภาพ
4 ตรวจสอบว่าฟอร์มของคุณโหลดได้อย่างรวดเร็ว
เราพูดถึงประสิทธิภาพของเว็บไซต์มากมายในบทความหลาย ๆ บทความของเราและไม่ใช่เพราะเราต้องการความรวดเร็ว ประเด็นคือคนส่วนใหญ่ไม่ชอบเว็บไซต์ที่ช้าซึ่งก็สมเหตุสมผลดี
ด้วยความเร็วของอินเทอร์เน็ตที่เร็วขึ้นอาจเป็นเรื่องยากที่จะรอให้เว็บไซต์โหลดนานเกินไป นอกจากนี้ความเร็วอินเทอร์เน็ตบนมือถือมักจะแตกต่างกันไปมากกว่าการเชื่อมต่อภายในบ้านทั่วไป ซึ่งหมายความว่าเว็บไซต์ของคุณจะต้องได้รับการปรับให้เหมาะสมอย่างมากสำหรับอุปกรณ์มือถือหากคุณต้องการให้ผู้ใช้เหล่านี้มีความสุขเนื่องจากไม่ใช่ทุกคนที่เข้าถึงอินเทอร์เน็ตได้ (เช่นรวดเร็ว)
เคล็ดลับเฉพาะนี้สามารถใช้ได้กับทั้งเว็บไซต์ของคุณ แต่ก็สำคัญเช่นกันสำหรับหน้ามือถือที่แสดงแบบฟอร์มของคุณ หากส่วนเหล่านี้ของไซต์ของคุณใช้เวลาโหลดนานเกินไป คุณ สูญเสียการแปลง และโอกาสในการติดต่อกับผู้เยี่ยมชมของคุณ
โดยทั่วไปเว็บไซต์ควรใช้เวลาโหลดไม่เกินสองวินาที เมื่อคุณผ่านขีด จำกัด นี้แล้วอัตราตีกลับมักจะเพิ่มขึ้นอย่างมากซึ่งเป็นข่าวร้ายสำหรับคุณและด้วยลักษณะของการท่องเว็บบนมือถือคุณควรรักษาเวลานี้ให้ต่ำที่สุด .
ด้วยเหตุนี้ จึงมีหลายวิธีในการปรับปรุงประสิทธิภาพโดยรวมของไซต์ของคุณ ตัวอย่างเช่น คุณสามารถอัปเกรดเป็นแผนที่ดีกว่าได้ที่พักให้ใช้ธีมตอบสนองที่ปรับให้เหมาะสมเพื่อความเร็วและ บีบอัดภาพของคุณ. แน่นอนว่าสิ่งเหล่านี้จะช่วยผู้ใช้ทุกคน แต่จะมีประโยชน์อย่างยิ่งสำหรับผู้ที่ใช้อุปกรณ์ขนาดเล็ก
5 ทดสอบแบบฟอร์มก่อนเผยแพร่
เมื่อพิจารณาว่าแบบฟอร์มเป็นส่วนสำคัญของเว็บไซต์ส่วนใหญ่คุณควรทดสอบอย่างละเอียดก่อนเผยแพร่ ด้วย WordPress กระบวนการนี้ค่อนข้างตรงไปตรงมา คุณสามารถดำเนินการต่อและออกแบบหน้าเฉพาะเพื่อแสดงแบบฟอร์มของคุณและไม่เผยแพร่จนกว่าคุณจะทดสอบอย่างสมบูรณ์
แน่นอนว่าปลั๊กอินหรือธีมใดที่คุณต้องการใช้ขึ้นอยู่กับคุณ (ตราบใดที่สามารถช่วยพัฒนาไซต์บนอุปกรณ์เคลื่อนที่ได้) อย่างไรก็ตามเมื่อพูดถึงขั้นตอนการทดสอบเราขอแนะนำให้คุณทำให้เรียบง่ายและใช้เครื่องมือเช่น เครื่องมือ ของการพัฒนา Chrome การทำงาน
มาดูตัวอย่างสั้น ๆ กัน หากคุณใช้ Chrome ให้ไปข้างหน้าและดูตัวอย่างหน้าด้วยแบบฟอร์มที่คุณต้องการทดสอบ จากนั้นคลิกขวาที่ใดก็ได้ในหน้านี้และเลือกตัวเลือก ตรวจ . Chrome จะแสดงชุดเครื่องมือที่คุณสามารถใช้เพื่อตรวจสอบและแก้ไขซอร์สโค้ดของเพจทางด้านขวาและทางด้านซ้ายคุณสามารถดูตัวอย่างลักษณะที่ปรากฏได้จากอุปกรณ์เคลื่อนที่:
ที่ด้านบนของหน้าจอคุณสามารถใช้เมนูเพื่อสลับระหว่างความละเอียดต่างๆ Chrome มีการตั้งค่าสำหรับโทรศัพท์มือถือยอดนิยมหลายประเภท แต่คุณสามารถป้อนความละเอียดที่กำหนดเองได้
ณ จุดนี้คุณควรตรวจสอบลักษณะและพฤติกรรมของแบบฟอร์มการติดต่อของคุณบนอุปกรณ์หลายเครื่อง ลองดูตัวอย่างด้านล่าง - แบบฟอร์มใช้งานได้ดี แต่คุณจะเห็นว่ามันไม่พอดีเท่าที่ควร ให้ความสนใจเป็นพิเศษกับข้อความและไอคอนซึ่งอยู่ใกล้ขอบหน้าจอมากเกินไป:
วิธีหนึ่งในการป้องกันปัญหานี้คือทำให้แบบฟอร์มของคุณเรียบง่ายดังที่เราได้กล่าวไว้ในเคล็ดลับแรก ในตัวอย่างด้านล่างแบบฟอร์มใช้รายการดรอปดาวน์หลายรายการและต้องการเพียงสามฟิลด์ ทำให้ใช้งานง่ายและที่สำคัญกว่านั้นคือรูปแบบที่เรียบง่ายมากจนต้องพอดีกับอุปกรณ์ทั้งหมด:
หากคุณมีปัญหาใด ๆ กับแบบฟอร์มใด ๆ ของคุณคุณจำเป็นต้องแก้ไขทันที มิฉะนั้นคุณอาจเสี่ยงต่อการทำให้ผู้ชมบนมือถือของคุณแปลกแยกซึ่งเราพยายามหลีกเลี่ยงก่อน!
สรุป
การตรวจสอบให้แน่ใจว่าเว็บไซต์ของคุณเข้ากันได้กับอุปกรณ์เคลื่อนที่เป็นกุญแจสำคัญในการรักษาการเข้าชมและไม่ทำให้ผู้เข้าชมของคุณหงุดหงิด โดยเฉพาะแบบฟอร์มของคุณควรใช้งานง่ายบนอุปกรณ์เคลื่อนที่หากคุณไม่ต้องการพลาดการรับข้อความหรือรวบรวมโอกาสในการขายที่มีค่า
เมื่อพูดถึงการออกแบบรูปแบบที่เหมาะกับอุปกรณ์เคลื่อนที่ต่อไปนี้คือห้าเคล็ดลับเพื่อทำให้ชีวิตคุณง่ายขึ้น:
- ลบส่วนที่ไม่จำเป็นออกทั้งหมด
- ใช้รายการแบบหล่นลงถ้าเป็นไปได้
- ตรวจสอบให้แน่ใจว่าปุ่มส่งของคุณนั้นกดง่าย
- ตรวจสอบว่าฟอร์มของคุณโหลดได้อย่างรวดเร็ว
- ทดสอบแบบฟอร์มก่อนที่จะเผยแพร่