اصول طراحی وب سایت برای موبایل

طراحی سایت نسخه موبایل، بر روی سئو سایت و بهینه سازی سایت ها تاثیر مستقیم و بسیار زیادی دارد. در مباحث سئو گذشته، درباره اهمیت سئو در طراحی سایت صحبت کردیم.

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

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

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

سوالاتی که در رابطه با طراحی وب سایت برای موبایل پاسخ خواهیم داد:

1- چگونه وب سایتمان را برای موبایل بهینه کنیم؟
2- اصول سئو کردن وب سایت برای موبایل چگونه است؟
3- بهترین روشهایی که میتوانیم وب سایتی را برای گوشی های موبایل بهینه کنیم چیست؟

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

1. Homepage و Navigation:

صفحه اصلی می تواند یک فضای تبلیغاتی باشد که به کاربر خوش آمد می گوید. اما باید به کاربران محتوایی که به دنبالش هستند را هم نمایش دهد. صفحه اصلی که بر روی تبدیل کاربر به مشتری تمرکز دارد باید این موارد را رعایت کند: دکمه های فراخوان یا CTAهای دقیق، کلید میانبر یا Shortcut صفحه اصلی، استفاده حداقلی از تبلیغات و مکانیزم های فروش.

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

دکمه های فراخوان یا Call To Action شما هم می توانند کاربر را به مشتری تبدیل کنند و هم می توانند Bounce rate صفحات شما را افزایش دهند. برای طراحی دکمه های فراخوانی که کاربر را به مشتری تبدیل می کند، نوشته ها و طراحی این دکمه ها را بهینه کنید. برای مثال در انتخاب کلمات، رنگ ها، اندازه دکمه، فونت و غیره دقت کنید. یادتان باشد که انتخاب رنگ سایت بسیاااااار مهم است.

تا به حال گم شدن در راه یا یک فروشگاه بزرگ را تجربه کرده اید؟ مسئله ای مشابه می تواند زمانی اتفاق بیفتد که در سایت های موبایلی، منوهای navigation یا location bar وجود نداشته باشند. کاربران موبایلی انتظار دارند با یک لمس کوتاه به صفحه اصلی بازگردند. حالا یا با لمس لوگوی شما یا با کلیک بر روی منوی Navigation. برای آنکه نتیجه بهتری بگیرید، از لوگوی خود به عنوان Shortcut صفحه اصلی استفاده کنید.

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

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

با پاسخ به این سوالات، قرار گرفتن تبلیغات در homepage مشکلی ایجاد نکرده و به تجربه کاربری لطمه ای وارد نمی کند.

2. تجارت و نظرات کاربران:

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

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

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

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

یکی از بهترین کارهایی که می شود برای سایت موبایلی تجارت الکترونیک انجام داد، ایجاد چند روش برای پرداخت می باشد. در دسترس بودن روش هایی مانند Apple pay، PayPal و Android Pay می تواند نرخ تبدیل ها را بالا برده و استرس کاربران برای وارد کردن اطلاعات کارت اعتباری را کاهش دهد. برای کاربرانی که از این سرویس ها استفاده نمیکنند، می توانید فیلدهای داده را به صورت پیش فرض ذخیره کرده و بارگذاری کنید و به این ترتیب به کاربران برای تکمیل فرآیند خرید کمک نمایید.

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

3. کاربردی بودن سایت:

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

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

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

مواظب باشید که برچسب لینک سایت دسکتاپی را full site یا سایت کامل نزنید. این مسئله باعث می شود بازدیدکنندگان گیج شده و فکر کنند سایت موبایلی شما کامل نیست و بخواهند به سایت کامل یا همان سایت دسکتاپی بروند. تنها کافی است که برچسب لینک را “desktop site” بزنید و عنوان سایت موبایلی را “mobile site” بگذارید.

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

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

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

منابع زیادی وجود دارند که فرم هایی با قابلیت استفاده از تقویم و دیگر تنظیمات را ارائه می دهند. برای مثال می توانید از Google forms، Zamarin Forms و FormHub استفاده کنید.