Directional Cues: เคล็ดลับการออกแบบที่ให้ผู้เข้าชมดำเนินการ
เผยแพร่แล้ว: 2017-02-17คุณเพิ่งออกแบบหน้า Landing Page ถัดไปหลังจากคลิกเสร็จ คุณสร้างพาดหัวและพาดหัวย่อยของนักฆ่า เขียนสำเนาที่โน้มน้าวใจเป็นพิเศษ ทำให้แบบฟอร์มของคุณสมบูรณ์แบบ สร้าง CTA ที่ดีที่สุดเท่าที่เคยมีมา และลำดับชั้นของเพจก็ตรงจุด ทุกองค์ประกอบอยู่ในตำแหน่งที่ดีที่สุดในการโน้มน้าวให้ผู้เข้าชมทำ Conversion
ดังนั้นหน้า Landing Page หลังการคลิกของคุณก็พร้อมที่จะเผยแพร่แล้วใช่ไหม ไม่ค่อย.
คุณจะแน่ใจได้อย่างไรว่าผู้เยี่ยมชมดูวิดีโอนั้นที่ทีมของคุณใช้เวลาสร้างนานหลายชั่วโมง หรือผู้เยี่ยมชมคลิกปุ่ม CTA ที่สมบูรณ์แบบ?
อย่าปล่อยให้สิ่งเหล่านี้เป็นโอกาส นำผู้เยี่ยมชมตรงไปยังที่ที่คุณต้องการให้ไป ให้พวกเขาดูว่าคุณต้องการให้พวกเขาโฟกัสไปที่จุดใด (และดำเนินการ) องค์ประกอบหน้า Landing Page ที่สำคัญที่สุดหลังการคลิกของคุณ
เช่นเดียวกับเลย์เอาต์ F-Pattern และ Z-Pattern การใช้ตัวชี้นำทิศทาง (aka ตัวชี้นำภาพ) สามารถโน้มน้าวผู้เยี่ยมชมของคุณเพื่อนำทางหน้าของคุณด้วยความตั้งใจ ส่วนประกอบการออกแบบหน้า Landing Page หลังการคลิกทั้งสามนี้ใช้หลักจิตวิทยาในการโน้มน้าวการกระทำของผู้ใช้และช่วยบังคับให้พวกเขาดำเนินการ
มาดูกันดีกว่าว่ามันทำงานอย่างไร
ตัวชี้ทิศทางคืออะไร?
ตัวชี้นำทิศทางเป็นตัวช่วยด้านภาพ เช่น ลูกศรหรือการเพ่งสายตาของโมเดล ที่ชี้ไปยังองค์ประกอบที่สำคัญที่สุดของหน้า Landing Page หลังการคลิกของคุณ เช่น แบบฟอร์มการจับลูกค้าเป้าหมาย CTA วิดีโอ คำรับรอง หรือข้อมูลในครึ่งหน้าล่าง
ตัวชี้นำทิศทางมีสองประเภทพื้นฐาน: ตัวชี้ทิศทางโดยนัยและตัวชี้ทิศทางที่ชัดเจน
ก่อนที่เราจะตรวจสอบว่าทั้งสองสิ่งนี้สามารถมุ่งความสนใจของผู้เยี่ยมชมโดยเจตนาได้อย่างไร มาดูจิตวิทยาเบื้องหลังโสตทัศนูปกรณ์เหล่านี้กันก่อน
จิตวิทยาเบื้องหลังการชี้นำภาพ
การมองเห็นเป็นสัญญาณหรือความรู้สึก และสมองของคุณสามารถระบุสัญญาณดังกล่าวได้โดยไม่รู้ตัว ตัวอย่างเช่น ในเดทแรก คุณสามารถเรียนรู้มากมายเกี่ยวกับการออกเดทของคุณโดยบรรยากาศที่เขาหรือเธอส่ง เช่น ภาษากาย การสบตา การแสดงออกทางสีหน้า ซึ่งแสดงให้คุณเห็นว่าบุคคลนั้นสนใจหรือไม่ คุณรับความรู้สึกเหล่านี้จากทุกคนโดยไม่รู้ตัว
คลิกเพื่อทวีต
คุณสามารถถ่ายทอดและรับความรู้สึกเดียวกันในบริบทของการตลาดดิจิทัลและด้วยแลนดิ้งเพจหลังการคลิก ภาพที่เห็นบนหน้า Landing Page หลังการคลิกทำให้ผู้เยี่ยมชมได้รับข้อความที่ละเอียดอ่อน ความรู้สึก และความรู้สึก
ด้วยแลนดิ้งเพจหลังการคลิก อะไรเป็นตัวกำหนดว่าเราแปลความรู้สึกหรือสัญญาณเหล่านี้อย่างไร โดยปกติแล้ว ประสบการณ์ในอดีตและความรู้ที่เก็บไว้ของเรานั้นมีแนวโน้มที่จะมีอิทธิพลต่อการรับรู้ของเรา และดังที่คุณจะเห็นด้านล่าง สัญญาณต่างๆ ที่สามารถช่วยแนะนำผู้เข้าชมให้มีส่วนร่วมกับเพจของคุณและดำเนินการได้
ตัวชี้นำทิศทางโดยนัยบนหน้า Landing Page หลังการคลิก
ตัวชี้นำโดยนัยนั้นละเอียดอ่อนและมักจะไม่มีใครสังเกตเห็นโดยผู้เยี่ยมชม ประเภทที่พบบ่อยที่สุด ได้แก่ พื้นที่สีขาว คอนทราสต์ของสี และการห่อหุ้ม มาดูทีละอย่างกัน:
พื้นที่สีขาว
พื้นที่สีขาวคือพื้นที่เชิงลบหรือพื้นที่ว่างของหน้า Landing Page หลังการคลิกที่ช่วยดึงดูดความสนใจไปยังองค์ประกอบเฉพาะ การเพิ่มพื้นที่สีขาวจะช่วยให้เพจของคุณง่ายขึ้น ปรับปรุงประสบการณ์ผู้ใช้ และเพิ่มความเข้าใจโดยรวมของข้อเสนอของคุณ นั่นเป็นเพราะว่าด้วยองค์ประกอบที่น้อยลง ผู้เข้าชมจะถูกบังคับให้ดูสิ่งที่คุณต้องการ
นี่คือหน้า Landing Page หลังการคลิกจาก Percolate ที่ใช้พื้นที่สีขาวจำนวนมากล้อมรอบพาดหัว หัวเรื่องย่อย และแบบฟอร์มการจับลูกค้าเป้าหมาย:

ความคมชัดของสี
สีที่ตัดกันทำหน้าที่เป็นตัวชี้นำ เนื่องจากความแตกต่างของสีที่เด่นชัดทำให้ผู้เยี่ยมชมให้ความสนใจกับบริเวณนั้น
เพื่อแสดงให้เห็น Marketo เสนอคู่มือการตลาดโซเชียลมีเดียบนหน้า Landing Page หลังการคลิก แต่ CTA หายไปเนื่องจากไม่มีคอนทราสต์ของสี:

แต่ในหน้า Landing Page หลังการคลิกของ Codify Academy ปุ่ม CTA จะกระโดดออกจากหน้าเนื่องจากสีแดงตัดกับสีอื่นๆ ทั้งหมด:

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

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

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

หลักฐานทางสังคม (เช่น ข้อความรับรอง) ยังสามารถใช้ประโยชน์จากการจ้องตาดังที่เห็นในหน้าของ When I Work:

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

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

แม้ว่าผู้ใช้เว็บจะเคยชินกับการเลื่อนดู แต่โดยทั่วไปแล้วลูกศรก็ถูกวางไว้เพื่อช่วยให้ผู้เยี่ยมชมนำทางไปครึ่งหน้าล่าง ตรวจสอบวิธีที่ Constant Contact ทำสิ่งนี้ด้วยลูกศรล้อมรอบอย่างง่าย:

นี่เป็นอีกเรื่องหนึ่งจาก Boardvantage — ซึ่งลูกศรถูกเชื่อมโยงหลายมิติ เมื่อคลิกแล้ว หน้าจะเลื่อนไปครึ่งหน้าล่างและแสดงกรณีการใช้งานที่แตกต่างกันสามกรณี:

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

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