የኢሜል ግብይት እና አውቶሜሽንየሞባይል እና የጡባዊ ግብይት

16 የሞባይል ተስማሚ HTML ኢሜይል የገቢ መልእክት ሳጥን አቀማመጥ እና ተሳትፎን ከፍ የሚያደርጉ ምርጥ ልምዶች

እ.ኤ.አ. በ2023 ሞባይል ኢሜል ለመክፈት እንደ ዋናው መሳሪያ ዴስክቶፕን ሊያልፍ ይችላል። በእርግጥ HubSpot ያንን አገኘ 46 በመቶ ሁሉም ኢሜይሎች የሚከፈቱት አሁን በሞባይል ላይ ነው። ለሞባይል ኢሜይሎችን እየነደፉ ካልሆኑ፣ ብዙ ተሳትፎ እና ገንዘብ በጠረጴዛው ላይ ትተዋል።

  1. የኢሜል ማረጋገጫ፡- የእርስዎን ማረጋገጥ ኢሜይሎች የተረጋገጡ ናቸው። ወደ ላኪው ጎራ እና IP አድራሻ ወደ የገቢ መልእክት ሳጥን ለመድረስ ወሳኝ ነው እና ወደ ቆሻሻ ወይም አይፈለጌ መልእክት አቃፊ አይመራም። እንዲሁም ከደንበኝነት ምዝገባ የመውጣት አገናኝን የሚያካትተውን መድረክ በመጠቀም ከኢሜይሉ የመውጣት መንገድ ማቅረብዎ በጣም አስፈላጊ ነው።
  2. ምላሽ ሰጪ ዲዛይን ኤችቲኤምኤል ኢሜል መሆን አለበት ምላሽ ለመስጠት የተነደፈ, ይህም ማለት እየታየበት ባለው መሳሪያ ላይ ካለው የስክሪን መጠን ጋር ማስተካከል ይችላል. ይህ ኢሜይሉ በሁለቱም ዴስክቶፕ እና ተንቀሳቃሽ መሳሪያዎች ላይ ጥሩ ሆኖ እንዲታይ ያረጋግጣል።
  3. ግልጽ እና አጭር የርእሰ ጉዳይ መስመር፡- ግልጽ እና አጭር የርእሰ ጉዳይ መስመር ለሞባይል ተጠቃሚዎች አስፈላጊ ነው ምክንያቱም የርዕሰ ጉዳዩን የመጀመሪያዎቹን ጥቂት ቃላቶች በኢሜል ቅድመ እይታ መስኮቱ ውስጥ ማየት ስለሚችሉ ነው። እሱ አጭር እና የኢሜይሉን ይዘት በትክክል የሚያንፀባርቅ መሆን አለበት። የኢሜይል ርእሰ ጉዳይ መስመር ጥሩው የቁምፊ ርዝመት እንደ የኢሜይል ይዘት፣ ተመልካቾች እና የኢሜል ደንበኛ ጥቅም ላይ እየዋለ ባለው የኢሜይል ይዘት ላይ በመመስረት ሊለያይ ይችላል። ነገር ግን፣ አብዛኞቹ ባለሙያዎች የኢሜል ርእሰ ጉዳይ መስመሮችን አጭር እና እስከ ነጥቡ፣ በተለይም ከ41-50 ቁምፊዎች ወይም ከ6-8 ቃላት መካከል እንዲቆዩ ይመክራሉ። በሞባይል መሳሪያዎች ላይ ከ50 ቁምፊዎች በላይ የሚረዝሙ የርእሰ ጉዳይ መስመሮች ሊቆራረጡ ይችላሉ፣ እና በአንዳንድ አጋጣሚዎች የርዕሰ-ጉዳዩን የመጀመሪያዎቹን ጥቂት ቃላት ብቻ ያሳያሉ። ይህ ተቀባዩ የኢሜይሉን ዋና መልእክት ለመረዳት አስቸጋሪ ያደርገዋል እና ኢሜይሉ የመከፈት እድሉን ሊቀንስ ይችላል።
  4. ቅድመ ርዕስ፡ የኢሜል ቅድመ ራስጌ በኢሜል ደንበኛ የገቢ መልእክት ሳጥን ውስጥ ከርዕሰ-ጉዳዩ መስመር ቀጥሎ ወይም በታች የሚታየው የኢሜል ይዘት አጭር ማጠቃለያ ነው። ሲመቻቹ የኢሜይሎችዎ ክፍት ፍጥነት ላይ ተጽዕኖ ሊያሳድር የሚችል አስፈላጊ አካል ነው። የቅድመ ራስጌ ጽሑፍ በትክክል መዘጋጀቱን ለማረጋገጥ አብዛኛዎቹ ደንበኞች HTML እና CSS ያካትታሉ።
<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <style>
      /* CSS for desktop styles */
      @media only screen and (min-width: 600px) {
        /* desktop styles here */
      }
      /* CSS for mobile styles */
      @media only screen and (max-width: 599px) {
        /* mobile styles here */
      }
    </style>
  </head>
  <body>
    <!-- Intro text for preview -->
    <div style="display:none; max-height:0px; overflow:hidden;">
      This is the intro text that will appear in the email preview, but won't be visible in the email itself.
    </div>
    
    <!-- Main email content -->
    <div style="max-width:600px; margin:0 auto;">
      <!-- Content goes here -->
    </div>
  </body>
</html>
  1. ነጠላ-አምድ አቀማመጥ; በነጠላ-አምድ አቀማመጥ የተነደፉ ኢሜይሎች በሞባይል መሳሪያዎች ላይ ለማንበብ ቀላል ናቸው። ይዘቱ በሎጂክ ቅደም ተከተል መደራጀት እና በቀላል እና ለማንበብ ቀላል ቅርጸት መቅረብ አለበት። ብዙ ዓምዶች ካሉህ፣ CSS ን በመጠቀም ዓምዶቹን በነጠላ አምድ አቀማመጥ በጸጋ ማደራጀት ይችላል።

እዚህ አንድ የኤችቲኤምኤል ኢሜል አቀማመጥ ይህ በዴስክቶፕ ላይ 2 አምዶች ነው እና በሞባይል ስክሪኖች ላይ ወደ አንድ አምድ ይወድቃል።

<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <style>
      /* CSS for desktop styles */
      @media only screen and (min-width: 600px) {
        .container {
          display: flex;
          flex-wrap: wrap;
        }
        .col {
          flex: 1;
          padding: 10px;
        }
        .col.left {
          order: 1;
        }
        .col.right {
          order: 2;
        }
      }
      /* CSS for mobile styles */
      @media only screen and (max-width: 599px) {
        .container {
          display: block;
        }
        .col {
          width: 100%;
          padding: 10px;
        }
      }
    </style>
  </head>
  <body>
    <div class="container">
      <div class="col left">
        <!-- Content for left column -->
      </div>
      <div class="col right">
        <!-- Content for right column -->
      </div>
    </div>
  </body>
</html>

እዚህ አንድ የኤችቲኤምኤል ኢሜል አቀማመጥ ይህ በዴስክቶፕ ላይ 3 አምዶች ነው እና በሞባይል ስክሪኖች ላይ ወደ አንድ አምድ ይወድቃል።

<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <style>
      /* CSS for desktop styles */
      @media only screen and (min-width: 600px) {
        .container {
          display: flex;
          flex-wrap: wrap;
        }
        .col {
          flex: 1;
          padding: 10px;
        }
        .col.left {
          order: 1;
        }
        .col.middle {
          order: 2;
        }
        .col.right {
          order: 3;
        }
      }
      /* CSS for mobile styles */
      @media only screen and (max-width: 599px) {
        .container {
          display: block;
        }
        .col {
          width: 100%;
          padding: 10px;
        }
      }
    </style>
  </head>
  <body>
    <div class="container">
      <div class="col left">
        <!-- Content for left column -->
      </div>
      <div class="col middle">
        <!-- Content for middle column -->
      </div>
      <div class="col right">
        <!-- Content for right column -->
      </div>
    </div>
  </body>
</html>
  1. ቀላል እና ጨለማ ሁነታ; አብዛኞቹ የኢሜል ደንበኞች የብርሃን እና የጨለማ ሁነታን ይደግፋሉ የሲ ኤስ ኤስ prefers-color-scheme የተጠቃሚውን ምርጫ ለማስተናገድ። ግልጽ ዳራ ባለዎት የምስል አይነቶችን መጠቀምዎን ያረጋግጡ። የኮድ ምሳሌ ይኸውና።
<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <style>
      /* Light mode styles */
      body {
        background-color: #ffffff;
        color: #333333;
      }
      .container {
        background-color: #f9f9f9;
      }
      .text {
        border: 1px solid #cccccc;
      }
      /* Dark mode styles */
      @media (prefers-color-scheme: dark) {
        body {
          background-color: #333333;
          color: #f9f9f9;
        }
        .container {
          background-color: #333333;
        }
        .text {
          border: 1px solid #f9f9f9;
        }
      }
      /* Common styles for both modes */
      .container {
        display: flex;
        flex-wrap: wrap;
        padding: 10px;
      }
      .col {
        flex: 1;
        margin: 10px;
      }
      img {
        max-width: 100%;
        height: auto;
      }
      h2 {
        font-size: 24px;
        margin-bottom: 10px;
      }
      p {
        font-size: 16px;
        line-height: 1.5;
        margin: 0;
      }
    </style>
  </head>
  <body>
    <div class="container">
      <div class="col">
        <img src="image1.jpg" alt="Image 1">
        <div class="text">
          <h2>Heading 1</h2>
          <p>Text for column 1 goes here.</p>
        </div>
      </div>
      <div class="col">
        <img src="image2.jpg" alt="Image 2">
        <div class="text">
          <h2>Heading 2</h2>
          <p>Text for column 2 goes here.</p>
        </div>
      </div>
      <div class="col">
        <img src="image3.jpg" alt="Image 3">
        <div class="text">
          <h2>Heading 3</h2>
          <p>Text for column 3 goes here.</p>
        </div>
      </div>
    </div>
  </body>
</html>
  1. ትልልቅ፣ የሚነበቡ ቅርጸ-ቁምፊዎች፡- ጽሑፉን በትንሽ ስክሪን ላይ ለማንበብ ቀላል ለማድረግ የቅርጸ ቁምፊው መጠን እና ዘይቤ መመረጥ አለበት. ቢያንስ 14pt ቅርጸ-ቁምፊ መጠን ይጠቀሙ እና በትንሽ ስክሪኖች ላይ ለማንበብ አስቸጋሪ የሆኑትን ቅርጸ ቁምፊዎችን ከመጠቀም ይቆጠቡ። በብዛት ጥቅም ላይ የዋሉ ቅርጸ-ቁምፊዎች በተለያዩ የኢሜል ደንበኞች ላይ በቋሚነት የመስራት እድላቸው ከፍተኛ ነው፣ ስለዚህ አሪያል፣ ሄልቬቲካ፣ ታይምስ ኒው ሮማን፣ ጆርጂያ፣ ቨርዳና፣ ታሆማ እና ትሬቡሼት ኤምኤስን በመጠቀም ደህንነቱ የተጠበቀ ቅርጸ-ቁምፊዎች ናቸው። ብጁ ቅርጸ-ቁምፊን የምትጠቀም ከሆነ በCSSህ ውስጥ የመመለሻ ቅርጸ-ቁምፊ እንዳለህ እርግጠኛ ሁን።
<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <style>
      /* Custom font */
      @font-face {
        font-family: 'My Custom Font';
        src: url('my-custom-font.woff2') format('woff2'),
             url('my-custom-font.woff') format('woff');
        font-weight: normal;
        font-style: normal;
      }
      /* Fallback font */
      body {
        font-family: 'My Custom Font', Arial, sans-serif;
      }
      /* Other styles */
      h1 {
        font-size: 24px;
        font-weight: bold;
        margin-bottom: 10px;
      }
      p {
        font-size: 16px;
        line-height: 1.5;
        margin: 0;
      }
    </style>
  </head>
  <body>
    <h1>My Custom Font Example</h1>
    <p>This text uses the custom font 'My Custom Font'. If the font is not supported, the fallback font 'Arial' will be used instead.</p>
  </body>
</html>
  1. ምርጥ ምስሎችን መጠቀም; ምስሎች የመጫን ጊዜን ሊቀንሱ ይችላሉ እና በሁሉም ተንቀሳቃሽ መሳሪያዎች ላይ በትክክል ላይታዩ ይችላሉ። ምስሎችን በጥንቃቄ ይጠቀሙ፣ እና መጠናቸው እና መጠናቸው ያረጋግጡ የተጫነ ለሞባይል እይታ. የኢሜል ደንበኛው የሚያግድ ከሆነ ለምስሎችዎ alt ጽሑፍ መሙላትዎን ያረጋግጡ። ሁሉም ምስሎች ከአስተማማኝ ድር ጣቢያ ተከማችተው መጠቆም አለባቸው (SSL). በኤችቲኤምኤል ኢሜል ውስጥ ምላሽ ሰጪ ምስሎች ምሳሌ ምሳሌ ይኸውልዎ።
<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <style>
      /* CSS for desktop styles */
      @media only screen and (min-width: 600px) {
        .container {
          display: flex;
          flex-wrap: wrap;
        }
        .col {
          flex: 1;
          padding: 10px;
        }
        .col.left {
          order: 1;
        }
        .col.middle {
          order: 2;
        }
        .col.right {
          order: 3;
        }
        .single-pane {
          width: 100%;
        }
        img {
          max-width: 100%;
          height: auto;
        }
      }
      /* CSS for mobile styles */
      @media only screen and (max-width: 599px) {
        .container {
          display: block;
        }
        .col {
          width: 100%;
          padding: 10px;
        }
      }
    </style>
  </head>
  <body>
    <!-- 3-column section with images -->
    <div class="container">
      <div class="col left">
        <img src="image1.jpg" alt="Image 1">
        <!-- Content for left column -->
      </div>
      <div class="col middle">
        <img src="image2.jpg" alt="Image 2">
        <!-- Content for middle column -->
      </div>
      <div class="col right">
        <img src="image3.jpg" alt="Image 3">
        <!-- Content for right column -->
      </div>
    </div>
  </body>
</html>
  1. ለድርጊት ጥሪ አጽዳ (የሲቲኤ): ግልጽ እና ታዋቂ CTA በማንኛውም ኢሜይል ውስጥ አስፈላጊ ነው፣ ነገር ግን በተለይ በሞባይል ተስማሚ ኢሜል ውስጥ አስፈላጊ ነው። CTA በቀላሉ ማግኘት እና በተንቀሳቃሽ መሳሪያ ላይ ጠቅ ለማድረግ በቂ መሆኑን ያረጋግጡ። አዝራሮችን ካካተትክ፣ በሲኤስኤስ ከውስጥ ስታይል መለያዎች ጋር መፃፋቸውን ማረጋገጥ ትችላለህ፡-
<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <style>
      /* Desktop styles */
      .button {
        display: inline-block;
        background-color: #4CAF50;
        color: #ffffff;
        padding: 10px 20px;
        text-align: center;
        text-decoration: none;
        border-radius: 5px;
        font-size: 16px;
        font-weight: bold;
        margin-bottom: 20px;
      }
      /* Mobile styles */
      @media only screen and (max-width: 600px) {
        .button {
          display: block;
          width: 100%;
        }
      }
    </style>
  </head>
  <body>
    <h1>Sample Responsive Email</h1>
    <p>This is an example of a responsive email with a button.</p>
    <a href="#" class="button" style="background-color: #4CAF50; color: #ffffff; text-decoration: none; padding: 10px 20px; border-radius: 5px; font-size: 16px; font-weight: bold;">Click Here</a>
  </body>
</html>
  1. አጭር እና አጭር ይዘት; የኢሜይሉን ይዘት አጭር እና እስከ ነጥቡ ድረስ ያቆዩት። የኤችቲኤምኤል ኢሜል የቁምፊ ገደብ ጥቅም ላይ በሚውልበት የኢሜል ደንበኛ ላይ ተመስርቶ ሊለያይ ይችላል. ነገር ግን፣ አብዛኛዎቹ የኢሜይል ደንበኞች ለኢሜይሎች ከፍተኛውን የመጠን ገደብ ይጥላሉ፣ በተለይም በ1024-2048 ኪሎባይት (KB), ሁለቱንም የኤችቲኤምኤል ኮድ እና ማንኛውንም ምስሎችን ወይም አባሪዎችን ያካትታል። በትንሽ ስክሪን ላይ በማሸብለል እና በማንበብ ይዘቱ በቀላሉ እንዲቃኝ ለማድረግ ንዑስ ርዕሶችን፣ ነጥብ ነጥቦችን እና ሌሎች የቅርጸት ቴክኒኮችን ይጠቀሙ።
  2. በይነተገናኝ አካላት፡ ያካተተ በይነተገናኝ አካላት የደንበኝነት ተመዝጋቢዎን ትኩረት የሚስብ ተሳትፎን፣ ግንዛቤን እና የልወጣ መጠኖችን ከኢሜልዎ ከፍ ያደርገዋል። የታነሙ GIFs፣ የሰዓት ቆጣሪዎች ፣ ቪዲዮዎች እና ሌሎች አካላት በአብዛኛዎቹ የስማርትፎን ኢሜይል ደንበኞች ይደገፋሉ።
  3. ለግል ማበጀት ለአንድ የተወሰነ የደንበኝነት ተመዝጋቢ ሰላምታውን እና ይዘቱን ግላዊነት ማላበስ ተሳትፎን በከፍተኛ ሁኔታ ሊያሳድግ ይችላል፣ በትክክል እንዳገኙ እርግጠኛ ይሁኑ! ለምሳሌ. በመጀመሪያ ስም መስክ ውስጥ ምንም ውሂብ ከሌለ ውድቀት መኖሩ አስፈላጊ ነው።
  4. ተለዋዋጭ ይዘት፡ የይዘቱን መከፋፈል እና ማበጀት ከደንበኝነት ምዝገባ የመውጣት ዋጋዎችን ሊቀንስ እና ተመዝጋቢዎችዎን እንዲሳተፉ ሊያደርግ ይችላል።
  5. የዘመቻ ውህደት፡- አብዛኛዎቹ ዘመናዊ የኢሜል አገልግሎት አቅራቢዎች በራስ-ሰር የማያያዝ ችሎታ አላቸው። የUTM የዘመቻ መጠየቂያ ገመዶች ኢሜልን እንደ ቻናል በትንታኔ ማየት እንድትችል ለእያንዳንዱ አገናኝ።
  6. ምርጫ ማዕከል፡- የኢሜል ግብይት ለኢሜይሎች መርጦ መግባት ወይም መርጦ ለመውጣት ብቻ በጣም አስፈላጊ ነው። ተመዝጋቢዎችዎ ምን ያህል ኢሜይሎችን እንደሚቀበሉ እና ምን ይዘት ለእነሱ አስፈላጊ እንደሆነ የሚቀይሩበት የምርጫ ማእከልን ማካተት ከተሳተፉ ተመዝጋቢዎች ጋር ጠንካራ የኢሜል ፕሮግራም ለማቆየት በጣም ጥሩ መንገድ ነው!
  7. ሙከራ ፣ ሙከራ ፣ ሙከራ ኢሜልዎን በብዙ መሳሪያዎች ላይ መሞከርዎን ወይም መተግበሪያን መጠቀምዎን ያረጋግጡ በኢሜል ደንበኞች ላይ የእርስዎን ኢሜይሎች አስቀድመው ይመልከቱ ጥሩ መስሎ እንዲታይ እና በተለያዩ የስክሪን መጠኖች እና ኦፕሬቲንግ ሲስተሞች ላይ ከመላክዎ በፊት በትክክል እንደሚሰራ ለማረጋገጥ። የመፈተኛው እንደዘገበው 3ቱ ተወዳጅ የሞባይል ክፍት አካባቢዎች ተመሳሳይ ሆነው ይቀጥላሉ፡ አፕል አይፎን (አይኦኤስ ሜይል)፣ ጎግል አንድሮይድ፣ አፕል አይፓድ (አይፓድኦኤስ ሜይል)። እንዲሁም የእርስዎን ክፍት እና ጠቅ በማድረግ ዋጋዎችን ለማሻሻል የርእሰ ጉዳይዎን መስመሮች እና ይዘቶች የሙከራ ልዩነቶችን ያካትቱ። ብዙ የኢሜይል መድረኮች አሁን ዝርዝሩን ናሙና የሚያደርግ፣ አሸናፊውን ልዩነት የሚለይ እና ለቀሪ ተመዝጋቢዎች ምርጡን ኢሜይል የሚልክ አውቶማቲክ ሙከራን ያካትታሉ።

ኩባንያዎ ተሳትፎን የሚያበረታቱ የሞባይል ምላሽ ሰጪ ኢሜይሎችን በመንደፍ፣ በመሞከር እና በመተግበር ላይ እየታገለ ከሆነ የእኔን ድርጅት ለማነጋገር አያመንቱ። DK New Media በሁሉም የኢሜል አገልግሎት አቅራቢዎች ትግበራ ልምድ አለው (በተለይም,).

Douglas Karr

Douglas Karr CMO ነው። ግንዛቤዎችን ይክፈቱ እና መስራች Martech Zone. ዳግላስ በደርዘኖች የሚቆጠሩ ስኬታማ የማርቴክ ጅምሮችን ረድቷል፣ በማርቴክ ግዥዎች እና ኢንቨስትመንቶች ከ$5 ቢሊዮን በላይ ተገቢውን ትጋት በማግኘቱ እና ኩባንያዎች የሽያጭ እና የግብይት ስልቶቻቸውን እንዲተገብሩ እና በራስ ሰር እንዲሰሩ ማገዙን ቀጥሏል። ዳግላስ በአለም አቀፍ ደረጃ እውቅና ያለው ዲጂታል ለውጥ እና የማርቴክ ባለሙያ እና ተናጋሪ ነው። ዳግላስ የዱሚ መመሪያ እና የንግድ ሥራ አመራር መጽሐፍ የታተመ ደራሲ ነው።

ተዛማጅ ርዕሶች

ወደ ላይኛው አዝራር ተመለስ
ገጠመ

ማስታወቂያ እገዳ ተገኝቷል

Martech Zone ይህንን ይዘት ያለ ምንም ወጪ ሊያቀርብልዎ ይችላል ምክንያቱም ገጻችንን በማስታወቂያ ገቢ፣ በተዛማጅ ማገናኛ እና በስፖንሰርነት ገቢ ስለምንፈጥር ነው። ጣቢያችንን ሲመለከቱ የማስታወቂያ ማገጃውን ቢያነሱት እናደንቃለን።