۵ نکته طلایی برای انتخاب تصاویر لندینگ پیج و افزایش نرخ تبدیل!

می‌گن یه عکس به اندازه هزار کلمه حرف می‌زنه—البته به شرطی که عکس خوبی باشه.

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

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

توی این مقاله چی می‌خونیم؟

۱. سایزشون رو درست انتخاب کنید

عناصر مختلف لندینگ پیج به سایزهای متفاوتی از تصویر نیاز دارن. برای مثال، یه عکس با سایز ۶۰۰ در ۶۰۰ پیکسل، برای «تصویر هیرو» (Hero Image) اصلاً مناسب نیست. برای اینکه به عنوان هدر در صفحه دسکتاپ نمایش داده بشه خیلی کوچیکه و نسبت تصویر مربعی اون، جایی برای متن هدر باقی نمی‌ذاره.

قبل از استفاده از یه عکس، سایز اون رو بر حسب پیکسل چک کنید و با بهترین نسبت تصویر و سایز برای هدف مورد نظرتون مقایسه کنید. (برای چک کردن سایز یه عکس در مرورگر کروم، اون رو در یک تب جدید باز کنید و به عنوانِ تب نگاه کنید تا ابعاد پیکسلی اون رو ببینید.)

توصیه‌های زیادی برای سایز عکس در اینترنت وجود داره، اما شما می‌تونید با عرض صفحه‌تون شروع کنید و از اونجا ادامه بدید. معمولا لندینگ پیج‌ها عرض پیشنهادی ۹۴۰ تا ۹۶۰ پیکسل دارن.

برگردیم به مثال تصویر هیرو؛ شما باید عکسی داشته باشید که حداقل ۹۶۰ پیکسل عرض داشته باشه تا کل عرض لندینگ پیج رو پوشش بده. برای یه تصویر هیروی تمام‌صفحه، به نسبت تصویر ۱۶:۹ نیاز دارید. اگه این اعداد رو توی یه ماشین حساب نسبت تصویر وارد کنید، متوجه می‌شید که به عکسی با حداقل ۹۶۰ پیکسل عرض و ۵۴۰ پیکسل ارتفاع نیاز دارید.

همچنین باید یادتون باشه که تصاویر ممکنه در پلتفرم‌های مختلف با نسبت‌ها و سایزهای متفاوتی نمایش داده بشن. همیشه عکس‌هاتون رو هم روی دسکتاپ و هم روی موبایل دوباره چک کنید تا مطمئن بشید که یه لندینگ پیج سازگار با موبایل (Mobile-Friendly) دارید. یک ابزار ساخت لندینگ پیج واکنش‌گرا برای موبایل این کار رو براتون راحت‌تر می‌کنه.

لندینگ پیج Brutask در زیر، یک تصویر بخش‌بندی شده با سایز مناسب رو در عمل نشون می‌ده:

تصویر هنری در این لندینگ پیج کاملاً در ستون وسطی اون جا شده و با تیتر و زیرتیتر هم‌ترازه.

۲. از تصاویری استفاده کنید که هضمشون راحت باشه

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

در نهایت، لندینگ پیج شما و تصاویرش باید از بهترین شیوه‌های استفاده از «فضای خالی» (White Space) پیروی کنن. وقتی فضای خالی زیادی دور یه عنصر باقی می‌ذارید، اهمیت اون رو نشون می‌دید. این قانون هم برای سوژه‌های داخل تصویر شما و هم برای فضای اطراف تصاویرتون صدق می‌کنه.

تصاویر خلوت همچنین به شما کمک می‌کنن تا یک «سلسله مراتب بصری» (Visual Hierarchy) قوی برای لندینگ پیج‌تون ایجاد کنید. چشم‌های ما به طور طبیعی هنگام مشاهده یک صفحه وب از یک الگوی Z یا F پیروی می‌کنن. وقتی تصاویر یک صفحه نقاط کانونی مشخصی برای دنبال کردن نداشته باشن، پیروی از یک الگوی مستقیم سخت‌تر می‌شه.

ببینید که Trendy Butler چطور از یک تصویر هیرو با یک نقطه کانونی واحد برای ایجاد تأثیری قدرتمند استفاده می‌کنه:

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

۳. تنوع ایجاد کنید

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

تنوع سالم در تصاویر لندینگ پیج، توجه بازدیدکننده‌هاتون رو حین گشت‌وگذار در صفحه‌تون حفظ می‌کنه. به علاوه، باعث می‌شید که هر بخش از لندینگ پیج شما متمایزتر به نظر برسه.

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

ببینید این طراحی لندینگ پیج برای Made Moments چطور با سوژه‌ها و چیدمان‌های تصویری متنوع، فضا رو جذاب نگه داشته:


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

اگه عکس‌هایی که در دسترس دارید تنوع زیادی ندارن، نترسید و از یک وب‌سایت عکس استوک باکیفیت کمک بگیرید. لازم نیست برای استفاده از عکس‌های استوک جیب‌تون رو خالی کنید—سایت‌هایی مثل Unsplash عکس‌هاشون رو رایگان ارائه می‌دن. هر کاری می‌کنید، از عکس‌های نمونه‌ی سایت‌های استوک پولی که واترمارک شفاف روشون هست، استفاده نکنید.

ببینید این عکس رایگان از Unsplash چطور می‌تونه به یه لندینگ پیج تو صنعت غذا و خوراکی جون بده؟


کاربران می‌تونن تصاویر Unsplash رو مستقیماً از طریق Smart Builder به لندینگ پیج‌هاشون اضافه کنن. بعد از نصب اپلیکیشن Unsplash از تب Apps، روی یک جای خالی تصویر کلیک کنید، سپس روی آیکون قلم‌مو کلیک کنید. از اونجا، گزینه Unsplash Image رو در بالای صفحه Image Library انتخاب کنید.

۴. طبیعی و واقعی جلوه بدید

اینترنت پر از عکس‌های استوکیه که می‌تونید برای لندینگ پیج‌تون استفاده کنید. اما همه اون‌ها ارزش‌آفرین نیستن.

اگه تصمیم گرفتید از عکس‌های استوک استفاده کنید، حتماً اون‌هایی رو انتخاب کنید که طبیعی به نظر می‌رسن. یه‌سری از عکس‌های استوک خیلی سرد، مصنوعی و اغراق‌آمیز به نظر می‌رسن—مثلاً اون میم معروف «زنی که تنها با سالاد می‌خنده» رو یادتون بیارید. شما باید از عکس‌های استوکی استفاده کنید که محیط، احساسات و ژست‌هاشون واقعی به نظر برسه.

بخش «People» سایت Unsplash پر از عکس‌های طبیعی از افراده که می‌تونید به لندینگ پیج‌تون اضافه کنید. حتی وقتی به صورت حرفه‌ای ژست گرفته و عکاسی شدن، فیک یا چیپ به نظر نمی‌رسن. یه نگاهی به این نمونه‌ها بندازید:

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

نظرات مشتریان (Testimonials) فرصتی عالی برای گنجاندن تصاویر افراد واقعی—یعنی مشتریان شما—فراهم می‌کنه. ببینید Squareshot چطور تصاویر افرادی که نظرشون رو ثبت کردن، در لندینگ پیجش قرار داده:


Squareshot به عنوان یک سرویس عکاسی حرفه‌ای، منابع لازم برای گرفتن عکس‌های خودش رو داره. اگه شما ندارید، همیشه می‌تونید از مشتریانی که نظر یا توصیه‌نامه می‌دن، بخواید که یک عکس هم برای شما بفرستن. این کار اعتبار اجتماعی (Social Proof) شما رو حتی قانع‌کننده‌تر می‌کنه.

۵. رنگ‌های برندتون رو اضافه کنید

این نکته بیشتر در دسته‌ی «چه خوب میشه اگه باشه» قرار می‌گیره تا «باید باشه»، اما واقعاً می‌تونه به لندینگ پیج شما جون بده. وقتی لندینگ پیجی می‌سازید که رنگ‌های برند شما رو در خودش داره، سعی کنید عکس‌هایی اضافه کنید که اون رنگ‌ها رو هم داشته باشن. اینطوری یک لندینگ پیج خیلی منسجم‌تر خواهید داشت.

چطور عکس‌هایی پیدا کنید که با رنگ‌های برند شما مطابقت دارن؟ در جستجوی تصاویر گوگل روی دکمه «Tools» کلیک کنید و از منوی کشویی «Color» یک گزینه رو انتخاب کنید. همچنین می‌تونید در Canva به عکس‌ها شکل یا متن اضافه کنید یا در فتوشاپ/پیکسلر (Pixlr) رنگ‌های یک عکس رو دستکاری کنید.

Plated یک ردپای ظریف از رنگ برندش رو به تصویر هیروی این لندینگ پیج اضافه کرده:


به اون مدادهای سمت چپ و جاکلیدی سمت راست نگاه کنید—رنگ نارنجی اون‌ها با نارنجی لوگوی Plated مطابقت داره. لازم نیست رنگ‌های برند شما کل تصویر رو بگیرن تا تأثیرگذار باشن.

تصاویر بهتر = نرخ تبدیل بالاتر

چرا باید در مورد تصاویر لندینگ پیج‌تون اینقدر سخت‌گیر باشید؟ به لطف روانشناسی انسان، تصاویر روی پتانسیل تبدیل (Conversion) شما تأثیر می‌ذارن.

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

بنابراین، وقتی تصاویرتون رو با دقت انتخاب می‌کنید، دارید به بازدیدکننده‌هاتون کمک می‌کنید تا تصمیم به تبدیل شدن (به مشتری) بگیرن. و کیه که اینو برای لندینگ پیجش نخواد؟

faveicon mahsign

به مهساین خوش آمدید

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