وبلاگ

سایت ساز سی می پلاس

مقالات

دکمه فراخوان چیست و چه کاربردی دارد؟ چطور یک دکمه فراخوان مناسب طراحی کنیم؟

دوشنبه، ۲۷ خرداد ۱۳۹۸

زمان مطالعه: حدود 5 دقیقه
دکمه فراخوان چیست و چه کاربردی دارد؟ چطور یک دکمه فراخوان مناسب طراحی کنیم؟

شمایی که در حال خواندن این مقاله هستید بی‌شک یا یک وب سایت دارید و یا اینکه حداقل به فکر طراحی سایت هستید. به هر ترتیب در این مقاله می‌خواهیم موضوع CTA را به شما آموزش دهیم، دکمه‌های اصطلاحا Call To Action که شما بیشتر از همیشه به هدفتان، چه فروش باشد و چه انجام هر کاری توسط کاربر نزدیک‌‌تر می‌کند. با سایت ساز و فروشگاه ساز سی می پلاس همراه باشید هر آنچه لازم است درباره CTA ها بدانید را با شما در میان بگذاریم.
 

CTA چیست؟

Call to actionها در اصل عبارات، دکمه‌ها و لینک‌هایی هستند که شما را ترغیب می‌کند کار خاصی را در وب سایت انجام دهید. مثلا دکمه بزرگ دانلود آبی رنگ با نوشته دانلود به شما نشان می‌دهد که برای دانلود فایل باید روی آن کلیک کنید. عملا دکمه‌های CTA یا همان فراخوان‌ها، برای این در وب سایت قرار می‌گیرند که به کار نشان دهند الان باید چه کاری را انجام دهد.
 نمونه‌ای از دکمه فراخوان یا Call to Action
 نمونه‌ای از دکمه فراخوان یا Call to Action
 

چطور CTAهای کاربردی بسازیم؟

 

اولین قدم: هدفتان را مشخص کنید

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

قدم دوم: انتخاب رنگ جلب کننده برای دکمه CTA

مهمترین نکته‌ای که در مورد دکمه‌های فراخوان باید در نظر بگیرید، رنگ آن‌هاست. رنگی که انتخاب می‌کنید به هیچ عنوان نباید سفید، خاکستری و یا مشکی باشد، بلکه باید از رنگی استفاده کنید که در صفحه به خوبی مشخص باشد و اتفاقا توجه کاربر را جلب کند. انتخاب رنگ برای دکمه‌های CTA اصلا سخت نیست، تنها کافی است این چک لیست ساده را دنبال کنید:
  • رنگ انتخابی باید قابل تشخیص از رنگ پس زمینه باشد
  • رنگ انتخابی باید با پس زمینه و سایر المان‌های صفحه هم‌خوانی داشته باشد.
  • رنگ دکمه CTA باید توجه کاربران را جلب کند. (برای اینکه متوجه شوید چقدر در توجه کاربر موفق بوده‌اید می‌توانید از تست A/B و یا تست با افراد استفاده کنید.)
 
با توجه به تست‌های انجام شده می‌توانیم بگوییم که دکمه‌های فراخوانی که رنگ نارنجی، آبی، سبز و قرمز داشته‌اند، بیشتر از هر رنگ دیگری توجه کاربران را به خود جلب کرده‌اند.
البته فراموش نکنید که رنگ‌هایی که در المان‌های اطراف دکمه CTA به کار می‌رود هم تاثیر زیادی در مشخص بودن CTA دارد. در بهترین حالت، رنگ‌هایی که باید در کنار دکمه نارنجی، آبی، سبز و قرمز به کار رود، باید سفید، خاکستری و مشکی باشد.


رنگ مناسب برای المان‌های اطراف دکمه فراخوان
رنگ مناسب برای المان‌های اطراف دکمه فراخوان
 

قدم سوم: طراحی ساده، جلب توجه بیشتر

یک اشتباه رایج هنگام طراحی دکمه‌های فراخوان، شلوغ کردن کار و استفاده از طراحی پیچیده است. هنوز هم عده زیادی تصور می‌کنند که برای جلب توجه کاربر به دکمه فراخوان، باید از تصویر در پس زمینه دکمه، فونتی با استایل‌های خاص و ایفکت‌های CSS زیاد استفاده کنند اما این کار اشتباه است.
در واقع تست‌های مختلف نشان داده است که دکمه‌های فراخوانی که طراحی ساده‌تری دارند، بهتر نظر کاربران را جلب می‌کنند.
 
 

قدم چهارم: تعیین اندازه مناسب دکمه فراخوان

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

0 دیدگاه

ارسال دیدگاه

نشانی ایمیل شما منتشر نخواهد شد.
کد امنیتی

مشاهده دیدگاه های بیشتر