زمانه عوض شده است و تقریبا دیگر همه طراحان سایت دارند نسخه های موبایلی را در اولویت قرار می دهند. تعجبی هم ندارد، بیش از 50 درصد کاربران دنیای وب، کاربران موبایل هستند و تعجبی هم ندارد که طراحی سایت برای موبایل مورد توجه قرار بگیرد و متد mobile first در طراحی سایت مطرح شود. حال قرار است این متد را در این مقاله مورد نقد و بررسی قرار بدهیم و ببینیم که به چه مواردی اشاره می کند. مسلما از نام آن پیداست که قرار است بیشتر از همه درباره نسخه موبایلی سایت ها صحبت کنیم و خیلی اشاره چندانی به دیگر دستگاه ها نخواهیم داشت. در این مقاله قرار است بررسی کنیم و ببینیم طراحی Mobile First در طراحی سایت چیست؟ چگونه بحث آن به میان آمد؟د چرا انقدر حساسیت آن بالاست؟ و در آخر در رابطه با آن چه کاری انجام دهیم؟
میخوای بعدا بخونی ؟
دانلــــــود PDF
فهرست
C
متد mobile first در طراحی سایت
C
طراحی mobile first چیست؟
C
بحث mobile first در طراحی سایت چگونه به میان آمد؟
C
چگونه متد mobile first در طراحی سایت را اجرا کنیم؟
C
چه کار هایی باید در زمینه mobile first در طراحی سایت انجام دهیم؟
متد mobile first در طراحی سایت
استفاده گسترده کاربران از موبایل باعث شد که متد mobile first در طراحی سایت مطرح بشود. این متد در واقع می خواهد برنامه نویسان و توسعه دهندگان را مجاب کند که به طراحی نسخه موبایلی سایتی که طراحی می کنند بیشتر توجه کنند. به هر حال اگر این کار انجام نشود و نسخه موبایلی سایت ها کیفیت خوبی نداشته باشد، احتمال زیاد شما حداقل پنجاه درصد از مخاطبان خودتان را از دست می دهید. تصور کنید که خیلی ها هستند که اصلا لپ تاپ و کامپیوتر ندارند، اما همه دیگر یک اسمارت فون همراه خودشان دارند که با آن در گوگل جست و جو می کنند و سایت ها را پیدا می کنند. گوگل هم مسلما سایتی را به آن ها نشان می دهد که نسخه موبایلی عالی ای داشته باشد. چرا که خود گوگل اصلا این موضوع را اولین بار مطرح کرد.
گوگل در سال 2010 برای اولین بار “روش mobile first در طراحی سایت” را با توجه به همه گیر شدن گوشی های هوشمند مطرح کرد. گوگل از همان زمان پیش بینی کرده بود که مخاطبان موبایلی دنیای وب قرار است خیلی بیشتر از مخاطبان دسکتاپ شود و در حال حاضر هم می بینیم که حرف گوگل درست از آب در آمده است. پس اول از همه ما باید با این روش آشنا بشویم و بعد هم به سراغ اجرای آن برویم.
طراحی mobile first چیست؟
رویکرد mobile first در طراحی سایت ، رویکردی است که در آن طراحان سایت باید اول از همه طراحی نسخه موبایلی سایت را انجام بدهند و سپس به سراغ دیگر دستگاه ها بروند. این متد mobile first در طراحی سایت با اسکچ کردن یا همان نمونه اولیه سازی طراحی وب اپ برای کوچک ترین تصاویر انجام می شود و سپس به سراغ تصاویر بزرگ تر می رود. همانطور هم که می دانید این اولویت بندی منطقی به نظر می رسد به این دلیل که محدودیت های زیادی برای طراحی سایت برای صفحه نمایش های کوچکتر مانند موبایل وجود دارد که تیم طراحی سایت باید مطمئن شوند که المان هی کلیدی در این صفحات هم به خوبی نمایش داده می شوند و هم عملکرد آن ها صحیح است.
طراحی و توسعه برای صفحه نمایش های کوچک، طراحان را وادار می کند که موارد غیر ضروری سایت را که برای رندر وبسایت و ناوبری آن فایده ای ندارند حذف کنند.
بحث mobile first در طراحی سایت چگونه به میان آمد؟
قدیم تر ها زمانی که می خواستند یک سایت را توسعه بدهند، اول از همه نسخه دسکتاپ آن را در نظر می گرفتند.(قدیم تر از آن هم برویم در واقع “فقط” نسخه دسکتاپ مد نظر بود) اما بعد ها که متد mobile first در طراحی سایت مطرح شد موضوع کمی فرق کرد. دیگر یکسری کارکرد های سایت حذف شدند که برای نسخه موبایلی آن بهینه باشند. البته که این موضوع نکته منفی داشت که باعث شد خیلی از المان ها با نسخه موبایلی مطابقت پیدا نکنند و توسعه دهندگان باید از خیر آن ها می گذشتند. به همین خاطر بحث طراحی mobile first مطرح شد. این متد اولین بار توسط Luke Wroblewski در سال 2010 مطرح شد که تلاش آن این بود که توسعه دهندگان را تشویق کند که اول از همه طراحی موبایل را در اولویت قرار بدهند.
چگونه متد mobile first در طراحی سایت را اجرا کنیم؟
حال می خواهیم بدانیم که متد mobile first در طراحی سایت چگونه قرار است که اجرا بشود. بیایید تصور کنیم که یک طراح سایت می خواهد برای یک رستوران سایتی طراحی کند. اگر قرار باشد که از رویکرد mobile first در طراحی سایت استفاده کند باید به این فکر کند که کاربران از نسخه موبایلی سایت یک رستوران چه انتظاری دارند.
طراحان باید خودشان را اول از همه جای مخاطب بگذارند و از دید آن ها صفحه موبایل را نگاه کنند. احتمال زیاد مخاطبی که به سایت رستوران آمده است دنبال اطلاعاتی مانند ساعت های خدمات رسانی، لوکیشن دقیق رستوران، راه های ارتباطی و موارد سریع این چنینی است که می خواهد به سرعت در اختیارش قرار بگیرد. پس طراحی سایت شما باید به گونه ای باشد که این اطلاعات به طور خلاصه و مناسب با صفحه گوشی در سایت گنجانده شود. به احتمال زیاد هم باید دقیقا آن ها را در صفحه اصلی قرار داد تا مخاطب به محض ورود به سایت آن ها را ببیند و تصمیم نگیرد که به رستوران دیگری برود.
حال اگر بخواهیم به سراغ طراحی برای تبلت برویم می بینیم که طراح سایت جای بیشتری برای مانور دادن دارد. پس می تواند کارکرد های دیگری را هم به این نسخه اضافه بکند. مثلا به علاوه موارد گفته شده برای نسخه موبایلی می تواند در یک تصویر کوچک منوی غذا، اطلاعات آشپز و… را هم قرار بدهد.
بعد از آن که به سراغ نسخه دسکتاپ می رویم دیگر دست طراح کاملا باز است که به علاوه این موارد، پست های بلاگ، عکس های محیط رستوران و دیگر اطلاعات را نیز در صفحه اضافه کند.
با اجرای دستورالعمل بالا، مخاطبان همه دستگاه ها راضی و خشنود از طراحی سایت این رستوران خواهند بود.
زمانه عوض شده است و تقریبا دیگر همه طراحان سایت دارند نسخه های موبایلی را در اولویت قرار می دهند. تعجبی هم ندارد، بیش از 50 درصد کاربران دنیای وب، کاربران موبایل هستند و تعجبی هم ندارد که طراحی سایت برای موبایل مورد توجه قرار بگیرد و متد mobile first در طراحی سایت مطرح شود. حال قرار است این متد را در این مقاله مورد نقد و بررسی قرار بدهیم و ببینیم که به چه مواردی اشاره می کند. مسلما از نام آن پیداست که قرار است بیشتر از همه درباره نسخه موبایلی سایت ها صحبت کنیم و خیلی اشاره چندانی به دیگر دستگاه ها نخواهیم داشت. در این مقاله قرار است بررسی کنیم و ببینیم طراحی Mobile First چیست؟ چگونه بحث آن به میان آمد؟ چرا انقدر حساسیت آن بالاست؟ و در آخر در رابطه با آن چه کاری انجام دهیم؟
چه کار هایی باید در زمینه mobile first در طراحی سایت انجام دهیم؟
برای موثر تر کردن متد mobile first در طراحی سایت ، طراحان سایت باید به این موارد که می خواهیم بگوییم بیش از پیش توجه کنند.
1-اولویت قرار دادن محتوا
وقتی حرف از روش mobile first در طراحی سایت می شود، طراحان سایت باید این موضوع را در ذهن خود داشته باشند که محتوا کلید اصلی است. با توجه به محدودیت صفحه های کوچک موبایل، طراحان سایت باید از این موضوع اطمینان حاصل کنند که المان های حساس و ضروری سایت باید به بهترین نحو ممکن در این تصاویر کوچک موبایل نمایش داده شوند. به این دلیل که مخاطب اصلا به دنبال همین محتواها داخل سایت آمده است و دنبال آن ها می گردد. اجرای این محتوا ها باید به بهترین نحو ممکن انجام بشود.
2-فراهم آوری ناوبری قابل دسترس
یک ناوبری مناسب در متد mobile first در طراحی سایت می تواند تجربه کاربری عالی و تمیزی را برای مخاطب در تحربه نسخه موبایلی سایت به ارمغان بیاورد. طراحان سایت می توانند از منو های ناوبری یا همان نویگیشن مناسب استفاده کنند که بهترین آن ها منو همبرگری است(همان منویی که در سایت به صورت سه خطی شبیه به همبرگر وجود دارد) که به عنوان دومین المان مهم سایت بعد از محتوا محسوب می شود. این نوار ناوبری به مخاطب کمک می کند که به راحتی اطلاعاتی را که می خواهد از سایت دریافت کند.
3-از پاپ آپ های مزاحم پرهیز کنید
هیچ چیز در طراحی سایت برای مخاطبان آزار دهنده تر از پاپ آپ هایی نیستش که یا سوال های بیهوده می پرسند، از مخاطب کال تو اکشن بدون شناخت می خواهند و موارد آزار دهنده دیگر که احتمالا در سایت ها دیده اید. همانطور که قبلا هم گفته شد صفحات موبایل چندان بزرگ نیستند که کاربران بخواهند در آن ها تبلیغات و پاپ هایی که به دنبال آن نیستند را ببینند. پس لطفا روی موارد مهم و چیزی که مخاطب می خواهد تمرکز کنید و به جد به طراحان سایت و صاحبان سایت پیشنهاد می کنیم که این موارد را برای نسخه های دسکتاپ نگه دارند. مطمئن باشید این پاپ آپ ها و تبلیغات به جز ریزش مخاطب برای شما هیچ چیز دیگری حداقل تو نسخه موبایلی سایت ندارند.
4-سایتتان را در دستگاه های واقعی تست کنید
بهترین راه برای اینکه مطمئن شوید متد mobile first در طراحی سایت به خوبی اجرا شده است این است که از طریق دستگاه های واقعی مختلف موبایل آن را تست کنید. این موضوع کمک می کند که ببینید آیا المان های سایت به درستی بر روی همه موبایل ها اجرا می شوند یا خیر. البته فقط این را در موبایل تست نکنید، سایت شما باید برای تمامی دستگاه ها بهترین عملکرد خودش را داشته باشد.
کلام آخر
همانطور که بار ها هم به شما گفتیم مخاطبان نسخه های موبایلی سایت ها دارند از مخاطبان دیگر نسخه های آن بسیار بیشتر می شوند. در حال حاضر 50 درصد از مخاطبان را شامل می شوند و احتمالا در آینده این درصد بیشتر از این ها هم خواهد شد. پس متد mobile first در طراحی سایت را باید جدی بگیرید و از آن استفاده کنید. حواستان به این موضوع هم باشد که نسخه موبایلی سایت شما اهمیتش برای گوگل از نسخه دسکتاپ بیشتر است و مسلما این موضوع را در رتبه بندی سایت شما دخالت خواهد داد و اگر نسخه موبایلی خوبی برای سایتتان در نظر گرفته باشید، احتمالا گوگل هم از شما راضی خواهد بود و رتبه خوبی به شما خواهد داد، در نتیجه مخاطب شما بیشتر از قبل هم خواهد شد. ممنون که در این مقاله با ما همراه بودید.
منبع:
Browserstack