אינטרנט ישראל
  • ראשי
  • אודות רן בר-זיק ואינטרנט ישראל
  • ערוץ טלגרם
  • מסטודון
  • התחברו אלי בטוויטר
  • התחברו אלי בלינקדאין
  • ספר ג'אווהסקריפט
  • ראשי
  • אודות רן בר-זיק ואינטרנט ישראל
  • ערוץ טלגרם
  • מסטודון
  • התחברו אלי בטוויטר
  • התחברו אלי בלינקדאין
  • ספר ג'אווהסקריפט
ראשי » פיתוח אינטרנט » פתרונות ומאמרים על פיתוח אינטרנט » כיצד יוצרים מיילים מעוצבים ללקוחות

כיצד יוצרים מיילים מעוצבים ללקוחות

רן בר-זיק ינואר 25, 2009 10:36 pm אין תגובות

עיצוב מייל לשליחה ללקוחות הוא לא דבר טריוויאלי כמו הכנת דף אינטרנט. ישנם כללים שבונה המייל צריך לעמוד בהם. במאמר זה מובאים הכללים החשובים ביותר.

כדאי תמיד להשאר מעודכנים! אם יש לכם טלגרם, בדקו את ערוץ הטלגרם של האתר שבו אני מעדכן על פוסטים חדשים 🙂 אם אתם רוצים ללמוד תכנות באופן מקיף ומסודר, הצטרפו לאלפי הלומדים בפרויקט "ללמוד ג'אווהסקריפט בעברית" שמלמד לתכנת בג'אווהסקריפט, ב-Node.js ובריאקט וגם מלמד על תרומה לקוד פתוח. גם ספרים דיגיטליים וגם ספרים מודפסים. בשיתוף הקריה האקדמית אונו ובתמיכת חברות מובילות כגון Wix, Outbrain, Elementor, Iron Source, Chegg, Really Good ועוד.

שליחת מיילים ללקוחות (לא כחלק מספאם) היא חלק מבסיס השיווק של כל אתר אינטרנט וחברה הפועלת באינטרנט. באמצעות המייל אפשר להודיע ללקוחות על מבצעים, עדכונים ושינויים שונים ולהציע להם הטבות שונות ומשונות.

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

כאשר אנו מעצבים מייל, אנו יכולים לעצב אותו כתמונה (ואפילו עדיף). אך מה קורה כאשר יש לנו מערכת לשליחת מיילים השולחת מייל בהתאם לסוג הלקוח ועם שמו? בעוד שעבור כמה עשרות או מאות לקוחות לא צריך תוכנה כזו, עסקים גדולים יותר נדרשים למערכת שליחת מיילים שמסוגלת לשלוח מייל נפרד עבור כל קבוצת לקוחות ועם שמו של הלקוח המופיע בגוף המייל. עבור מערכת כזו אנו נדרשים לעצב את המייל באמצעות HTML.

לכאורה עיצוב כזה הוא פשוט ביותר, מה הבעיה ליצור דף HTML פשוט שה-source של התמונות שלו נמצא על שרת חיצוני? מסתבר שזה לא כל כך פשוט. ישנן מערכות מייל רבות – Gmail ו-Outlook הן המרכזיות שבהן, אך מיילים ב-Gmail נראים שונים בדפדפנים שונים וברזולוציות שונות וב-Outlook ישנן כמה גרסאות.

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

  • המייל יעמוד בתקינת HTML 4 Transitional
  • אין להשתמש ב CSS בכל תנאי ועדיף גם להימנע מהשימוש בstyle Inline.
  • אין להשתמש ב Div או ב Span אלא ב tables בלבד.
  • אין להשתמש ב-Float או Position המיקומים ייעשו על ידי הטבלה בלבד.
  • יש להימנע ככל האפשר מ colspan , colrow. וגם ROWSPAN
  • על מנת לוודא שהתמונות נצמדות ואין ביניהן פערים, יש לוודא שאין גם רווחים בין התגיות השונות (רווחים בקוד עצמו).
  • יש להגדיר רוחב וגובה עבור כל תמונה. יש להגדיר רוחב עבור הטבלה בלבד. אין צורך בהגדרת alt עבור תמונות.
  • אין להשתמש ב background Image – בין אם מדובר בstyle ובין אם מדובר בתגית HTML 4. במידה ויש צורך ברקע (כמו במקרה של תוכן דינמי) יש להשתמש בשוליים המשכפלים את עצמם בכל פעם שהתוכן הדינמי נוצר. לדוגמא התוכן בכל טבלה משתכפל וכך נוצר דף באורך לא מוגדר מראש כאשר יש לו שוליים:
  • שול ימני (תמונה) תוכן דינמי שול שמאלי (תמונה)
  • עבור טבלה בתוך טבלה יש להגדיר border=1 בתוך התאים שיש בתת הטבלה. (ה border עצמו לא יראה בשום מצב, אך ימנע מצב של שבירת גבולות ב Outlook 2007). יש להקפיד להגדיר border=0 בכל הטבלאות, גם הפנימיות.
  • הטבלה תהיה מוגדרת מימין לשמאל dir=rtl ו ALIGN=right
  • רוחב המייל יהיה עד 800 פיקסלים.
  • ללא Flash, Animated GIF או AJAX.
  • ללא spacers

הקפדה על כללים אלו תאפשר לכם לשלוח מייל שיראה היטב בכל תיבות הדואר וכן יהיה אפשר לעשות לו forward ללא שבירה של המייל.

כדאי תמיד להשאר מעודכנים! אם יש לכם טלגרם, בדקו את ערוץ הטלגרם של האתר שבו אני מעדכן על פוסטים חדשים 🙂 אם אתם רוצים ללמוד תכנות באופן מקיף ומסודר, הצטרפו לאלפי הלומדים בפרויקט "ללמוד ג'אווהסקריפט בעברית" שמלמד לתכנת בג'אווהסקריפט, ב-Node.js ובריאקט וגם מלמד על תרומה לקוד פתוח. גם ספרים דיגיטליים וגם ספרים מודפסים. בשיתוף הקריה האקדמית אונו ובתמיכת חברות מובילות כגון Wix, Outbrain, Elementor, Iron Source, Chegg, Really Good ועוד.
אינטרנט דואר אלקטרוני מידע למפתחים
ללמוד ג'אווהסקריפט בעברית

ללמוד לתכנת ג'אווהסקריפט בעברית שגייס יותר משלוש מאות אלף שקל ולמעלה מ-2000 תומכים - בואו ללמוד עכשיו איך לתכנת.

רשימת הנושאים
  • מדריכים
    • ריאקט
    • טייפסקריפט
    • ECMAScript 6
    • ES20XX
    • Node.js
    • Express
    • רספברי פיי
    • Babel
    • docker
    • MongoDB
    • Git
    • לימוד MySQL
    • SASS
    • jQuery
    • CSS3
    • HTML 5
    • SVN
    • LESS
  • פיתוח אינטרנט
    • פתרונות ומאמרים על פיתוח אינטרנט
    • jQuery Scripts
    • jQuery למתקדמים
    • יסודות בתכנות
    • נגישות אינטרנט
  • חדשות אינטרנט
  • מידע כללי על אינטרנט
    • רשת האינטרנט
    • בניית אתרי אינטרנט
  • rss logo

    לכל המאמרים

    לכל המאמרים שפורסמו באינטרנט ישראל משנת 2008 ועד עכשיו.
  • rss logo

    RSS Feed

    משתמשים בקורא RSS? אם כן, עקבו אחרי אינטרנט ישראל באמצעות פיד ה-RSS!
    מה זה RSS?
  • Twitter logo

    עקבו אחרי בטוויטר

    בחשבון הטוויטר שלי אני מפרסם עדכונים מהירים על חדשות בתחום התכנות והיזמות, התרעות על מצבי חירום ורכילות בוערת על תחום הווב.
    מה זה טוויטר?
  • facebook like image

    ערוץ הטלגרם של אינטרנט ישראל

    בערוץ הטלגרם של אינטרנט ישראל אני מפרסם את הפוסטים של באתר וכן עדכונים טכנולוגיים נוספים.
    מה זה טלגרם?
  • github logo

    הפרויקטים שלי בגיטהאב

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

כל הזכויות שמורות לרן בר-זיק ולאינטרנט ישראל | מדיניות הפרטיות של אתר אינטרנט ישראל | אתר אינטרנט ישראל נגיש לפי תקן WCAG 2.0 AA | הצהרת הנגישות של האתר | אבטחת מידע ודיווח על בעיית אבטחת מידע

גלילה לראש העמוד