طراحی سایت ریسپانسیو و تاثیر آن بر نرخ تبدیل سایت

0 46

طراحی سایت ریسپانسیو و تاثیر آن بر نرخ تبدیل سایت

طراحی سایت ریسپانسیو و تاثیر آن بر نرخ تبدیل سایت

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

برای توسعه دادن یک نسخه ی واکنش گرای کاربردی باید این دو کار را انجام دهید.

 
۱- مهمترین اقدام این است که باید درنظر بگیرید که چرا یک کاربر موبایل به سایت شما آمده است.
۲- و باید نیازهای او را درک کنید.

۵ معیار برای درک بهتر کاربرهای موبایلی (لینک به بیرون)

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

۵ قدم برای بهینه سازی کردن سایت ریسپانسیو

۱- بهینه سازی سایز تصاویر با درنظر گرفتن ارزش آن
معمولا عکس ها با طراحی سایت واکنش گرا کاهش سایز میدهند با این وجود ممکن است یک عکس که در نسخه ی دسکتاپ بسیار زیبا به نظر میرسد، در نسخه ی موبایلی به یک بخش گیج کننده و زائد تبدیل شود. با اینکه عکس ها بر اساس ارزش آنها قابل تغییر سایز هستند، اما بعضی از آنها ممکن است کلا برای نسخه ی موبایل نیاز نباشند. در نظر بگیرید که یک عکس چطور در سایت ریسپانسیو شما ظاهر میشود. آیا یک جنبه ی گرافیکی تاثیرگذار دارد؟ اگر تصویر کل صفحه ی گوشی را اشغال کرده است یا به یک محور اصلی وبسایت تبدیل شده است، وقت آن است که درباره ی نحوه ی استفاده ی آن در دستگاه های مختلف تجدید نظر کنید. به عنوان مثال در راه حل سیمپسون، عکس ها به خوبی تغییر سایز داده نمیشوند و از صفحه ی موبایل بیرون میزنند که باعث بهم ریختگی سایت شده و در نتیجه فهم اینکه در سایت چه میگذرد را برای مخاطب مشکل میکند.
عکس هایی که در ورژن دسکتاپ به خوبی کار میکنند ( چه عکس و چه لوگو ) وقتی در ورژن موبایل کل صفحه ی تلفن همراه را اشغال میکنند ارزش خود را از دست میدهند و باعث میشوند که درک سایت مشکل شود.
در مقابل سایت خرده فروشی REI ، از عکس ها چه در نسخه ی موبایل و چه در نسخه ی دسکتاپ به عنوان محور و کانون توجه استفاده میکند اما سایز آن را با توجه به نیاز بازدید کننده به اندازه ی مناسب تغییر میدهد.

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

۳- پاپ آپ ها را از بین ببرید و از Overlay های موبایل استفاده کنید
تبلیغات پاپ آپ که برای نسخه ی دسکتاپ طراحی شده اند باعث حواس پرتی مخاطبان سایت های ورژن موبایل، از هدف اصلی او که به خاطر آن به این سایت آمده است میشود. به جای آن باید تمرکز بر روی یک هدف قرار بگیرد که آن هم هدف بازدید کننده از ورود به سایت است. استفاده از روش پاپ آپ یا Overlayهای دسکتاپ برای نسخه ی موبایل باعث از دست رفتن نرخ تبدیل خواهد شد. به دلیل این که پاپ آپ های مناسب برای دسکتاپ برای هماهنگی با ۱۹هزار ترکیب متفاوت از سایز و رزولوشن مختلف در موبایل های امروزی طراحی نشده اند، استفاده از آنها در نسخه های موبایل منطقی به نظر نمیرسد . شما دوست ندارید که یک پاپ آپ تمام صفحه ی موبایل شما را اشغال کند (به دلیل این که این تبلیغات تغییر سایز نمیدهند) و کاربری سایت شما را غیر قابل تحمل کند.
یک پاپ آپ بد، مانند مثال زیر کاملا صفحه ی تلفن همراه را میپوشاند، از دیده شدن محتوای دیگر جلوگیری میکند ، بستن آن کاری سخت است و سایز آن نیز درخور صفحه ی موبایل نیست (مشاهده کنید که بخش ایمیل چگونه در مثال Last King بریده شده است ).

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

۴- کمتر غنی تر است : متن های خود را ساده، کوتاه و بهینه کنید.
درحالی که واضح به نظر میرسد، نوشته ها یکی از چیزهایی است که کمتر شرکتی وقت صرف مناسب سازی آن برای وبسایت میکند (چه برسد به نسخه ی موبایل). برای جلوگیری از شلوغی و گیج شدن، بهتر است که متن ها را خلاصه کنیم و نوشته های مرتبط با موضوع را استفاده کنیم. همچنین باید به تعداد کلمات استفاده شده در سایت نیز توجه داشته باشیم.
شرکت شما میتواند سرفصل ها و مشخصات محصولات را مجددا تنظیم کند و یا حتی دوباره بنویسد به نحوی که فقط ویژگی ها و اطلاعات مهم برای بازدید کننده ی سایت ورژن موبایل در آنها نوشته شوند. این اقدام علاوه براین تضمین میکند که متن استفاده شده بیشتر از یک صفحه نخواهد شد و ظاهر سایت مملوء از کلمات نمی گردد. درحالی که همه ی این نوشته ها در نسخه ی دسکتاپ خوب به نظر میرسند، در نسخه موبایل داستان فرق میکند. نوشته ها میتوانند کاملا یک صفحه را مخفی و غیرقابل خواندن کنند و یا همه ی عناصر تبدیل (مثل نشان اعتماد و یا دکمه های فراخوان) را به صفحات پایین تر منتقل کنند.
نکته ی دیگری که باید در نظر داشت ذات اسکرول کردن در دستگاه موبایل است. یک کاربر دسکتاپ میتواند تمامی اطلاعات و تصاویر مورد نیاز خود را در یک نظر در صفحه مشاهده کند. درحالی که کاربران دسکتاپ به ندرت اقدام به اسکرول کردن میکنند، کاربر موبایل دائما درحال اسکرول کردن برای یافتن مطالب بیشتر است. این قضیه میبایست بر روی نوشتن سرفصل های سایت و نحوه ی اسکرول شدن آن تاثیر گذارد. نوشته ها باید کوتاه و مختصر و همچنین برای خواننده ارزشمند باشند.

۵- دکمه های فراخوان (CTA) را بازطراحی و آنها را واضح تر کنید.
یک سایت موبایل باید یک هدف اصلی داشته باشد که دکمه فراخوان (CTA)از آن پشتیبانی کند. این دکمه باید اولین عنصری باشد که یک بازدید کننده ی موبایل توجهش به آن جلب میشود و باید به سرعت به او بفهماند که کار آن دکمه چیست. برای مثال سایت Udemy که یک سایت آموزش آنلاین است یک دکمه ی فراخوان بسیار واضح را در بالای صفحه ی اصلی نسخه ی موبایلی خود قرار داده است که کاملا با هدف شرکت هماهنگ است. آنها میدانند که بازدید کننده برای یادگیری به سایت آمده است پس به او کمک میکنند که این هدف را به سرعت تحقق بخشد، آنها یک دکمه برای پیدا کردن دوره ی مورد نظر و یک نوار جستجو برای مشخص تر شدن دستیابی برای کاربر مهیا کرده اند.

طراحی یکپارچه انجام دهید

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

.
منبع : کاسپید

ممکن است بپسندید بیشتر از نویسنده

ارسال یک پاسخ

Connect with:



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

last.today