نکاتی برای کارایی بیشتر در طراحی وب سایت موبایل

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

در مورد وضوح صفحه نمایشگر تصمیم گیری کنید

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

صفحات وب رو به بخشهای کوچک تقسیم کنید

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

طراحی رو ساده کنید

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

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

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

محل قرارگیری مسیریابی

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

از لینکهای نوشتاری استفاده کنید

میتونید برای وب سایتتون از فهرستهای fly-out ، rollover یا سایر مدلهای فانتزی استفاده کنید، ولی برای موبایل نه. یادتون باشه که عناصر صفحه دینامیک و لینکهای گرافیکی از منابع استفاده میکنند، بنابراین حتما با لینک نوشتاری اونها رو برچسب دار کنید.

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

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

بین لینکها تعادل بوجود بیارید

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

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

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

پاپ-آپ و رفرش ممنوع

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

جمع بندی

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