איך מעצבים אימייל מנצח? מנהל תחום העיצוב באקטיב טרייל חושף את כל הסודות (פוסט ראשון בסדרה)

אם הייתי שואל אתכם – “מתי הומצא הדואר האלקטרוני”, אני די בטוח שרובכם הייתם מפספסים בכמה עשורים כלפי מעלה. אחרי הכל, לנו, כמשתמשים טכנולוגיים של המאה ה-21, יש נטייה לחשוב שהאימיילים והניוזלטרים נמצאים בסביבה קצת פחות זמן ממה שהם מלווים אותנו בפועל. 

אבל האמת היא שהטכנולוגיה פותחה כבר בשנות ה-60, בהתחלה בצורה מאוד מסורבלת ומאוחר יותר – בצורה שדי דומה למה שאנחנו מכירים היום, למעט הבדל עיקרי אחד: האימיילים התחילו כצורת תקשורת שהיתה נגישה בעיקר למשתמשים ברשתות אוניברסיטאיות. בהמשך, הטכנולוגיה הורחבה לשימושם של ארגונים שונים ולבסוף, אי שם בשנות ה-90 המאוחרות בואכה שנות ה-2000, הונגשה גם למשתמשים פרטיים.

How to design the perfect email?


היום, כולנו תופשים את תיבות המייל שלנו ככלי עבודה ותקשורת בסיסי. עם המעבר לסמארטפונים השתנו חוקי המשחק והמייל הפך לנגיש כל כך שרובנו בודקים אותו כל יום, מספר פעמים ביום. אבל נגישות היא לא הדבר היחיד שהשתנה והתעדכן: המעבר לגלילת המסך באמצעות האצבעות – טכנולוגיה שנחשפה לראשונה בידי סטיב ג’ובס, כשהציג את האייפון ה-1 – שינה מקצה לקצה גם את הדרך שבה נהוג לבנות ולעצב אימיילים וניוזלטרים. 

אם פעם עיצוב מייל שיווקי היה הכרחי כדי שהנמענים לא יצטרכו לגלול יותר מדי והותאמו לתצוגת דסקטופ באמצעות אלמנטים רוחביים, היום כל מי שניגש לעצב ולבנות ניוזלטר חייב להסתגל למחשבה בסיסית אחת: Mobile First. 

אז אחרי שהבנו באיזו סביבה אנחנו ממוקמים, הגיע הזמן לדבר תכלס: מה צריך לדעת כדי לעצב ניוזלטר שיהיה לא רק יפה, אלא גם נוח לקריאה והכי חשוב: ממיר? אני מזמין אתכם להכין כוס קפה, להתרווח ולצלול יחד איתי לא’-ב’ של עולמות עיצוב הניוזלטרים, כדי שתוכלו להשיג את התוצאות הכי טובות שאפשר. 

לפני הכל: על מה צריך לחשוב כשניגשים לעצב ניוזלטר או אימייל? 

כמו כל אלמנט עיצובי אחר, כשאתם ניגשים לעצב את הניוזלטר או האימייל שלכם יש כמה נקודות שצריך לחשוב עליהן ולקחת בחשבון: 

  • יחסים בין המסרים

היחסים בין המסרים שלכם קשורים גם לטקסטים עצמם וגם לעיצוב הכללי. מומלץ לא לעבור 3 גדלי פונטים ולעבוד כך שכל תיבת טקסט תכיל כותרת גדולה, כותרת משנה וטקסט רץ. כל אחד מהאלמנטים האלה, כאמור, יקבל גודל פונט משל עצמו. אם תוסיפו גדלים אחרים לטקסטים במייל שלכם, הוא כנראה ייראה מבולגן ויבלבל את הקוראים. 

Proper email relations

גם מבחינה וויזואלית, חשוב לייצר הפרדות והיררכיה בין המסרים. מה זה אומר בפועל? קודם כל, שכל מסר מקבל משבצת משלו. כלומר: אם המייל שאתם מוציאים הוא פרסומת אחת, אין בעיה לשלוח עיצוב כולל אחד. אבל אם אתם שולחים ניוזלטר מלא בעדכונים, מומלץ להקדיש תיבת טקסט נפרדת לכל אחד מהנושאים שעליהם אתם כותבים. 

בחרתם לעבוד עם תבנית מעוצבת מראש? מדהים! רק קחו בחשבון שכדאי לבחור בתבנית שיש בה היררכיות ברורות בין המסרים השונים ולא פחות חשוב – תבנית ורסטילית מבחינה וויזואלית. 

  • הקפידו לייצר אחידות

עיצוב שמזוהה עם המותג שלכם, הוא ה-א’-ב’ בעבודת המיתוג של כל עסק – קטן כגדול. מטרת העל שלכם היא לדאוג שכל מסר שיוצא תחת המותג שלכם יזוהה מיידית עם המותג עצמו. יצירת זהות מותגית היא תורה שלמה ונפרדת, אבל לעניינינו מה שחשוב לקחת בחשבון, הוא שהמטרה שלכם צריכה להיות שגם האימיילים והניוזלטרים שאתם שולחים יזוהו אוטומטית עם המותג שלכם. 

דרך ראשונה וקלה לעשות את זה היא באמצעות בחירה בפלטת צבעים מותגית אחידה הכוללת כ-3 או 4 צבעים: צבע ראשי, צבע משני וצבע לכפתורים שמשולבים באימייל. בנוסף, בחרו פונט מוביל שישמש אתכם בכל דיוור וגדלי פונטים אחידים לכל רכיב טקסטואלי בדיוורים שלכם. 

  • אל תשכחו: מיילים הם מדיה אכזרית

ממש כמו שלטי חוצות, או כמו הפיד של פייסבוק, אינסטגרם, טיקטוק וכו’ – כדי לעצור את הנמענים שלכם בעת גלילה מהירה, אתם חייבים להשיג את תשומת הלב שלהם. משהו חייב לגרום להם להסתקרן מספיק כדי לעצור. אם האימייל שלכם ייראה מבולגן, מבולבל או פשוט לא מזמין, אל תבנו על כך שהוא לא יינחת בתיבת הזבל. 

  • הקדישו מחשבה לקונטרסטיות (ניגודיות) 

ניגודיות היא כלי בסיסי בעיצוב הרמוני שעובד ותופס את העין. אם, למשל, אתם מניחים תמונה ליד תמונה, וודאו שאחת בהירה ואחת כהה; ככה, למרות שהן מוצבות אחת לצד השנייה, כל אחת מהן תקבל מקום של כבוד. דוגמה נוספת: אם בחרתם ברקע בצבע מסוים, נסו לשלב אלמנטים וויזואליים בצבע המנוגד. המטרה היא שכל אלמנט יקפוץ החוצה מתוך המכלול ויעמוד בפני עצמו.   

  • רספונסיביות

קודם כל מובייל, זוכרים? בסביבה הדיגיטלית היום, רספונסיביות היא א’-ב’ בעיצוב מיילים והחשיבה צריכה להיות כזו, שלפיה כל אלמנט אמור להתאים גם לדסקטופ וגם למובייל. 

  • קחו בחשבון את ההבדל בין מייל שכולו תמונה, למייל חי

מייל חי הוא כזה שמורכב מאלמנטים עיצוביים שקיימים בתוך המערכת, בכלי העריכה שלנו. מצד אחד, העֲבִירוּת והרספונסיביות של מיילים חיים גבוהה יותר. מצד שני, בגלל שכל נמען ונמענת רואים את המייל ממכשיר שונה – שבו ההגדרות שונות, השליטה על העיצוב הסופי מעט מוגבלת. לכן אני ממליץ ללכת על בחירות נייטרליות יחסית, שיעבדו בכל מצב ומקרה. אגב, זו אחת הסיבות העיקריות שבגללן מיילים רבים מגיעים אליכם כשהם כתובים בפונט אריאל. 

לעומת המייל החי, יש לנו מייל שכולו תמונה – והוא מאפשר שליטה גבוהה יותר על הפן העיצובי. מול היתרון הגדול הזה, מתקיימים מספר חסרונות: קודם כל, המייל שלכם יהיה כבד יותר. שנית, לפעמים הטקסטים לא יוצאים מספיק חדים וחסרון גדול נוסף הוא שלעתים מותקנים חוסמי תמונות מובנים בתוכנות המיילים של הנמענים. אגב, תמונות חייבות לכלול Alt-Tags, תיאורים טקסטואליים שמתווספים לתמונות באתרים ומסייעים לקידום בגוגל, לנגישות וחוויית משתמש גבוהה יותר. 

עכשיו תכלס: מה צריך לקחת בחשבון כשיושבים לעצב אימייל? 

דבר ראשון נחשוב על סוג האימייל. יש לנו שני סוגים עיקריים (שלכל אחד מהם תתי סוגות משלו):

א. אימייל מסוג בלאסט: מייל שמכיל מסר קצר וקולע כמו למשל הודעה על מבצע, הודעה תפעולית חשובה או ברכה לרגל חג או מועד. 

ב. אימייל מסוג ניוזלטר: מתחלק לאימייל שמכיל עדכונים ומטרתו לגרום לנמענים להמשיך לקרוא (לרוב יכיל הסבר קצר על כל עדכון + כפתורים שמטרתם להוביל להמשך הקריאה), או כזה שהוא עולם תוכן בפני עצמו (כמו מעין בלוג שכולל פוסטים ארוכים). הסוג השני הופך יותר ויותר נפוץ, אבל הבעיה איתו היא האורך. 

Different kinds of emails

עכשיו, כשאתם יודעים לסווג את האימייל שעליו אתם עובדים, קבלו את הטיפים הכי חשובים לגבי העיצוב של כל סוג:

בלאסטים: טיפים חשובים

אם הבלאסט שלכם הוא מסוג הודעות תפעוליות, חשוב להבין שההודעה לא צריכה להיות מעוצבת מדי מ-2 סיבות עיקריות: המסר צריך לעבור בפשטות ובהירות, וההודעה צריכה להיות קלה לשליחה (אתם לא רוצים להשתמש במעצב או בתמונה בכל פעם מחדש, נכון?). 

אם מטרתה של ההודעה התפעולית שלכם היא ליידע, חשוב שהמסר המרכזי יהיה בכותרת גדולה. בנוסף, אל תשכחו לשלב לוגו של החברה כדי שהלקוחות שלכם יבינו ממי מגיעה ההודעה. אם ההודעה כוללת הנעה לפעולה – גם היא צריכה לבלוט. מעבר לכל אלה – בהודעה מהסוג הספציפי הזה, אין יותר מדי מקום למשחקי עיצוב. 

לעומת זאת, אם הבלאסט שלכם מדבר דווקא על משהו משמח כמו מבצע, איחולי יום הולדת/יום נישואין שמח וכו’, החוקים משתנים והמלצתי החד-משמעית היא לבחור במסר אחד פשוט שילווה באימג’ רלוונטי. אל תנסו להפעיל את הלקוח מעבר לכפתור הנעה-לפעולה אחד ובקיצור: שמרו על זה קצר ונוח לקריאה.

כמו כן, חשוב מאוד לבחור עיצוב Html תקני לאימייל שיאפשר לכל ספקי המייל לקבל את הניוזלטר שלכם ולהציגו בנראות ובמבניות המקוריות. ומה עם שימוש ב- shorteners URL, כדי לקצר כתובות האתרים בצורה שתהיה נוחה יותר לשיתוף ולשימוש? במקום לשלוח או לפרסם כתובת URL ארוכה ומסורבלת, ניתן להשתמש בשירותי מקצרי כתובות כדי ליצור כתובת קצרה יותר שמפנה לאותו האתר.

ניוזלטרים: טיפים חשובים 

אם החלטתם לשלוח ניוזלטר על טהרת התוכן, יש כמה דברים מאוד חשובים מבחינה עיצובית, שצריך לשים אליהם לב: קודם כל, אני מאוד ממליץ להקפיד שההפרדה בין תוכן לתוכן תהיה קבועה – אפשר לעשות זאת באמצעות כותרות רלוונטיות, תמונות או אלמנטים גרפיים. אפרופו תמונות: דווקא בניוזלטר מסוג זה, מאוד מומלץ לשלב תמונות רלוונטיות בין נושא לנושא. בנוסף, חשוב להקפיד שהכותרות תהיינה אחידות וכמובן – לא לשכוח לבדוק את הנראות של הניוזלטר במובייל ולקחת גם אותה בחשבון (מאחר והאלמנטים מתאימים את עצמם בצורה וויזואלית שונה בפריסת מובייל). כמו כן, התאמה למובייל. 90% מהגולשים פותחים את הניוזלטר מהסמארטפון וכדאי שהעיצוב יהיה רספונסיבי ומותאם בדיוק. 

לעומת זאת, אם בחרתם לשגר ניוזלטר שמכיל הרבה עדכונים והפניות, אני ממליץ לשים לב לאחידות בהפרדה בין הפניה אחת לשנייה, בחירה של גריד (גריד הוא המבנה העיצובי הכללי של הניוזלטר) מעניין וויזואלית ולא פחות חשוב – ברור, שימוש בטקסטים קצרים ואחידים מבחינת אורכם (כלומר, נסו לדאוג שכל הפניה תהיה זהה באורך לקודמתה) וכמובן – אל תשכחו לשלב הנעות ברורות ואחידות לפעולה. בדרך כלל אלו יופיעו בצורת כפתורים שכתוב עליהם “להמשך קריאה”, “לצפייה בסרטון”, “לפרטים נוספים” וכו’. 


זהו, אז עכשיו גם אתם יודעים איך לבנות נכון את האימייל שאתם עומדים לשגר לנמענים. בפעם הבאה נרד לרזולוציות עמוקות יותר ואלמד אתכם טיפים וטריקים עיצוביים שקשורים ישירות לכלים שעומדים לרשותכם בתוך המערכת שלנו פה באקטיב טרייל. 

בינתיים, אם יש לכם שאלות נוספות אליי, אתם מוזמנים לכתוב לי ב: content@activetrail.net או לשלוח הודעה לעמוד הפייסבוק שלנו ואני מבטיח לעזור כמיטב יכולתי. 

נתראה בקרוב, 

גיל אוסר, מנהל תחום העיצוב באקטיב טרייל