移動(dòng)互聯(lián)網(wǎng)的崛起，催生了響應(yīng)式設(shè)計(jì)的誕生與興起。幾乎所有的營(yíng)銷(xiāo)渠道都與”移動(dòng)化”這一詞匯捆綁，電子郵件營(yíng)銷(xiāo)也不例外。大部分電子郵件通過(guò)移動(dòng)設(shè)備打開(kāi)閱讀，這一比例將在后續(xù)幾年內(nèi)繼續(xù)增長(zhǎng)。同時(shí),至少50%的移動(dòng)用戶(hù)會(huì)選擇關(guān)閉或刪除并非個(gè)性化的電子郵件。未來(lái)電子郵件營(yíng)銷(xiāo)的進(jìn)化深度反映著其是否具備適應(yīng)互聯(lián)網(wǎng)時(shí)代瞬息萬(wàn)變的能力。

響應(yīng)式設(shè)計(jì)指集中創(chuàng)建頁(yè)面的圖片排版大小，智能地根據(jù)用戶(hù)行為以及使用的設(shè)備環(huán)境(系統(tǒng)平臺(tái)、屏幕尺寸、屏幕定向等)進(jìn)行相對(duì)應(yīng)的布局，在郵件呈現(xiàn)上，通過(guò)頁(yè)面隱藏、折疊、擴(kuò)展，為用戶(hù)帶來(lái)舒適的移動(dòng)閱讀體驗(yàn)。下面為大家推薦制作響應(yīng)式郵件過(guò)程中的十個(gè)關(guān)鍵要點(diǎn)。

1.郵件布局
始終都要牢記“響應(yīng)式”這一詞匯，特別是在設(shè)計(jì)階段。從移動(dòng)設(shè)計(jì)的理念著手，創(chuàng)建移動(dòng)化的視覺(jué)版本，盡量使其保持簡(jiǎn)潔有序。越是繁多的圖像或復(fù)雜的設(shè)計(jì)，往往越難送達(dá)，移動(dòng)用戶(hù)可能無(wú)法收到此類(lèi)郵件。

2.堅(jiān)持單行索引
建議選擇單行索引的設(shè)計(jì)版式，以促使郵件優(yōu)化過(guò)程盡量簡(jiǎn)單化。這并不是說(shuō)多行索引設(shè)計(jì)無(wú)法在移動(dòng)設(shè)備上正常顯示或運(yùn)行，只是如果需要同時(shí)滿(mǎn)足PC端和移動(dòng)自適應(yīng)，相關(guān)技術(shù)難度可能會(huì)提升不少。

3.文本左對(duì)齊
有相關(guān)視覺(jué)跟蹤研究表明，西方用戶(hù)的大部分注意力集中在電子郵件內(nèi)容的左邊部分。當(dāng)然有些操作系統(tǒng)，尤其是安卓系統(tǒng)，無(wú)法衡量?jī)?nèi)容實(shí)際寬度以適應(yīng)屏幕，因此只能顯示郵件的左半部分。從人體工程學(xué)的角度，大多數(shù)用戶(hù)更容易瀏覽到屏幕左下角及中間位置的郵件內(nèi)容。

4.頂層內(nèi)容
簡(jiǎn)化屏幕在一定程度上確實(shí)改變了郵件設(shè)計(jì)規(guī)則。在制作郵件時(shí)，具有象征性的CTA購(gòu)買(mǎi)按鍵應(yīng)盡可能靠近頂部位置，如果無(wú)法被用戶(hù)立即看到，它們有可能永遠(yuǎn)不會(huì)被看到。

5.Media Queries特性
Media Queries是響應(yīng)式設(shè)計(jì)中最重的一部分，它不僅被運(yùn)用于網(wǎng)站響應(yīng)，而且還能用于電子郵件的布局，使郵件改變成適應(yīng)移動(dòng)設(shè)備顯示的版本。不同類(lèi)型的移動(dòng)設(shè)備具有不同的Media Queries特性，這意味著將根據(jù)屏幕分辨率鎖定熱門(mén)設(shè)備進(jìn)行個(gè)性化投遞。

6.尺寸大小
根據(jù)蘋(píng)果公司的指導(dǎo)建議，鏈接和按鈕的尺寸應(yīng)當(dāng)控制在44*44像素以上。在移動(dòng)設(shè)備顯示上，不起眼的鏈接和按鈕是最無(wú)用的設(shè)計(jì)。另外，字體大小可保持在17-21像素范圍內(nèi)，最佳字體大小則為19像素。

7.精簡(jiǎn)內(nèi)容
并不是所有的郵件內(nèi)容都是重要的。不妨在創(chuàng)建響應(yīng)式設(shè)計(jì)時(shí)，選擇郵件中最重要的信息點(diǎn)顯示，避免過(guò)分擁擠的移動(dòng)信息。營(yíng)銷(xiāo)人員需要注意保持郵件內(nèi)容簡(jiǎn)潔明了，小屏幕意味著營(yíng)銷(xiāo)人員將比以往任何時(shí)候都重視與用戶(hù)的有效互動(dòng)。而屏幕的運(yùn)用變得尤為珍貴，設(shè)計(jì)人員應(yīng)在郵件中隱藏次要內(nèi)容，保證重要信息能夠被用戶(hù)關(guān)注，突出顯示優(yōu)先級(jí)的內(nèi)容。

8.考慮完整性
當(dāng)你在為移動(dòng)用戶(hù)縮減設(shè)計(jì)時(shí)，不要僅僅只關(guān)注頁(yè)面布局還需要考慮郵件完整性。營(yíng)銷(xiāo)人員應(yīng)考慮郵件中的每一個(gè)部分是否適合在移動(dòng)端顯露，這將給予設(shè)計(jì)人員更大的空間進(jìn)行郵件設(shè)計(jì)。

9.響應(yīng)式圖片
移動(dòng)設(shè)備在加載項(xiàng)目時(shí)通常比PC設(shè)備慢，郵件中各類(lèi)元素需要同時(shí)升級(jí)移動(dòng)閱讀體驗(yàn)，除了文字、版式設(shè)計(jì)等，圖像也是不容忽視的一環(huán)，所有在移動(dòng)端顯示的內(nèi)容都應(yīng)具備響應(yīng)式的設(shè)計(jì)前提。

10.測(cè)試
市面上現(xiàn)在有許多免費(fèi)的在線工具以測(cè)試移動(dòng)設(shè)計(jì)，提供在不同尺寸大小的移動(dòng)設(shè)備上的設(shè)計(jì)預(yù)覽。不妨利用這些在線工具在正式發(fā)送郵件前細(xì)心調(diào)整，避免錯(cuò)誤，提升移動(dòng)用戶(hù)的閱讀體驗(yàn)。

樂(lè)發(fā)網(wǎng)超市批發(fā)網(wǎng)提供超市貨源信息,超市采購(gòu)進(jìn)貨渠道。超市進(jìn)貨網(wǎng)提供成都食品批發(fā),日用百貨批發(fā)信息、微信淘寶網(wǎng)店超市采購(gòu)信息和超市加盟信息.打造國(guó)內(nèi)超市采購(gòu)商與批發(fā)市場(chǎng)供應(yīng)廠商搭建網(wǎng)上批發(fā)市場(chǎng)平臺(tái),是全國(guó)批發(fā)市場(chǎng)行業(yè)中電子商務(wù)權(quán)威性網(wǎng)站。

本文內(nèi)容整合網(wǎng)站：百度百科、知乎、淘寶平臺(tái)規(guī)則

本文來(lái)源： 移動(dòng)互聯(lián)網(wǎng)必備：響應(yīng)式設(shè)計(jì)不可錯(cuò)過(guò)的十大妙招