9 แนวคิดเกี่ยวกับหน้า Landing Page เพื่อปรับปรุงอัตราการแปลงและการขายของคุณ
เผยแพร่แล้ว: 2017-10-10“การเลียนแบบเป็นการเยินยอที่จริงใจที่สุด”
สุภาษิตที่มีชื่อเสียงนั้นเป็นความจริงในหลายๆ เรื่อง และหน้า Landing Page หลังการคลิกก็ไม่ต่างกัน
เป็นเรื่องปกติอย่างสมบูรณ์ (และแนะนำ) ในการทบทวนตัวอย่างหน้า Landing Page หลังการคลิกของบริษัทอื่นเพื่อเป็นแรงบันดาลใจในการสร้างหน้าพร้อม Conversion มากที่สุดเท่าที่จะเป็นไปได้
การทำความเข้าใจว่าผู้คนอ่านเนื้อหาออนไลน์อย่างไรเป็นองค์ประกอบสำคัญของกระบวนการนี้ โดยเฉพาะอย่างยิ่งเมื่อคุณรู้ว่าช่วงความสนใจของผู้ใช้เว็บโดยเฉลี่ยอยู่ที่ประมาณ 6-8 วินาที และคุณจำเป็นต้องให้ผู้เข้าชมมีส่วนร่วมกับหน้าเว็บของคุณในช่วงวินาทีสำคัญเหล่านั้น
มีตัวอย่างหน้า Landing Page หลังคลิกหลายร้อยตัวอย่างเพื่อรับแรงบันดาลใจจาก อันที่จริง เรามีหมวดหมู่บล็อกทั้งหมดสำหรับหัวข้อนี้โดยเฉพาะจากแบรนด์ที่เป็นที่รู้จักมากที่สุดในโลก
ในบทความของวันนี้ เราจะนำเสนอตัวอย่างมากมายที่เน้นเคล็ดลับประสบการณ์ผู้ใช้ องค์ประกอบที่สำคัญของเฟรมเวิร์กหน้า Landing Page หลังคลิก และแนวคิดหน้า Landing Page หลังการคลิกอื่นๆ เพื่อสร้างแรงบันดาลใจในการออกแบบครั้งต่อไปของคุณ
สุดยอดแนวคิดหน้า Landing Page หลังคลิก
เพิ่มพื้นที่สีขาวเพียงพอ
มีแนวคิดในการออกแบบหน้าเว็บมากมายในคลังแสงของคุณ แต่พื้นที่สีขาว (หรือที่รู้จักกันว่าพื้นที่ว่างหรือพื้นที่เชิงลบ) อาจเป็นเทคนิคที่ไม่ค่อยได้ใช้มากที่สุด แม้ว่าจะมีจุดประสงค์หลายประการก็ตาม ไม่เพียงแต่ทำให้หน้าของคุณดูรกน้อยลงและสวยงามยิ่งขึ้นเท่านั้น แต่ยัง:
- เพิ่มความสามารถในการอ่าน
- ปรับปรุงการมุ่งเน้นองค์ประกอบที่สำคัญ
- ช่วยให้เข้าใจข้อเสนอของคุณมากขึ้น
- ปรับปรุงประสบการณ์ผู้ใช้
เมื่อทราบแล้ว ให้เปรียบเทียบการออกแบบพื้นที่สีขาวบนหน้าเว็บสองหน้าที่แตกต่างกัน
นี่คือหนึ่งจาก Ashworth College ที่ขาดพื้นที่สีขาวอย่างชัดเจน:

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

มีพื้นที่เพียงพอรอบๆ พาดหัวและคำอธิบายเล็กๆ รวมถึงแบบฟอร์มการจับลูกค้าเป้าหมาย มีพื้นที่เพียงพอระหว่างส่วนต่างๆ ทำให้ง่ายต่อการไปยังส่วนต่างๆ ของหน้าและทำความเข้าใจข้อเสนอได้ดียิ่งขึ้น ทุกองค์ประกอบของหน้า Landing Page หลังการคลิกจะดึงดูดความสนใจเนื่องจากไม่ได้รวมเข้าด้วยกันเช่นหน้า Ashworth College
ตัวอย่างนี้มอบประสบการณ์การใช้งานที่สนุกสนานยิ่งขึ้นแก่ผู้ใช้และมีแนวโน้มว่าจะให้ผลลัพธ์การแปลงที่ดีขึ้น
รวมตัวชี้นำภาพที่ชัดเจน
ตัวชี้นำภาพหรือตัวชี้นำทิศทาง — ทั้งแบบชัดแจ้งและโดยปริยาย — ทั้งคู่ช่วยแปลงหน้า Landing Page หลังคลิก เพราะพวกเขาบอกผู้เยี่ยมชม อย่างชัดเจนถึงสิ่งที่พวกเขาควรให้ความสนใจ (เช่น แบบฟอร์มและปุ่ม CTA ของคุณ)
ขั้นแรก ให้ดูที่ตัวชี้นำที่ชัดเจน ซึ่งตรงไปตรงมามากกว่าและสามารถจดจำได้ง่ายบนหน้าเว็บ
วิธีหลักวิธีหนึ่งในการรวมภาพที่ชัดเจนเข้ากับการออกแบบหน้า Landing Page หลังการคลิกคือการเพิ่มลูกศรที่ชี้ไปยังองค์ประกอบของหน้าที่สำคัญที่สุด เช่น ปุ่มแบบฟอร์มและ/หรือปุ่ม CTA
Sage Intacct ทำให้ชัดเจนว่าพวกเขาต้องการให้คุณสังเกตเห็นอะไรโดยใส่ลูกศรสีส้มสดใสจากพาดหัวไปยังแบบฟอร์ม:

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

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

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

เมื่อผู้เยี่ยมชมได้ตรวจสอบหน้าและมุ่งมั่นที่จะแลกรับข้อเสนอ พวกเขาคลิกปุ่ม CTA “รับเอกสารรายงาน” สีส้ม และจะได้รับแบบฟอร์มนี้:

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

ดูว่าฟอร์มยาวแค่ไหน? มีแนวโน้มว่าจะไม่มีใคร ต้องการ กรอกข้อมูลในฟิลด์ของแบบฟอร์มเหล่านั้นทั้งหมด หมายความว่า Qlik จะได้รับประโยชน์จากการออกแบบใหม่เป็นรูปแบบหลายขั้นตอนเพื่อลดแรงเสียดทานบนหน้า
ในทางกลับกัน AARP มีแนวคิดที่ถูกต้อง พวกเขาสร้างแบบฟอร์มหลายขั้นตอนในหน้านี้สำหรับผู้มีโอกาสเป็นลูกค้าเพื่อขอคู่มือการตัดสินใจฟรีสำหรับแผนประกัน AARP Medicare Supplement จดแถบความคืบหน้าเหนือแบบฟอร์มด้วย นี่เป็นอีกหนึ่งแนวคิดของหน้า Landing Page ที่ชาญฉลาดเนื่องจากช่วยให้ผู้มีแนวโน้มเป็นลูกค้าทราบว่าพวกเขาอยู่ในขั้นตอนการสมัครใช้งานมากน้อยเพียงใด:


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

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



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

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

ถึงจุดนั้น Discover ได้รวมภาพที่สมจริงและเกี่ยวข้องมากขึ้นในหน้า Landing Page หลังการคลิก:

สำหรับเคล็ดลับและกลเม็ดเพิ่มเติมในการเลือกภาพถ่ายสต็อกที่ดีที่สุดสำหรับแคมเปญการตลาดของคุณ ดาวน์โหลดคู่มือใหม่นี้
เลือกใช้วิดีโอแทนข้อความ
จำสิ่งที่เราพูดในบทนำได้ไหม? ช่วงความสนใจเฉลี่ยของผู้ใช้เว็บอยู่ที่ประมาณ 6-8 วินาที
โชคดีที่การเพิ่มวิดีโอลงในหน้า Landing Page หลังการคลิกสามารถช่วยดึงดูดผู้เยี่ยมชมของคุณได้ทันทีและให้ความสำคัญกับพวกเขา ด้วยการอธิบายข้อเสนอของคุณในแบบที่กระชับและโต้ตอบได้มากขึ้น วิดีโอมีศักยภาพที่จะเพิ่ม Conversion ทั้งหมดของคุณได้มากถึง 86%
วิดีโอเหมาะอย่างยิ่งสำหรับการถ่ายทอด UVP ของแบรนด์ของคุณ เนื่องจากผู้มีแนวโน้มจะดูวิดีโอที่มีความยาว 1 นาทีมากกว่าการเลื่อนดูหน้า Landing Page ที่ยาวหลังจากคลิก
Wistia ส่งเสริม UVP และประโยชน์อื่นๆ มากมายในเวลาเพียงหนึ่งนาทีบนหน้า Landing Page หลังการคลิกนี้:

อินเตอร์คอมใช้แนวคิดหน้า Landing Page หลังการคลิกที่มีประสิทธิภาพเช่นกัน:

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

จากนั้น ข้อความรับรองที่ยกมาจะแสดงให้เห็นว่าบริษัทที่มีชื่อเสียงใช้ Smartsheet อย่างไร (พร้อมแสดงโลโก้ของบริษัท):

โลโก้เพิ่มเติมแสดงแอปยอดนิยมที่พวกเขารวมเข้ากับ:

คำรับรองจากลูกค้า — พร้อมด้วย headshot, ชื่อเต็ม, สังกัด และตำแหน่ง — เหนือปุ่ม CTA อันใดอันหนึ่งบนหน้า:

คำรับรองจากลูกค้าอีกรายพร้อมแนบโลโก้แบรนด์:

ป้ายที่แสดงรางวัลอุตสาหกรรม:

โลโก้เพิ่มเติมเพื่อส่งเสริมการรายงานข่าวเชิงบวกและการประชาสัมพันธ์:

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

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