MJML generated html to text ratio is 5%

[lechuhuuha]

Hi
When using mjml to generate into html to send mail
i see that the html to text ratio is so low is around 5.9%

And idk if that effect my email marketing software but user has reported after use mjml the email start get into gmail promotion tab more often even though the email is the contact want to receive

Here is the mjml

<mjml>
  <mj-head>
    <mj-attributes>
      <mj-all font-family="Arial">
      </mj-all>
    </mj-attributes>
  </mj-head>
  <mj-body id="i5aj" background-color="#f5f5f5">
    <mj-section padding="0 0 0 0" id="i4nl">
      <mj-column padding="3px 0 5px 0" background-color="#6722d1" id="ifsh">
        <mj-image src="https://appv4.zozo.vn/files/62cfbe7293a34/NameZOZO_EMA.png" padding="0 20px 0 20px" align="left" id="io4ml" width="86px" href="https://zozo.vn/ung-dung-email-marketing?affSource=Thuyntt2Email">
        </mj-image>
      </mj-column>
    </mj-section>
    <mj-section padding="0 0 0 0" background-color="#ffffff" id="iu1inb">
      <mj-column padding="0 0 0 0" id="ixs9he">
      </mj-column>
    </mj-section>
    <mj-section padding="10px 0 1px 0" background-color="#ffffff" id="ipy26y">
      <mj-column padding="10px 8px 5px 8px" id="iuyi7c">
        <mj-text font-family="Arial, Helvetica, sans-serif" font-weight="100" line-height="21px" color="black" id="ixgdb">
          <em>K&iacute;nh gửi Qu&yacute; kh&aacute;ch h&agrave;ng {NAME},</em>
        </mj-text>
        <mj-text font-family="Arial, Helvetica, sans-serif" font-weight="100" line-height="21px" color="black" id="i7xmj2">Với mong muốn gi&uacute;p c&aacute;c doanh nghiệp Việt tối ưu hiệu suất kinh doanh cũng như khai th&aacute;c triệt để nguồn data kh&aacute;ch h&agrave;ng hiện c&oacute;, Zozo xin được gửi đến Qu&yacute; kh&aacute;ch h&agrave;ng 
          <a href="https://zozo.vn/bang-gia-email-marketing?affSource=Thuyntt2KM" style="text-decoration: none;" target="_blank"><span style="color:#9b59b6;">bảng gi&aacute; mới</span></a>&nbsp;d&agrave;nh cho dịch vụ 
          <a href="https://zozo.vn/ung-dung-email-marketing?affSource=Thuyntt2KM" style="text-decoration: none;" target="_blank"><span style="color:#9b59b6;">Email Marketing</span></a>!
        </mj-text>
      </mj-column>
    </mj-section>
    <mj-section padding="5px 0 5px 0" text-align="left" background-color="#ffffff" id="i6fmc3">
      <mj-column padding="0 0 0 0" width="203px" id="iixv0l">
        <mj-text container-background-color="#6722d1" id="ikvppj">
          <strong><span style="color:#ecf0f1;">ĐỐI VỚI G&Oacute;I TH&Aacute;NG</span></strong>
        </mj-text>
      </mj-column>
    </mj-section>
    <mj-section padding="0 0 0 0" background-color="#ffffff" id="iiqhwk">
      <mj-column padding="5px 8px 0 8px" id="igvsey">
        <mj-text font-family="Arial, Helvetica, sans-serif" font-weight="100" line-height="21px" color="black" padding="5px 25px 5px 25px" id="i3hbss">Từ ng&agrave;y 
          <span style="color:#8e44ad;">22/05/2023</span>, khi đăng k&yacute; 
          <span style="color:#8e44ad;">g&oacute;i th&aacute;ng</span> dịch vụ Email Marketing:
        </mj-text>
      </mj-column>
    </mj-section>
    <mj-section padding="0 0 0 0" background-color="#ffffff" id="iwtu96">
      <mj-column padding="0 8px 0 8px" id="ienws4">
        <mj-text font-family="Arial, Helvetica, sans-serif" font-weight="100" line-height="21px" color="black" padding="0 25px 5px 25px" id="ifonkg">
          <ul>
            <li>Giảm 25%&nbsp;khi đăng k&yacute;&nbsp;6 th&aacute;ng
            </li>
            <li>Giảm 35%&nbsp;khi đăng k&yacute;&nbsp;12 th&aacute;ng
            </li>
            <li>Giảm 40%&nbsp;khi đăng k&yacute;&nbsp;24 th&aacute;ng
            </li>
          </ul>
        </mj-text>
      </mj-column>
    </mj-section>
    <mj-section padding="5px 0 5px 0" text-align="left" background-color="#ffffff" id="iuew9x">
      <mj-column padding="0 0 0 0" width="203px" id="ioy75i">
        <mj-text container-background-color="#6722d1" id="irolo">
          <strong><span style="color:#ecf0f1;">ĐỐI VỚI G&Oacute;I HẠN MỨC</span></strong>
        </mj-text>
      </mj-column>
    </mj-section>
    <mj-section padding="0 0 0 0" background-color="#ffffff" id="iclup">
      <mj-column padding="5px 8px 0 8px" id="iao3i">
        <mj-text font-family="Arial, Helvetica, sans-serif" font-weight="100" line-height="21px" color="black" padding="5px 25px 5px 25px" id="i1i1l">Từ ng&agrave;y 
          <span style="color:#8e44ad;">20/06/2023</span>, khi đăng k&yacute; 
          <span style="color:#8e44ad;">g&oacute;i hạn mức</span>&nbsp;dịch vụ Email Marketing:
        </mj-text>
      </mj-column>
    </mj-section>
    <mj-section padding="0 0 0 0" background-color="#ffffff" id="i4n73d">
      <mj-column padding="0 8px 0 8px" id="iwnzsh">
        <mj-text font-family="Arial, Helvetica, sans-serif" font-weight="100" line-height="21px" color="black" padding="0 25px 0 25px" id="iwkvws">
          <ul>
            <li>Giảm 10%&nbsp;khi đăng k&yacute;&nbsp;g&oacute;i Cre-50K
            </li>
            <li>Giảm 20%&nbsp;khi đăng k&yacute;&nbsp;g&oacute;i Cre-100K
            </li>
            <li>Giảm 30%&nbsp;khi đăng k&yacute;&nbsp;g&oacute;i Cre-200K
            </li>
          </ul>
        </mj-text>
      </mj-column>
    </mj-section>
    <mj-section padding="0 0 20px 0" background-color="#ffffff" id="ii4av">
      <mj-column padding="0 8px 5px 8px" id="ici6e">
        <mj-text font-family="Arial, Helvetica, sans-serif" font-weight="100" line-height="21px" id="i3vaz" color="black">
          <em><span style="color:#8e44ad;"><strong>*Lưu &yacute;:</strong><strong> </strong></span>Bảng gi&aacute; mới&nbsp;dụng cho tất cả kh&aacute;ch h&agrave;ng đăng k&yacute; v&agrave; gia hạn dịch vụ<br />
            Email Marketing Zozo EMA.</em>
        </mj-text>
        <mj-button border-radius="30px" width="225px" id="i0gvhh" href="https://zozo.vn/blog/uu-dai-mua-cang-nhieu-gia-cang-re-giam-den-40-dich-vu-email-marketing-663" background-color="#ff7800">Chi tiết gi&aacute; cập nhật
        </mj-button>
      </mj-column>
    </mj-section>
    <mj-section padding="15px 20px 5px 20px" background-color="#000000" id="i0nox">
      <mj-column padding="0 0 0 0" width="379px" id="ivbsh">
        <mj-image src="https://appv4.zozo.vn/files/62cfbe7293a34/Nameicon.png" padding="0 0 0 0" align="left" id="i1lq1" width="55px" href="https://zozo.vn/?affSource=Thuyntt2Email">
        </mj-image>
        <mj-text padding="10px 5px 10px 5px" font-size="9px" id="i3wnl" color="#ffffff">
          <strong>CÔNG TY TNHH PHẦN MỀM ZOZO</strong>
        </mj-text>
      </mj-column>
      <mj-column padding="0 0 0 0" id="i31oa" width="178px">
        <mj-text padding="30px 0 0 0" font-size="10px" font-family="Helvetica, sans-serif" font-weight="100" line-height="16px" color="#ffffff" id="innqx">
          <span id="i1bmo">Giữ liên lạc nhé.</span>
        </mj-text>
        <mj-social font-size="12px" icon-size="24px" align="left" id="ires4" padding="5px 0 0 0">
          <mj-social-element name="custom" src="https://appv4.zozo.vn/files/62cfbe7293a34/unnamed_2.png" id="iuyow" href="https://www.facebook.com/ema.zozo.vn">
          </mj-social-element>
          <mj-social-element name="custom" src="https://appv4.zozo.vn/files/62cfbe7293a34/unnamed_1.png" id="izxj5" href="https://www.instagram.com/zozovietnam/">
          </mj-social-element>
          <mj-social-element name="custom" src="https://appv4.zozo.vn/files/62cfbe7293a34/unnamed.png" id="iaxtv" href="https://www.youtube.com/@zozovn">
          </mj-social-element>
        </mj-social>
      </mj-column>
    </mj-section>
    <mj-section padding="0 0 0 0" background-color="#000000" id="injak">
      <mj-column padding="5px 0 0 0" id="inprd">
        <mj-text padding="10px 25px 0 25px" font-size="11px" color="#ffffff" id="ivqau">
          <span id="iz47sl"><strong>Hà Nội</strong></span>
        </mj-text>
        <mj-text padding="10px 25px 10px 25px" font-size="10px" font-family="Helvetica, sans-serif" font-weight="100" line-height="16px" color="#ffffff" id="igvv6">
          <span id="ift20k">Tầng 7, Toà nhà iNET, số 247 Cầu Giấy, phường Dịch Vọng, Quận Cầu Giấy</span>
        </mj-text>
      </mj-column>
      <mj-column padding="5px 0 0 0" id="i4zdg">
        <mj-text padding="10px 25px 0 25px" font-size="11px" color="#ffffff" id="iq77b">
          <strong>Thành phố Hồ Chí Minh</strong>
        </mj-text>
        <mj-text padding="10px 25px 10px 25px" font-size="10px" font-family="Helvetica, sans-serif" font-weight="100" line-height="16px" color="#ffffff" id="ibljv">
          <span id="icoq7f">Tầng 1 Tòa nhà Arrow, Số 40 Hoàng Việt, Phường 4, Quận<br></br>
          Tân Bình
          </span>
        </mj-text>
      </mj-column>
    <mj-column padding="5px 0 0 0" id="irb71">
      <mj-text padding="10px 25px 0 25px" font-size="11px" color="#ffffff" id="ivfz2">
        <strong>Đà Nẵng</strong>
      </mj-text>
      <mj-text padding="10px 25px 10px 25px" font-size="10px" font-family="Helvetica, sans-serif" font-weight="100" line-height="16px" id="icvxe" color="#ffffff">
        <span id="iz7dg7">Tòa nhà S-HOME, Số 56 Nguyễn Tri Phương, Phường Chính Gián, Quận Thanh Khê</span>
      </mj-text>
    </mj-column>
    </mj-section>
  <mj-section padding="10px 0 0 0" background-color="#000000" id="ig7oj">
    <mj-column padding="0 0 10px 0" id="im9gg">
      <mj-divider border-width="0.5px" border-color="#464646" container-background-color="#000000" id="i7zlw" __p="false">
      </mj-divider>
      <mj-text font-size="8px" align="center" id="islb2">
        <font color="#bdc3c7" data-gjs-type="text" draggable="true" id="igh6hd">Hủy đăng k&yacute; nhận Email từ Zozo 
        </font>
        <font data-gjs-type="text" draggable="true">
          <span data-gjs-type="text" draggable="true" id="iqwp3h" style="text-decoration:underline;"><a href="{UNSUBSCRIBE_URL}" style="text-decoration: none;" target="_blank"><span style="color:#ecf0f1;">tại đ&acirc;y</span></a></span>
        </font>
        <span style="color:#ecf0f1;"><font data-gjs-type="text" draggable="true">
          <span data-gjs-type="text" draggable="true" style="text-decoration:underline;"></span>.
          </font></span>
        <font color="#bdc3c7" data-gjs-type="text" draggable="true">&nbsp; 
        </font>
      </mj-text>
    </mj-column>
  </mj-section>
  </mj-body>
</mjml>

Anybody encounter these kind of behaviour b4 ?
If yes then can you share some info how to solve these issues?
Thanks

[iRyusa]

Well i think your MJML can be heavily simplified by merging section together if the background stay the same you can just use multiple mj-text inside a column.

Don't use empty mj-section for padding :

<mj-section padding="0 0 0 0" background-color="#ffffff" id="iu1inb">
      <mj-column padding="0 0 0 0" id="ixs9he">
      </mj-column>
    </mj-section>

Just use a bottom padding or top padding on previous / next section depending on the background