ภาพฮีโร่คือสิ่งที่ผู้สร้างเว็บมักใช้เพื่อทักทายผู้เยี่ยมชมเว็บไซต์ของตนในรูปแบบที่น่าสนใจ

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

ภาพฮีโร่เป็นคำที่ผู้สร้างเว็บใช้เพื่ออธิบายเนื้อหาขนาดใหญ่ที่ด้านบนของหน้าเว็บ

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

มาทำความเข้าใจข้อดีหลักของการทำเช่นนี้และทำไม?

ภาพฮีโร่คืออะไร?

ด้วยการโอบกอดคุณธรรมของ "ความประทับใจแรกพบที่ดี" โดยทั่วไปแล้ว ภาพฮีโร่จะมีลักษณะดังต่อไปนี้อย่างน้อยหนึ่งอย่าง:

  • ภาพคุณภาพสูง
  • วีดีโอน่ารักๆ
  • ตัวเลื่อนรูปภาพหรือ ม้าหมุนมัลติมีเดีย
  • ภาพประกอบเคลื่อนไหวหรือคงที่
  • ส่วนหัวและคำอธิบายข้างหรือหน้าเนื้อหาภาพ

ในแง่ของสไตล์ รายละเอียดการออกแบบทั่วไปที่คุณจะเห็นว่าใช้กับรูปภาพฮีโร่ ได้แก่:

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

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

ทำไมคุณควรใช้ภาพฮีโร่?

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

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

สร้างความประทับใจแรกพบได้ยาวนาน

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

ผลลัพธ์ของผู้เชี่ยวชาญในการปฏิสัมพันธ์ระหว่างมนุษย์กับเครื่องจักร (HCI) และการสร้างภาพที่ การวิจัยของ Google ยืนยันถึงอิทธิพลของภาพฮีโร่ต่อความสำเร็จของเว็บไซต์:

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

ผู้เขียนได้แสดงภาพหน้าจอจริง 119 ภาพจากเว็บไซต์ให้กับผู้เข้าร่วมการศึกษา และพบว่าความซับซ้อนของภาพและการสร้างต้นแบบส่งผลต่อการรับรู้ด้านสุนทรียศาสตร์ของผู้ใช้ใน 50 ภาพแรกของการจัดแสดง และบางครั้งอาจถึงภายใน 17 มิลลิวินาที

ในฐานะผู้สร้างเว็บ ข้อสรุปของเราค่อนข้างง่าย: ภาพฮีโร่ที่เราเลือกและวิธีที่เรานำเสนอบนหน้าเว็บของเรามีอิทธิพลต่อความรู้สึกและพฤติกรรมของผู้ใช้ในลักษณะสำคัญ

คุณจะได้รับประโยชน์สูงสุดจากเนื้อหาของคุณครึ่งหน้าบน

การออกแบบเว็บครึ่งหน้าบน
นำมาจาก: crazyegg.com

ส่วน "ครึ่งหน้าบน" ของหน้าเว็บสามารถกำหนดได้ง่ายๆ ดังนี้ เนื้อหาที่เต็มหน้าจอของคุณ / ปรากฏเหนือขอบด้านล่างของหน้าต่างเว็บเบราว์เซอร์หลังจากโหลดหน้าของคุณ. หากเนื้อหาต้องการการเลื่อนเพื่อดู แสดงว่าเนื้อหานั้นอยู่ "ครึ่งหน้าล่าง"

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

นี่คือสาเหตุที่เนื้อหาของคุณในครึ่งหน้าบนอาจเป็นตัวทำลายข้อตกลงที่สำคัญในความสำเร็จของเว็บไซต์ของคุณ

เราหมายถึงอะไร?

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

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

อย่าลืมเกี่ยวกับการออกแบบที่ตอบสนอง

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

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

ระบุคุณค่าของคุณโดยไม่ต้องมีข้อมูลมากเกินไป

วิธีสร้างภาพฮีโร่

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

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

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

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

ภาพฮีโร่ของคุณสามารถช่วยแปลงลีดได้

วิธีสร้างภาพฮีโร่

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

ให้ข้อความ CTA ของคุณพูดว่า " สมัครตอนนี้ '" อ่านเพิ่มเติม '" ติดต่อเรา » ฯลฯ รูปภาพฮีโร่ของคุณต้องได้รับการประสานงานอย่างโปร่งใสในทุกด้าน: การมองเห็น การส่งข้อความ โทนสี ลักษณะที่ปรากฏ ฯลฯ

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

นี่คือสิ่งที่เราเห็นบนเว็บไซต์ Elementor ที่สร้างโดย STL การ์ตูนล้อเลียน, ทีมงานศิลปินการ์ตูนที่ให้บริการงานบันเทิง ชื่อภาพเคลื่อนไหว (ข้อความฮีโร่) แสดงให้เห็นลูกค้าที่มีความสุขในภาพฮีโร่ของพวกเขา ซึ่งแสดงให้เห็นว่าศิลปินการ์ตูนจัดเตรียมอะไรให้แต่ละคน

ดังนั้น เมื่อคุณพับแขนเสื้อขึ้นและเริ่มลงมือปฏิบัติจริงแล้ว อะไรจะเข้าสู่กระบวนการตัดสินใจว่าจะใช้อิมเมจฮีโร่ประเภทใด?

มาสำรวจภาพฮีโร่สี่ประเภทที่แตกต่างกันและวิธีประเมินว่าภาพใดดีที่สุดสำหรับเว็บไซต์ของคุณ

# 1 ภาพสินค้าฮีโร่

วิธีสร้างภาพฮีโร่

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

วิธีที่นิยมในหมู่นักออกแบบเว็บไซต์ในการแสดงและปรับแต่งภาพฮีโร่ผลิตภัณฑ์ของตน ได้แก่:

  • ตัวอย่างโดยละเอียด / ภาพรวมของผลิตภัณฑ์แต่ละรายการ ตามที่เราเห็นด้านบนบนเว็บไซต์ของบริษัท สมัครสมาชิกออสเตรเลีย avo คนรัก.
  • ภาพหน้าจอของอินเทอร์เฟซผลิตภัณฑ์ดิจิทัล เช่น แดชบอร์ด

รูปภาพฮีโร่ของผลิตภัณฑ์มักจะพบได้ในเว็บไซต์ของe-Commerce (แต่ไม่เฉพาะเจาะจง). ผู้มีโอกาสเป็นผู้ซื้อคาดหวังว่าจะได้เห็นตัวอย่างผลิตภัณฑ์จริง ซึ่งสนับสนุนการตัดสินใจอย่างชาญฉลาดเกี่ยวกับความเหมาะสมของร้านค้าสำหรับความต้องการในการจับจ่ายของพวกเขา

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

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

ปฏิบัติที่ดีที่สุด:

  • ลงทุนในคุณภาพของภาพพื้นหลัง

ไม่ว่าภาพพื้นหลังของคุณจะเป็นภาพถ่าย วิดีโอ ภาพประกอบ ฯลฯ ไฟล์ภาพควรจะเบาที่สุดเท่าที่จะเป็นไปได้ โดยมีความละเอียดที่คมชัด

  • ใส่ใจกับระดับคอนทราสต์

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

# 2 รูปภาพของฮีโร่ลูกค้า

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

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

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

ปฏิบัติที่ดีที่สุด:

  • แบ่งปันกรณีการใช้งานและประสบการณ์ของลูกค้า

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

  • สัมพันธ์กับกลุ่มเป้าหมายของคุณ

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

# 3 รูปภาพของฮีโร่ผู้ก่อตั้ง

วิธีสร้างภาพฮีโร่

ภาพผู้ก่อตั้งคือภาพขนาดใหญ่ของผู้ก่อตั้งเจ้าของธุรกิจ วางไว้ในส่วนฮีโร่เพื่อทักทายผู้เยี่ยมชมเว็บไซต์

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

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

การเลือกภาพสำหรับภาพฮีโร่ผู้ก่อตั้งของคุณควรได้รับการจัดการด้วยความระมัดระวัง ด้วยตัวเลือกมากมายให้เลือก ซึ่งเดือดลงไป:

อะไรจะสื่อข้อความของแบรนด์คุณได้อย่างแข็งแกร่งที่สุด

นี่คือรูปถ่ายของผู้ก่อตั้งที่มองตรงมาที่กล้องแล้วยิ้ม หรืออาจจะมองไปคนละทาง?

หรือรูปถ่ายที่ตรงไปตรงมาของเจ้าของธุรกิจที่ขยันขันแข็งจะเหมาะกว่าหรือไม่?

ปฏิบัติที่ดีที่สุด:

  • ใส่ใจกับขนาดและขนาด

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

  • มุ่งเน้นไปที่สิ่งที่ภาพของคุณควรจะสื่อถึง

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

# 4 ภาพฮีโร่ที่ไม่มีบริบท

วิธีสร้างภาพฮีโร่

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

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

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

ทันทีที่ดวงตาของมนุษย์มองเห็นโครงสร้างทางกายภาพที่ครอบงำท้องฟ้า ก็เข้าใจดีว่าผู้เชี่ยวชาญด้านการตลาดเหล่านี้กำลังทำงานเพื่อทำให้ธุรกิจต่างๆ

ปฏิบัติที่ดีที่สุด:

  • ตรวจสอบให้แน่ใจว่าผู้เข้าชมเข้าใจว่าเหตุใดรูปภาพจึงมีความเกี่ยวข้อง

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

  • สร้างลิงค์ที่ชัดเจนระหว่างภาพฮีโร่และข้อความฮีโร่

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

  • สร้างโครงร่างการออกแบบที่เหนียวแน่น

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

องค์ประกอบของเมนูนำทาง โลโก้ ฯลฯ ...

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

วิธีทดสอบภาพลักษณ์ฮีโร่ของคุณ: วิธีที่เราชอบ

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

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

A / B ทดสอบภาพฮีโร่ของคุณ

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

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

ดำเนินการ การทดสอบ A / B ระหว่างสองตัวเลือกโหมดที่แตกต่างกัน (มีตัวเลือกโหมดผสมผสาน 13 ตัวเลือก) ให้คุณลองใช้โหมดมากกว่าหนึ่งโหมดเพื่อดูว่าโหมดใดได้รับการเลื่อน การคลิก และการมีส่วนร่วมมากที่สุด

หนึ่งในขั้นตอนที่พบบ่อยและสำคัญที่สุดในการทดสอบ A / B ในส่วนฮีโร่ของคุณคือการทดสอบตัวเลือกปุ่ม CTA อย่างน้อยสองตัวเลือกด้วย เพื่อระบุว่าปุ่มใดได้รับ Conversion มากที่สุด

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

ใช้เครื่องมือแผนที่ความร้อนเพื่อค้นหาพฤติกรรมของผู้ใช้

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

นี่คือข้อมูลบางส่วนที่เจ้าของเว็บไซต์สามารถรวบรวมได้จากการใช้เครื่องมือแผนที่ความร้อน:

  • รายการที่คลิกไม่ได้กวนใจผู้ใช้
  • ขนาดปุ่มใหญ่หรือเล็กเกินไป
  • สีของปุ่มจะมองไม่เห็น

เป็นฮีโร่ของเว็บไซต์ของคุณ

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

เทรนด์ของเว็บไซต์มีการพัฒนาอย่างต่อเนื่อง โดยเพิ่มคุณสมบัติใหม่ๆ ให้กับการออกแบบเว็บ สิ่งสำคัญเสมอคือการรักษาส่วนฮีโร่ของคุณให้อยู่ในแนวหน้าในการพิจารณาการออกแบบของคุณ - ตรวจสอบให้แน่ใจว่าส่วนนี้เข้าถึงศักยภาพในการนำเสนอเว็บไซต์ของคุณต่อฝูงชนเสมอ

รับ Elementor Pro ทันที!

สรุป

ที่นี่ ! บทความนี้จะแสดงให้คุณเห็นถึงวิธีการสร้างภาพลักษณ์ฮีโร่ หากคุณมีข้อสงสัยในการเดินทาง f onแจ้งให้เราทราบใน ความเห็น.

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

แต่ในขณะเดียวกัน แบ่งปันบทความนี้ในเครือข่ายโซเชียลต่าง ๆ ของคุณ.

...