9 หน้า Landing Page ที่ดีที่สุดและสิ่งที่คุณสามารถเรียนรู้จากพวกเขา

บทความที่เขียนโดย:
  • เคล็ดลับการเขียนบล็อก
  • อัปเดตเมื่อ: Feb 21, 2017

ไม่มีการออกแบบที่ทำให้หน้า Landing Page สมบูรณ์แบบ แต่มีส่วนผสมสำคัญบางอย่างที่สามารถช่วยได้

เราได้พูดคุยเกี่ยวกับรายการเหล่านี้มากมายในช่วงหลายเดือนที่ผ่านมาที่ WHSR เช่น:

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

  • พาดหัวข่าวที่ยอดเยี่ยม
  • หัวเรื่องย่อย
  • เนื้อหาหน้า Landing Page ที่เข้มแข็ง แต่ควบแน่น
  • ใบรับรอง
  • การนำทางแบบง่าย
  • การใช้ภาพที่เพิ่มคุณค่าให้กับภาพ

หนึ่งในวิธีที่ดีที่สุดในการเรียนรู้วิธีสร้างหน้า Landing Page ที่สวยงามซึ่งส่งผลต่อ Conversion ศึกษาหน้า Landing Page ของธุรกิจอื่น ๆ. เมื่อมองไปที่สิ่งที่ถูกต้องคุณสามารถทำซ้ำความพยายามและความสำเร็จของพวกเขาได้

Wishpond

หน้า Landing Page ปรารถนา

[icon link] URL ของเว็บไซต์: http://blog.wishpond.com/

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

หมี CSS

หมี css
[icon link] URL ของเว็บไซต์: http://bearcss.com/

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

เครื่องวิเคราะห์ PPC

เชื่อมโยงไปถึงเครื่องวิเคราะห์ ppc

[icon link] URL ของเว็บไซต์: http://www.ppcanalyzer.com/

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

  • เพิ่มการแปลง
  • ลดต้นทุน
  • ประหยัดเวลา

แอปเปิล

แอปเปิล

[icon link] URL ของเว็บไซต์: http://apple.com

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

Unbounce

Unbounce

[icon link] URL ของเว็บไซต์: http://unbounce.com

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

iCracked

icracked

[icon link] URL ของเว็บไซต์: http://icracked.com

iCracked เป็น บริษัท ที่มาแทนที่หน้าจอ iPhone เสียรวมถึงการซ่อมอุปกรณ์ Apple อื่น ๆ หน้า Landing Page ที่นี่ง่าย พวกเขากำลังพยายามทำสิ่งใดสิ่งหนึ่งต่อไปนี้:

  • ขายบริการซ่อมแซมอุปกรณ์ของคุณ
  • ซื้ออุปกรณ์ที่คุณไม่ต้องการอีกต่อไป

หน้า Landing Page นี้ใช้ภาพขนาดใหญ่เพื่อตั้งค่าเสียง แต่อยู่ในเฉดสีกลางซึ่งดึงดูดสายตาให้กับตัวเลือกสองแบบที่ห่อหุ้มไว้ CTAs เป็นปุ่มที่สดใสในสีฟ้าและสีเขียวสดใส

U-Haul

เชื่อมโยงไปถึง uhaul

[icon link] URL ของเว็บไซต์: http://uhaul.com

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

Big Barker

กะโหลกใหญ่

[icon link] URL ของเว็บไซต์: http://bigbarker.com

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

อย่างไรก็ตามสิ่งที่หน้า Landing Page นี้ไม่ถูกต้องคือการเพิ่มปัจจัยความไว้วางใจสองสามประการที่ผู้อ่านจะเกี่ยวข้อง ประการแรกการทบทวนโดยเฉลี่ยของ Amazon คือดาว 5 และพวกเขาเน้นที่ด้านขวาภายใต้ภาพของเตียงสุนัขของพวกเขา นอกจากนี้ยังเพิ่มแบนเนอร์ "Google Trusted Store" เพื่อแจ้งให้คุณทราบว่าพวกเขาได้ทำงานอย่างหนักเพื่อความพึงพอใจของลูกค้า พวกเขากล้าคำว่า "รับประกัน" และที่ด้านบนพวกเขาให้ชัดเจนว่ามีการรับประกัน 10 ปีและเป็นเตียงที่มีคุณภาพที่ผลิตในประเทศสหรัฐอเมริกา เหล่านี้คือตัวชี้วัดความน่าเชื่อถือทั้งหมดที่ผู้เข้าชมเว็บไซต์จะตอบสนอง ด้วยการปรับแต่งเล็กน้อยไซต์นี้จะเห็นการเพิ่มขึ้นอย่างมากใน Conversion

Sharelock

sharelock

[icon link] URL ของเว็บไซต์: https://sharelock.io/

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

ให้การทดสอบและการเรียนรู้

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

เกี่ยวกับ Lori Soard

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