החלק הראשון שהגולשים יראו באתר האינטרנט שלך זה כותרת הירו. זה החלק העליון שמופיע בדף הבית, וברוב המקרים זה הדבר הראשון שהגולשים רואים. כשהם מוצאים את האתר אינטרנט שלנו.
ולכן החלק הזה חייב לקבל את מירב תשומת הלב כשאנחנו בונים את האתר. במדריך הבא אני יסביר מה חשוב שיהיה בכותרת הירו. ונראה דוגמאות מאתרים מובילים שנוכל להבין מהם את הדגשים החשובים.
כך נראית כותרת הירו מנצחת:
כותרת הירו היא קריטית לאתר אינטרנט. והיא צריכה לכלול את הדגשים הבאים:
- האזור צריך לתפוס את רוב המסך (גם בנייד וגם במסך מחשב).
- כותרת H1 מעולה הכוללת את מילת המפתח.
- תיאור קצר שמסביר על האתר.
- תמונה שמאוד מושכת את העין.
- תמונה של פנים (מתאים לאתרים של נותני שירות כמו עו"ד).
- הכי חשוב! כפתור להנעה לפעולה.
אם תדאגו שכל הדגשים האלו יהיו באתר שלכם. אתם תראו שיפור משמעותי באחוזי ההמרה של האתר.
לתפוס את רוב המסך
הגודל של הכותרת הירו חייבת להיות מאוד דומיננטית כנכנסים לאתר. וצריך שלפחות רוב המסך יכיל את הכותרת. כמובן שלא תמיד חייב שיהיה על רוב המסך, העיקר שזה יהיה בולט וברור. ושיהיה הנעה לפעולה.
כותרת ותיאור שאומרים הכל
כותרת הראשונה של האתר שלכם היא אחד הפרמטרים שיקבעו עם האתר שלכם יצליח. וזה לא הגזמה! צריך לחשוב טוב על הכותרת, וכמובן שחייב שהיא תכלול את מילת המפתח שאתם מקדמים עליה את האתר.</p
התיאור צריך להסביר בכמה מילים בדיוק, על מה האתר שלכם מדבר. כדי שהגולש באמת יבין אם האתר שלכם רלוונטי עבורו. והיום שיש כל כך הרבה אתרים ותחרות בשפע, הגולשים לא מהססים לצאת ולעבור לאתר אחר. אז אם התיאור לא יענה לגולש על השאלה רוב הסיכויים שהוא יצא מהאתר.
תמונה אחת שווה אלף מילים
אם אתם רוצים שהכותרת הירו שלכם תנצח את האתרים המתחרים. תשקיעו בתמונות, אם אתם מצלמים אז תשקיעו בצילום מקצועי. אם אין לכם תמונה מקצועית, תחפשו אחת במאגר תמונות, ויש בשפע תמונות לכל קטגוריה שהיא.
כמה סרטון שווה?
ואם תמונה אחת שווה אלף מילים, אז כמה שווה סרטון? כמובן שאם יש לכם אפשרות להוסיף סרטון לכותרת הירו שלכם. לכו על זה! אני לא אוהב אתרים עם סרטון שמתנגן ברקע, בגלל המהירות של האתר. עד שהסרטון נטען כבר הגולש עבר הלאה. אז עדיף שתעלו את הסרטון בכפתור שילחצו עליו והוא יפתח בלייטבוקס.
אנשים רוצים לראות פנים
אם מדובר באתר של נותני שירות, כגון: אתר של עורך דין, אתר של מקדם אתרים, ואפילו משרד תיווך. הגולשים רוצים לדעת במי מדובר וזה קריטי להצלחה של האתר. אני תמיד מבקש מהלקוחות שלי להביא לי תמונות שלהם מצולמים בסטודיו או עם צלם מקצועי.
הנעה לפעולה
לכל אתר אינטרנט יש מטרה (או צריך שיהיה). המטרה יכולה להיות: להשאיר פרטי ליד, להתקשר לבעל האתר, לרכוש מוצר, לקבוע פגישה וכו'… וכדי שהמטרה הזאת תושג, צריך להניע את הגולש לבצע את הפעולה. זה בעצם הנעה לפעולה.
בכותרת הירו שלנו חייב שיהיה הנעה לפעולה, אחרת אנחנו יכולים להפסיד את הגולש. ההנעה לפעולה לרוב צריכה להיות באמצעות כפתור בולט. בכפתור צריך להופיע הקישור להנעה לפעולה, אם זה עמוד צור קשר, החנות, המוצר שאתם מקדים וכו…
כותרות הירו באתרים מובילים
עכשיו נעבור על אתרים שיש להם המון תנועה והם כמובן יודעים לנצל אותה להמרות. נראה כיצד הם עיצבו את הכותרת הירו שלהם, וניקח מכל אחד את הדגשים שיכולים לעזור לנו.
כותרת הירו באתר אלמנטור
זה הכותרת שרואים בדף הבית של אלמנטור. אפשר לראות שיש כאן מטרה מאוד ברורה. ללחוץ על הכפתור הירוק "התחילו ליצור", ואני מאמין שיש המון מחשבה מאחורי שני המילים האלו. אפשר לראות שהכפתור הוא בצבע אחר משאר האתר. כשיש צבע שונה זה אוטומטי יגרום לעין שלנו לשים לב לכפתור.
יש כותרת גדולה מאוד שאומרת רק אלמנטור, וגם היא באנגלית. זה מראה שמדובר באתר של מותג. שהמילה הזאת אומרת הכל. ויש תיאור כל כך קצר של 7 מילים שאני קורא אותו, ומבין המון על מה האתר מדבר. ומעל הכותרת יש את הכותרת המשנה שנותנת תחושה שמדובר כאן במוצר נחשק מאוד.
כותרת הירו באתר WIX
באתר WIX אפשר לראות את אותם דגשים פחות או יותר, כמו באתר של אלמנטור. כאן הכותרת היא עם מטרה שונה "צור אתר אינטרנט שתהיה גאה בו". במטרה להניעה לפעולה לבנות את האתר אינטרנט בפלטפורמה הזאת. וגם התיאור בעצם משכנע אותנו להתחיל לבנות אתר בוויקס.
ניתן לשים לב שגם הכפתור כאן הוא בצבע שונה והכי בולט באתר. ורואים שכל המטרה בעמוד הזה היא שתלחץ על הכפתור ותתחיל לבנות אתר WIX.
ואם תמשיכו לדפדף בעמוד, אתם תראו המון פעמים את אותו כפתור "Get Started" עם חץ ימינה.
שימו לב לעוד משהו… באתר של וויקס ובאתר של אלמנטור. שבשניהם יש תמונה שמראה את המערכת מיד לאחר החלק העליון. ובגלל שרואים חלק מהתמונה אוטומטית הצד הסקרן שלנו ירצה לדפדף למטה ולראות עוד.
כותרת הירו באתר טסלה
האתר של טסלה בעניי הוא אתר פורץ דרך. זה אתר שאפשר להזמין ממנו את רכב החלומות, וגם לקבל מימון על הרכב. והכל בכמה קליקים באתר. הם בהחלט אומרים משהו לעולם, עם האתר הזה.
אפשר לראות את הדגשים כאן בצורה מאוד ברורה. קודם כל אין שום כותרת שאומרת שזה האתר של טסלה, הם רוצים שנבין לבד לפי התמונה. כמו שאומרים "תמונה אחת שווה אלף מילים". מה שכן כתוב בכותרת זה המודל של הרכב, ומעליו תפריט לעוד סוגים.
אבל מה שמשותף באתר הזה לאתרים הקודמים זה הכפתור הבולט, רק שכאן יש לו עוד חברים. אבל ברור שהכפתור "הזמנה מותאמת אישית" הוא המטרה כאן.
אפשר לראות בעמודים הפנימיים אם נכנס לעמוד של Model 3 נראה את הכפתור "הזמינו כעת".
אז דיי ברור מטרה של הכותרת הירו באתר הזה, וגם בעמודים הפנימיים היא. להתחיל הזמנה של הרכב. אפועצם זה שאין עוד כפתורים אחרים וגם התפריט לא כל כך בולט, אז רוב התנועה מוכוונת לכפתור הזמינו כעת רכב טסלה.
כותרת הירו באתר אפל
מה שאני תמיד לומד מהאתר של אפל, זה לשמור על פשטות. לפעמים יותר מידי פשוט הורס, ובתור אחד שמאוד אוהב לעצב אני מאוד משתדל לשמור על קו נקי באתרים שאני בונה.
בכותרת הירו של אפל אפשר לראות שהיא מאוד דומה לכותרת של טסלה. הכותרת הראשונה כשנכנסים לאתר היא במטרה לקדם את המוצר המוביל והחדש של החברה. גם כאן אין צורך להדגיש שמדובר באתר של חברת אפל, מספיק לראות את התמונה ולהבין.
הכפתור הנעה לפעולה באתר הזה הוא די שונה מהקודמים, וגם המטרה שלו שונה. הכפתור מעוצב מינימלי ביותר. ואפילו הוא לא מגודר, הצבע שלו זה הצבע הכי מפורסם של לינק באתרי אינטרנט (לינק בצבע כחול). והמטרה שלו היא לא שתרכוש את המוצר או להוסיף לסל, אלא לקחת אותך לעמוד שמסביר על המוצר. והם מאמינים שכבר בעמוד הזה אנחנו נרכוש את המוצר.
אם ניכנס לעמוד של המוצר נשים לב שהתפריט העליון (הדר) הוא שונה, ויש עליו כפתור בולט שאומר "Buy" וזהו.
האתרים שראינו עכשיו הם אתרי אינטרנט שמוכרים בכמויות. מאחורי כל עיצוב באתר שלהם יש גאונים שזה העבודה שלהם, למקסם את כמות ההמרה באתרים האלו. אז כמובן ששווה לעשות עליהם קצת שיעורי בית, אבל אל תעתיקו כי האתר שלכם לא מותג כמו האתרים שלהם. קחו רק את מה שנראה לכם יעיל לאתר אינטרנט סטנדרטי.
סרטון הדגמה איך אני משפר כותרת הירו
בסרטון תוכלו לראות איך אני משפר את הכותרת הירו של אתר לקוח. וגם אני מדבר על כותרת הירו אז תעבירו לחלק שאני מדגים איך אני משפר כותרת הירו של אתר לקוח.
מאמרים נוספים שאולי יעניינו אתכם:
