เค้าโครงลำดับชั้นการออกแบบที่ดีที่สุดสำหรับโฮมเพจของคุณเพื่อดึงดูดลูกค้าและยอดขายเพิ่มขึ้น

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

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

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

โลโก้ของคุณไปทางซ้ายหรือตรงกลาง (และส่วนประกอบส่วนหัว)

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

โลโก้

ตำแหน่งโลโก้

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

แถบค้นหา

ความสำคัญของแถบการค้นหา

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

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

วางสิ่งนี้ในส่วนหัวของคุณและทำให้ชัดเจน

ไอคอนและปุ่มตะกร้าสินค้า

ภาพหน้าจอที่ 2015 06-01 11.25.00-AM

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

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

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

ประกาศการจัดส่งสินค้า

ภาพหน้าจอที่ 2015 06-01 11.25.09-AM

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

ภาพหน้าจอด้านบนแสดงตัวอย่างที่ดีว่า บริษัท Kutoa อธิบายนโยบายการจัดส่งของตนอย่างไรโดยไม่ต้องใช้พื้นที่มากเกินไป

แบนเนอร์ตามฤดูกาล

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

ปุ่มเข้าสู่ระบบ / ลงทะเบียน

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

เมนูการนำทางพร้อมแท็บที่เหมาะสม

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

รูปภาพหรือแถบเลื่อนที่มีการเรียกร้องให้ดำเนินการและปุ่มแบบโอเวอร์เลย์

CTA เลื่อน

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

รวมสี่หรือห้าสไลด์ในแถบเลื่อนและเปลี่ยนออกตามกลยุทธ์ของคุณ

ตารางย่อของรูปสินค้าหรือแถบเลื่อน

ภาพขนาดเล็กเป็นแถบเลื่อนหรือตาราง

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

แบบฟอร์มสมัครสมาชิกการตลาดอีเมล์

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

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

ร้านค้าอื่น ๆ ต้องการแถบด้านข้างหรือส่วนท้ายเมื่อแบ่งปันแบบฟอร์มการสมัครจดหมายข่าว ฉันสังเกตเห็นว่าร้านค้าออนไลน์โดยทั่วไปจะวางแบบฟอร์มไว้ที่ด้านล่างของหน้าเมื่อพวกเขาไม่ได้ส่งอีเมลจำนวนมาก พวกเขาเพียงแค่พยายามรวบรวมอีเมลเพื่อส่งโปรโมชั่นเป็นครั้งคราว
ภาพหน้าจอที่ 2015 06-01 11.25.39-AM

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

แถบด้านข้างหรือเลย์เอาต์ตามกริด

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

เค้าโครง gridbased

ส่วนประกอบที่เป็นของแข็งที่จะรวมในแถบด้านข้างคืออะไร

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

เข้ามาล่าสุด

ส่วนท้าย

ลูกค้าส่วนใหญ่ของคุณจะไม่นำทางไปยังส่วนท้าย แต่จำเป็นต้องมีลิงก์ที่สำคัญ แต่มีความจำเป็นน้อยกว่า

ส่วนท้าย

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

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

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

ภาพคุณลักษณะคุณลักษณะปิดกั้นของ Chris Bannister

Catalin Zorzini

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