تهران، سعادت آباد، خیابان کوهستان،
مجتمع کوهستان، سرو ۴، طبقه ۳ واحد ۲
۲۲۱۳۴۴۹۶ ۰۲۱
۳۶۶۶۸۳۲۸ ۰۲۶
info[at]web-city.ir
support[at]web-city.ir

چگونه قالب های منحصر به فرد برای ایمیل طراحی کنیم؟

چگونه قالب های منحصر به فرد برای ایمیل طراحی کنیم؟

در حالی که بسیاری از ارتباطات آنلاین به سمت شبکه های اجتماعی رفته اند و از آنها استفاده مینمایند, هنوز ایمیل در معرفی کالاها و درست کردن کمپین های تبلیغاتی جایگاه بسیار مهمی را دارد. زمانی که ما از بازاریابی ایمیلی صحبت میکنیم هنوز ذهن ما به ارسال ایمیل های HTML به جای ایمیل های معمولی در قالب متن های بسیار عادی منحرف میشود.

طراحی یک قالب ایمیل دقیقا مانند طراحی یک صفحه وب سایت میباشد, اما در پیاده سازی آن باید به چند نکته کوچک و کلیدی توجه داشت. باید به یاد داشته باشید که ایمیل و ارسال آن از نوع تکنولوژی های PUSH به حساب می آید و نباید آن را با تکنولوژی PULL اشتباه گرفت.

بسیاری از مردم امروزه انواع و اقسام ایمیل ها را دریافت مینمایند و دیدن خیلی از این ایمیل ها برای کاربران خوش آیند به نظر نمیرسد. اما به محض دیده شدن ایمیل در ,inbox کاربر میتواند بر روی آن کلیک نموده و وارد طراحی وب سایت شود و جزئیات بیشتری را از ایمیل و یا محصول مورد نظر دریافت نماید.

اما به خاطر داشته باشید که در مدت زمان کوتاهی میتوانید توجه کاربر را به ایمیل مربوطه منحرف نمایید. به این معنا که زمان زیادی برای معرفی خود در ایمیل نخواهید داشت و کاربر هم برای دیدن یا حتی خواندن همه آنها وقت خود را صرف نخواهد نمود. در نهایت همه اینها میتواند با طراحی یک قالب ایمیل خوب اتفاق بیافتد.

موبایل یا مجسمه نیم تنه

امروزه بسیاری از مردم توسط گوشی های موبایل خود به ایمیل های خودشان دسترسی پیدا می نمایند و نزدیک به نیمی از ایمیل ها توسط نرم افزارهای موبایل توسط گوشی های کاربران باز میشوند. این به آن معنا میباشد که زمان خود را بیهوده صرف قالب های ایمیلی مینمایید که به صورت درست هم در داخل این نرم افزار ها نمایش داده نمیشود. بسیاری از این ایمیل ها به دلیل تنوع نرم افزارها و بر پایه وب و زبان HTML نبودن به هم خواهند ریخت و ممکن است معرفی کسب و کار شما به خوبی انجام نپذیرد.

روی هم رفته حتی اگر ایمیلی بر روی گوشی موبایل هم به درستی نشان داده نشود, چند در صد احتمال خواهد داشت که کاربران بعد از دیدن موبایل و ایمیل مربوطه آن را بخوانند. من با شما شرط میبندم که احتمال آن بسیار کم خواهد بود. بسیاری از آنها ایمیل مربوطه را پاک خواهند نمود و یا حتی لغو عضویت را انجام خواهند داد.

دو راه وجود دارد تا بتوانیم طراحی خوبی برای ایمیل های موبایل داشته باشیم. طراحی ایمیلی که با صفحه نمایش موبایل کاربران هماهنگ بوده و به درستی در آن نشان داده شود. راه دوم طراحی ایمیل به صورت ریسپانسیو دقیقا مانند طراحی یک صفحه وب سایت.

اما همه اینها دارای معایب و مزایای مربوط به خودشان هستند. ایمیلی که به صورت اتوماتیک در هر نوع دستگاهی درست نمایش داده شود بسیار خوب و استفاده از آن برای کاربران بسیار آسان میباشد. اما نوشتن کدها به صورت ریسپانسیو کمی مشکل به نظر می آید و توسط هر مرورگر موبایلی قابل پشتیبانی نمیباشد و یا به یک صورت نشان داده نمیشود. البته با گذر زمان این پشتیبانی کامل تر شده و تکامل پیدا مینماید.

این تکنیک هایی که در این مقاله به آن اشاره شد هم میتواند در سئو وب سایت نیز مورد استفاده قرار بگیرد

طراحی واکنش گرا یا Responsive

طراحی واکنش گرای یک ایمیل توسط زبان HTML و CSS بسیار عملی تر میباشد. البته به یاد داشته باشید که در صفحه نمایش کوچکتر, خواندن ایمیل ها کمی مشکل تر به نظر می آید.

قبلا بیان شد که چرا طراحی ایمیل هایی که در موبایل ها به خوبی نمایش داده شود بسیار اهمیت دارد, اما ذکر چند نکته در طراحی قالب این چنین ایمیل هایی بسیار با اهمیت میباشد. این ها نکاتی هستند که برای طراحی قالب ایمیل های موبایل میتواند کاربرد داشته باشند و حتی میتوان از آنها برای کامپیوترهای رومیزی یا همان Desktop هم استفاده نمود.

۱- قالب شما باید تا جایی که میتواند باریک و ظریف باشد. نهایتا با پهنای ۵۰۰ تا ۶۰۰ پیکسل. این استاندارد میتواند ایمل ها را هم در کامپیوترهای رومیزی و هم در موبایل قابل خواندن نماید.

۲- به خاطر بسپارید که فونتها تا جایی که امکان دارد بزرگ باشند. به خاطر داشته باشید که فونت پیشفرض در تمامی سیستم عامل ها یکسان نمیباشد و این میتواند کار شما را سخت نماید. به عنوان مثال فونت پیشفرض در سیستم عامل IOS 13 پیکسل میباشد.

۳- ناحیه هایی مورد نظر باید به آسانی برای کاربران قابل لمس شدن باشند. به این معنا که به مقدار مناسب بزرگ باشد و حتی نسبت به آیتم های اطرافشان کاملا جداسازی شده تا لمس نمودن آنها به سادگی امکان پذیر باشد.

۴- در استفاده از دستور CSS تحت نام display:none نگرانی نداشه باشید چرا که توسط آن میتوانید آیتم های اضافی و غیر لازم در داخل صفحه را مخفی نمایید. این کار از به هم ریختگی صفحه وب سایت حتی در نسخه Desktop هم جلوگیری مینماید چه برسد به صفحه نمایشهای کوچکتر.

البته بهترین کار این میباشد که قبل از نوشتن کدها یک نسخه اسکچ دستی هم برای ورژن دسکتاپ و هم برای نسخه موبایل کشیده و طراحی شود. به کلمات و دکمه هایی که به کاربر عملیاتی را گوش زد میکند دقت بسیار زیادی داشته باشید.

ملاحظات چاپی ( Typography )

زمانی که بسیاری از طراحان به موارد و تکنیک های گرافیکی و HTML طراحی قالب های ایمیل دقت مینمایند, بنابراین موارد مربوط به فن چاپ یا همان Typography میتواند در هر وب سایتی مورد توجه قرار گیرد. بر روی همه رفته فکر کنید که چند درصد تصاویر در داخل ایمیل ها برای کاربران لود خواهد شد. از سوی دیگر بسیاری از کاربرانی که ایمیل را دریافت مینمایند اصلا به Typography توجهی ندارند.
از فونت های بزرگ صرفنظر از اندازه صفحه نمایش حتما استفاده نمایید. به فاصله بین خطوط یا همان line height توجهی بسیار زیادی نمایید بطوریکه نه خیلی زیاد و نه خیلی کم باشد.
از Headingها و موارد دیگر که باعث میشود متون به راحتی برای کاربران قابل رویت و خوانده شدن باشد حتما استفاده نمایید مخصوصا زمانی که داخل ایمیل شما چندین پاراگراف وجود داشته باشد.
رویه هم رفته موارد مربوط به Typography داخل ایمیل با طراحی وب سایت تفاوتی دارد.

طراحی قالب های ایمیل مختلف برای اهداف گوناگون

چندین نوع ایمیل میتواند وجود داشته باشد تا شما برای ثبت نام کنندگان در خبرنامه خود میتوانید آن را ارسال نمایید. هر کدام از این طرح ها میتواند اهداف مختلفی را دنبال نماید. بنابراین باید بهترین و موثرترین طراحی را برای آن انجام داد.

در زیر چند شاخه از این دسته بندی را برای شما ذکر میکنیم که عبارتند از:

۱- ایمیل های خبرنامه

۲- ایمیل های اخطاری

۳- ایمیل های صورت حساب و موارد مالی

۴- ایمیل های معرفی کسب و کار و بروشور و کاتالوگ

اشتراک

مجید احدی

مجید احدی هستم‌،توسعه دهنده سایت،قبلا در زمینه دوربین های مداربسته فعالیت داشتم مدتی به کار در حوضه فناوری اطلاعات علاقه مند شدم در حال حاضر به عنوان توسعه دهنده سایت فعالیت میکنم.

پاسخ دهید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

7 − دو =