קריאה לפעולה לחצנים הנחיות, שיטות עבודה מומלצות ודוגמאות
לחצני קריאה לפעולה באתרי אינטרנט מוזנחים לעתים קרובות. מעצבים לפעמים לא מבינים בדיוק מה עושה קריאה טובה לפעולה כפתור מעבר להיות אטרקטיבי ומותאם לתוך העיצוב הכולל. אבל קריאה לפעולה לחצנים חשובים מדי כדי להיות מתוכנן ללא איזושהי הבנה של מה עושה אותם יעילים. אחרי הכל, הנקודה העיקרית של לחצן קריאה לפעולה היא להגיע למבקרים לעשות משהו.
חשוב להבין לפחות את ההבנה הבסיסית של האופן שבו צבע, קנה מידה, שפה וגורמים אחרים משפיעים על שיעור ההמרות של לחצן קריאה לפעולה. המושגים כאן אינם מסובכים, אבל הם לוקחים קצת מחשבה ותכנון כדי ליצור את הקריאה היעילה ביותר לחצני פעולה אפשריים בתוך עיצוב נתון. המשך לקרוא לקבלת מידע נוסף על כל אחת מנקודות אלה ועוד.
המטרה של "קריאה לפעולה" לחצנים
לחצני קריאה לפעולה ניתן להשתמש במגוון פונקציות. אחרי הכל, “קריאה לפעולה” הוא קצת מעורפל. כל זה אומר שזה המטרה העיקרית היא להגיע המבקר לאתר שלך עשה משהו. שמשהו יכול להוסיף מוצר לעגלת הקניות שלהם, להוריד משהו, לבקש מידע או כמעט כל דבר אחר.
כי קריאה לחצני פעולה יש מטרות מגוונות כגון, הרבה שיקול יש ללכת לתוך מה הכפתור שואפת להשיג. סוג האתר, שוק היעד והפעולה הרצויה יכולים כולם למלא תפקיד באופן הטוב ביותר בעיצוב לחצן קריאה לפעולה.
סוגים של לחצנים "קריאה לפעולה"
ישנם מספר סוגים שונים של לחצני קריאה לפעולה. בעוד כל סוג שואף להגיע מבקרים לבצע פעולה מסוימת, פעולה זו יכולה להשתנות במידה ניכרת. להלן הסוגים הנפוצים ביותר של לחצני קריאה לפעולה, בהתאם לפעולה שהם רוצים שתבצע.
1. הוסף לסל לחצנים
אתרי מסחר אלקטרוני בדרך כלל משתמשים במספר לחצני קריאה לפעולה, אך הנפוץ ביותר הוא אחד מהם “הוסף לעגלה” כפתור. לחצנים אלה מופיעים בדרך כלל בדפי מוצרים בודדים. מטרתם היא לפתות לקוחות לרכוש פריט. רכיבי עיצוב נפוצים להוסיף לחצנים עגלה כוללים ניסוח פשוט (כגון “הוסף לעגלה” או “להוסיף לתיק” או “קנה עכשיו“) ושימוש בסמלים (בדרך כלל שקית או עגלה).
2. לחצני הורדה
לחצני הורדה דומים להוסיף לחצני עגלה בכך שהם מנסים לפתות את המבקר לתפוס פריט. במקרה של לחצני הורדה, מעצבים רבים בוחרים לכלול מידע נוסף מאשר סוגים אחרים של לחצנים (כגון פרטי גרסה או גודל הורדה).
3. לחצני משפט
אתרים מסוימים מנסים לפתות את המבקרים שלהם לנסות את הצעותיהם, בדרך כלל בצורה של ניסיון ללא תשלום. זה יכול להיות הורדה חינם או חשבון חינם, בהתאם לאתר מסוים. אתרים מסוימים משתמשים “פחות זה יותר” הפילוסופיה ולשמור את השפה על הכפתורים שלהם למינימום, בעוד שאחרים רוצים להציע מידע נוסף על מה המשפט מכיל.
4. למידע נוסף לחצנים
לחצני מידע נוספים משמשים בדרך כלל בסוף גוש של מידע על טיזר (לעתים קרובות בדף הבית). לחצנים אלה הם בדרך כלל פשוטים, אבל לעתים קרובות oversized למשוך תשומת לב המבקר.
5. לחצני הרשמה
לחצני ההרשמה מופיעים לרוב בשתי גרסאות שונות. הסוג הראשון הוא בדרך כלל קשור ישירות עם טופס ההרשמה. הסוג השני משמש בדרך כלל באופן דומה “הוסף לעגלה” , כדרך למשתמשים לרכוש או להירשם לשירות או לחשבון, לפני שהם מגיעים למעשה לטופס הרשמה.
ישנם סוגים אחרים של לחצני קריאה לפעולה, אך אלה הם הנפוצים ביותר. הנחיות החלות על האמור לעיל עשויות לחול גם על כל סוג אחר של לחצן קריאה לפעולה שאתה עשוי לעצב.
שימוש בחלל שלילי ביעילות
אתה רוצה את הקריאה לפעולה לחצנים כדי להתבלט מן התוכן שמסביב באמת תשומת לב הפקודה של המבקרים באתר שלך. לשם כך, אתה צריך לעשות שימוש בחלל שלילי סביב לחצנים אלה. שלב שטח ריק בין התוכן שלך לבין לחצן הקריאה לפעולה. אמנם זה פחות חשוב (ופחות נפוץ) על כמה כפתורים, כגון להוסיף לחצני עגלה, עם אחרים, כמו אלה כדי ללמוד יותר, לעבוד טוב יותר עם יותר מקום.
חשוב לאזן את כמות השטח השלילי שיש לך סביב הכפתורים עם גודל הכפתורים עצמם. זה בערך פרופורציה. אתה רוצה את הכפתור שלך, את השטח סביבו, ואת התוכן שמסביב לכל נראה כאילו הם הולכים יחד, אפילו עם פערים בגודל. ייתכן שיהיה עליך להתעסק עם דברים קצת כדי לגרום להם להיראות בדיוק כמו שצריך.
כמה הנחיות:
- ודא שיש מספיק מקום סביב הכפתור שלך, כך שהוא לא מרגיש עמוס
- שקול עקרונות כמו שלטון שליש או יחס הזהב בעת קביעת כמה מקום לכלול
- מרחב שלילי נותן את הקריאה לפעולה לחצן כפתור להתבלט מן התוכן האחר שלך ומבדיל אותו
גודל וצבע
כמה גדול לחצנים שלך לפעולה הם חשובים מאוד. כפתור גדול מדי יכריע את כל מה שסובב אותו. כפתור קטן מדי ילך לאיבוד בתוך הדשדוש של כל שאר התוכן בדף. אתה רוצה את הכפתור כדי להיות גדול מספיק כדי להתבלט בלי המכריע את העיצוב.
צבע יכול לשמש השפעה רבה כדי לעזור לאזן את גודל הכפתורים שלך. עבור לחצנים גדולים יותר, בחר צבע זה פחות בולט בתוך העיצוב שלך (אבל עדיין בולט שוב את הרקע). עבור לחצן קטן יותר, ייתכן שתרצה לבחור צבע בהיר יותר, מנוגד כדי להפוך את הלחצן פופ. בכל מקרה, ודא שהצבע שבו אתה משתמש קובע את הכפתור בנפרד מבלי להתנגש עם העיצוב הכולל של האתר.
כמה הנחיות:
- לחצני הקריאה לפעולה צריכים להיות באופן אידיאלי את הלחצנים הגדולים ביותר בדף נתון
- השתמש בצבעים מנוגדים כדי ליצור לחצנים קטנים יותר
- השתמש בצבעים שונים פחות כדי להפוך את הכפתורים גדולים להתאים טוב יותר
- אתה קורא לחצני פעולה צריך לפקוד תשומת לב ללא המכריע את העיצוב שלך
שפה
הניסוח המדויק שבו תבחר להשתמש בלחצני הקריאה לפעולה עשוי להיות בעל השפעה עצומה על ההמרה. השווה “קנה עכשיו” עם “הוסף לעגלה“. אחד דחוף הרבה יותר מן השני. או על מה “נסה את זה בחינם” עם “משפט חינם“? האחד הוא הרבה יותר מחריד מהאחר, והוא בולט יותר.
השפה שבה אתה משתמש בלחצני 'קריאה לפעולה' צריכה להיות פשוטה וישרה ככל האפשר. אתה רוצה המבקרים לדעת רק עם מבט בדיוק מה הם יקבלו כאשר לחץ על כפתור. אם הם מטילים ספק בכך, פירוש הדבר שהם עצרו, דבר שעלול להוביל לשיעורי המרות נמוכים יותר.
אל תשכח גם את גודל הגופנים שלך. הטקסט בלחצן 'קריאה לפעולה' צריך להיות גדול ומודגש, מתאים בדיוק לגודל ולצבע של הלחצן עצמו. ודא שיש ניגוד מספיק וכי הטקסט קל לקריאה.
כמה הנחיות:
- השתמש בשפה פשוטה וישירה
- השתמש בגופן גדול, מודגש על הלחצן של הטקסט הראשי
- ודא שהשפה קוראת בבירור לפעולה ספציפית
צור דחיפות
אתה רוצה המבקרים באתר שלך לבצע את הפעולות הרצויות עם מחשבה קטנה ככל האפשר. אמנם אתה לא רוצה לרמות את המבקרים שלך, את ההזדמנויות יותר אתה נותן להם להפסיק ולשקול את מה שהם עושים, את ההזדמנויות יותר שאתה נותן להם לומר “לא”.
אתה רוצה את הכפתורים לתת להם את הרושם כי הם צריכים לפעול מיד. אתה רוצה לעודד אותם לקבל את ההחלטה מיד, על הרגע של רגע. אמנם זה לא יעבוד עבור כל קריאה לפעולה כפתור (במיוחד אלה כדי לרכוש פריטים כרטיס גבוהה), עבור עלות נמוכה או פעולות חינם, שיש מבקרים לחץ עם מעט מחשבה תחילה הוא רצוי.
כמה הנחיות:
- עודד את המבקרים לפעול באופן מיידי
- אל תיתן למבקרים שלך סיבה להפסיק
- למרות דחיפות חשוב, לא להטעות את המבקרים בכל דרך שהיא
לספק מידע נוסף
במידת הצורך, השתמש בלחצני הקריאה לפעולה כדי לספק למבקרים מידע נוסף על מה שהם הולכים לקבל אם הם לוחצים על הלחצן. זה נראה בדרך כלל עם לחצני ניסיון או לחצני הורדה. דוגמאות נפוצות של מידע נוסף כוללות את משך הזמן ניסיון חינם תימשך או את גודל הקובץ להורדה. מידע גרסה הוא גם לראות בדרך כלל.
כאשר כולל מידע נוסף, זכור כי אתה צריך לשמור את המיקוד על הקריאה לפעולה בפועל. ודא שהטקסט עבור המבקרים המפתחים את השפה הוא הבולט ביותר, כאשר מידע אחר נראה פחות גלוי.
כמה הנחיות:
- כלול רק מידע נוסף כאשר הוא מוסיף לחוויית המשתמש
- מידע נוסף מתאים רק לסוגים מסוימים של לחצני קריאה לפעולה, ובראשם הורדת לחצנים או ניסיונות
- ודא שהשיחה העיקרית לפעולה היא עדיין הטקסט הבולט ביותר על הכפתור שלך
סדר עדיפויות
חשוב לתעדף את לחצני הקריאה לפעולה בדף שלך, אם יש יותר מאחד. זה יכול להיעשות במספר דרכים, אך הנפוצים ביותר הם באמצעות שימוש בצבע ובגודל.
השתמש בצבע כדי להדגיש את הכפתור החשוב ביותר בדף, או כדי להפוך את אלה פחות חשובים נראים פחות בולט. או להשתמש בגודל כדי להפוך את הכפתור החשוב ביותר להתבלט (על ידי מה שהופך אותו גדול יותר) ו de- הדגשת פחות חשובים אלה.
אייקונים ותמונות
הוספת רמזים חזותיים ללחצני הקריאה לפעולה יכולה גם היא לעזור להגדיל את שיעורי ההמרות. סמל של עגלת קניות על “הוסף לעגלה” כפתור, למשל, או חץ על כפתור ההורדה הן דוגמאות טובות. חשוב גם על שימוש בסמלים ייחודיים, אך ודא שהסמל מוסיף לחוויית המשתמש על ידי הבהרת הכפתור, ואינו מוסיף בלבול.
כמה הנחיות:
- ודא שהסמלים שבהם אתה משתמש עוזרים להבהיר את משמעות הכפתור שלך, במקום לבלבל אותו
- סמלים מוכרים בקלות יכולים להצביע מיד על משמעות המבקרים שלך
- אל תפחדו להשתמש בסמלים פחות נפוצים, כל עוד משמעותם ברורה
דוגמאות
הנה כמה דוגמאות של לחצני קריאה מצוינת לפעולה. אמנם הם לא לגמרי תואם את ההנחיות לעיל, הם נפגשים מספיק הקריטריונים כדי להיחשב נהדר.
שידור חי - הבדל את "קנה עכשיו" (עבור אופציות בתשלום) ו "הירשם" (לחופשי אפשרויות) לחצנים היא אסטרטגיה טובה.
ווינדוס 7 - גדול, ירוק "Get Windows7" כפתור קל למבקרים במקום.
- - הכפתור הירוק הבהיר כאן באמת בולט על רקע לבן.
יומן - שימוש בצבעים שונים עבור לחצני "הורדה" ו "קנה" קובע אותם בנפרד ונותן עדיפות ללחצן "קנה".
TasteBook - כפתור זה עושה שימוש רב בסמל ומשתמש בטקסט גדול ומודגש לבלוט.
גודברי - עוד ירוק בהיר קריאה לפעולה כפתור.
יצירתיות Lifetree - המשך אותו גופן מעותק הגוף ללחצן קריאה לפעולה יוצר תחושה של לכידות.
המשורר - כפתור אדום קריאה לפעולה עם סוג מודגש בולט על רקע כחול.
פנקס - דוגמה טובה לכלול מידע נוסף בלחצן קריאה לפעולה.
Inkd - דוגמה מצוינת של סדר עדיפויות לחצנים עם גודל.
ערכות נושא אלגנטיות - דוגמה מצוינת נוספת לשימוש בצבע כדי לבלוט מבלי להתנגש עם אלמנטים עיצוביים שמסביב.
ZenDesk - דוגמה מצוינת נוספת של ביצוע כפתור להתבלט באמצעות צבע.
סטורנווי - כפתור עגול הוא בלתי צפוי בולט, במיוחד כאשר מוקף בגבול לבן.
בארמאיל - לפעמים כפתור זה משתלב עובד טוב יותר בעיצוב האתר הכולל שלך, במיוחד כאשר הפעולה היא פחות דחוף.
משאבים נוספים
- קריאה לפעולה לחצנים: דוגמאות ושיטות עבודה מומלצות - מתוך מגזין מתרסק
- טוב קריאה לפעולה לחצנים - מ UX בות '
- קריאה לפעולה לחצנים: האם גודל החומר? - מ קבל אלסטי
- 10 טכניקות יעילות “קריאה לפעולה” - מבוגוורלד
- 5 עצות ליצירת שיחה יעילה לפעולה כפתור - מ