คุณต้องการภาพฮีโร่หรือไม่ บางที Typography ก็เพียงพอแล้ว

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

ทำให้เกิดคำถาม: คุณต้องการภาพฮีโร่จริงๆ หรือไม่

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

สำรวจ Envato Elements

ประโยชน์ของ Hero Image

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

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

โดยส่วนใหญ่แล้ว มนุษย์มีการมองเห็นโดยกำเนิด เราได้ความเข้าใจจากการเห็นสิ่งต่างๆ นั่นเป็นเหตุผลที่ภาพฮีโร่เป็นที่นิยมมาก

ประโยชน์ของภาพหลักยังรวมถึง:

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

ประโยชน์ของ Hero ที่เน้นการพิมพ์

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

คุณสามารถใช้การพิมพ์เพื่อบอกให้ผู้ใช้ทราบว่าคุณต้องการให้พวกเขารู้อะไร

ประโยชน์อื่นๆ ของพื้นที่ฮีโร่ตามตัวอักษร ได้แก่:

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

5 เหตุผลที่ Typography อาจดีที่สุด

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

นอกจากไม่มีรูปภาพที่ถูกต้องแล้ว ทำไมคุณถึงใช้ตัวพิมพ์-ตามฮีโร่?

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

ลองใช้แบบอักษรที่น่าสนใจ

เมื่อพูดถึงพื้นที่ฮีโร่ที่เน้นการพิมพ์ที่เด่นชัด มีสำนักคิดสองสำนัก:

• เรียบง่าย
• ลองใช้แบบอักษรที่น่าสนใจหรือแบบทดลอง

ถูกต้องทั้งคู่ และคุณสามารถลองใช้ร่วมกันได้

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

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

5ตัวอย่างที่เรารัก

MKTLM

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

ฟังก์ชัน & แบบฟอร์ม

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

Near North Studio

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

Liferay.Design

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

ReadyMag

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

บทสรุป

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

และแก้ไข แก้ไข และแก้ไขอีกครั้ง ไม่มีอะไรสำคัญไปกว่าสำเนาที่ชัดเจนเมื่อองค์ประกอบภาพเพียงอย่างเดียวของคุณคือคำพูด