مهم‌ترین نکات را درباره طراحی نسخه موبایل سایت‌ در سال 2019 بدانید

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

• ترافیک وب‌سایت‌های واکنش‌گرا، به اندازه‌ی 15% از کل ترافیک اینترنت جهانی است.

• حدود 61 درصد از مردم، اگر تجربه‌ کاربری خوبی با نسخه موبایل یک فروشگاه اینترنتی یا وب‌سایت داشته باشند، نظر خوبی نسبت به آن خواهند داشت.

• حدود 60 درصد از خریداران، از گوشی هوشمندشان در داخل محل کار و 50% دیگر، از آن، در حین رفت‌و‌آمد به منزل یا محل کار استفاده می‌کنند.

• کاربرهای تبلت‌، 50% زمان بیشتری را در مقایسه با کاربران PC، در دنیای مجازی صرف می‌کنند.

• جستجوهای انجام شده توسط دستگاه‌های موبایل، تقریباً یک چهارم از کل جستجوهای اینترنتی را تشکیل می‌دهند.

• هر 100 میلی ثانیه تاخیر در زمان بارگذاری سایت، کاهش 1 درصدی مقدار فروش را در پی دارد.

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

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

در سال 2014، 350 میلیارد دلار بر روی تجارت الکترونیکِ تلفن‌همراه خرج شد و این عدد همچنان در‌ حال افزایش است. پیش‌بینی می‌شود که تا سال 2020، درآمد تجارت الکترونیک موبایل، به 625 میلیارد دلار برسد. علاوه بر این، در سال 2015، تجارت الکترونیک موبایل، به میزان 30% از کل تجارت‌های الکترونیک در آمریکا رسید.

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

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

بیشتر بخوانید: تبدیل صفحه اینستاگرام به وب‌سایت در 7 مرحله

 

طراحی سایت به روش First Mobile یا «ابتدا موبایل» به چه معنا است؟

طراحی معروف به روش «ابتدا موبایل»، به یک روند محبوب در طراحی UX (طراحی تجربه‌ی کاربری) و انجمن‌های توسعه‌دهنده‌گان وب‌سایت تبدیل شده‌ است.  حال لازم است بدانید که «ابتدا موبایل»، دقیقاً به چه معنا است؟ این موضوع، اولین بار در تابستان سال 2011، در رویدادی به نام هفته تکنولوژی یا TechWeek، در شیکاگو مطرح شد. در آنجا، یک سخنرانی در مورد طراحی UX موبایل توسط «جان بودا» صورت گرفت که به مخاطبان حاضر، نحوه‌ نوشتن کدهای مربوط به رفتار واکنش‌گرای سایت را آموزش می‌داد. با پیاده‌سازی کدهای جاوا اسکریپتِ واکنش‌گرا، می‌توان به وب‌سایت‌ها گفت که با هر دستگاهی منطبق و سازگار شوند. «ابتدا موبایل»، یک استراژی قدرتمند و روشی جدید برای نوشتن کدهای سایت است. قطعاً سؤال‌هایی در ذهن شما ایجاد شده است، از جمله: استراتژی «ابتدا موبایل» چیست؟ چرا روش «ابتدا موبایل» به سرعت در حال محبوب‌شدن است؟ جواب‌ این سؤالات را در ادامه خواهید خواند.

 

• طراحی به روش «ابتدا موبایل»، یک تغییر الگوی گسترده

بسیاری از شرکت‌ها، از مدتی قبل، شروع به استفاده از رویکرد «ابتدا موبایل» کرده‌اند. گوگل، اولین‌بار استراتژی «ابتدا موبایل» را در سال 2010 به کار برد و آن را معرفی کرد. همانطور که خودتان هم از نام آن حدس زده‌اید، روش «ابتدا موبایل»، به معنای طراحی نسخه موبایل وب‌سایت است که قبل از طراحی وب‌سایتِ مخصوص دسکتاپ، یا هر دستگاه دیگری، انجام شود. به بیان ساده‌تر، ابتدا برای موبایل طراحی شود. در گذشته، وقتی که تمرکز کاربران بر روی اینترنت دسکتاپ بود، طراحی مخصوص موبایل یک فکر ثانویه بود که اجرای آن بهتر از اجرا نکردن آن بود. اما امروزه، افرادِ بیشتری از دستگاه‌های موبایل خود برای خرید آنلاین و فعالیت در شبکه‌های اجتماعی استفاده می‌کنند و بسیاری از شرکت‌ها، سایت‌های مخصوص به موبایل را طراحی کرده‌اند. طراحی به روش «ابتدا موبایل»، نیازمند یک رویکرد جدید برای طرح‌ریزی، طراحی UX و توسعه است که باعث می‌شود تا دستگاه‌هایی مانند گوشی، تبلت و مشابه اینها، در خط اول طراحی استراتژی و پیاده‌سازیِ سایت باشند. به طور کلی، عرصه‌ی دیجیتال متحول شده‌است و شرکت‌ها به این پی برده‌اند که اکنون، کاربران با استفاده از دستگاه‌های موبایل‌شان، به محتوای بیشتری دسترسی پیدا می‌کنند.

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

 

• استراتژی دیجیتال و ارتباط آن با طراحی سایت به روش «ابتدا موبایل»

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

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

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

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

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

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

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

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

 

• نحوه‌ کار سایت‌هایی که به روش «ابتدا موبایل» طراحی می‌شوند، چگونه است؟

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

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

 

• تفاوت طراحی واکنش‌گرا و طراحی ابتدا موبایل در چیست؟

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

طراحی نسخه موبایل سایت، به کسب‌و‌کارها این امکان را می‌دهد که علاوه بر سایت فعلی خود، نسخه مخصوص موبایل داشته باشند. بسیاری از شرکت‌ها که از این فرمت استفاده می‌کنند، نام یکسانی را برای هر دوی این سایت‌ها انتخاب می‌کنند، ولی قبل از اسم دامنه، یک "m" به آدرس سایت اضافه می‌کنند.

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

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

بیشتر بخوانید: افزایش فروش سایت با چند ترفند ساده

 

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

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

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

ممکن است که این رتبه‌بندی‌ها در یک روز بدست نیایند، ولی کاربران شما، بلافاصله آنها را متوجه می‌شوند. هر‌چه باشد، تفاوت بزرگی در بین سایت‌هایی که در 10 ثانیه بارگذاری می‌شوند با سایت‌هایی که بلافاصله بارگذاری می‌شوند، وجود دارد.

یکی از قوی‌ترین روش‌ها برای کاهش زمان بارگذاری نسخه موبایل سایت شما، استفاده از صفحات موبایل شتاب داده شده (accelerated) یا همان AMP است. این مورد یک زبان کدگذاری ساده شده است که به خواندن، درک کردن و توصیه سریعِ وب‌سایت شما از طرف گوگل، کمک می‌کند. همچنین AMP، به صفحات کمک می‌کند تا بلافاصله بر روی دستگاه‌های موبایل، بارگذاری شوند.

 

بزرگ‌ترین قانون طراحی نسخه موبایل سایت: آن را ساده نگه دارید

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

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

البته این موارد باعث نمی‌شود که شما سایتی زشت داشته باشید. هنوز هم می‌توانید نسخه موبایل سایت‌تان را زیبا کنید . کدهای CSS3، به طراحان نسخه موبایل سایت، این اجازه را می‌دهند تا گرافیک‌های جذابی را با ویژگی‌هایی مانند موارد متحرک ایجاد کنند. این کد‌ها شما را قادر به داشتن یک موبایل‌‌وبِ جذاب می‌کنند. با در ذهن داشتن این نوع سادگی در زمینه‌ی طراحی سایت موبایل، می‌توانیم شروع به تفکر درباره‌ روش طراحی موبایل‌وب کنیم که دو رویکرد کلی برای آن وجود دارد و آن را در ادامه می خوانیم.

 

دو رویکرد برای ایجاد نسخه موبایل سایت

1. یک موبایل‌وبِ منحصر‌به‌فرد و جداگانه بسازید.

2. وب‌سایت موجود خود را به نحوی طراحی کنید که خود را برای اندازه دستگاه‌های مختلف تنظیم کند ( طراحی واکنش‌گرا ).

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

 

• رویکرد 1: یک دامنه‌ مخصوص وب‌سایت موبایل یا ایجاد یک وب‌سایت .Mobi

وب‌سایت‌های .Mobi، سایت‌هایی هستند که به‌طور ویژه برای دیده‌شدن در دستگاه‌های موبایل طراحی شده‌اند. از لحاظ فنی، هر دامنه‌ای را می‌توان بر روی دستگاه موبایل مشاهده کرد، ولی سایت‌های .Mobi قابلیت استفاده‌ی بالاتری دارند.

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

نکته: می‌توانید بدون ایجاد دامنه‌ی .mobi، یک وب‌سایت مخصوص موبایل ایجاد کنید. می‌توانید به راحتی یک زیر دامنه مانند “m.domain.com” ایجاد کنید تا وب‌موبایلِ خود را بر روی آن قرار دهید.

 

1- مزایای ایجاد یک وب‌سایت .Mobi

• به صورت خاص، برای خوب کارکردن بر روی صفحه نمایش‌های کوچکِ موبایل طراحی می‌شود.

• از حداقل میزان پهنای باند استفاده می‌شود که باعث بارگذاری سریع‌تر سایت‌ها می‌شود.

• ساده و سبک است.

• احتمال بالا آمدن آنها در جستجو با موبایل از سایت‌های .com بیشتر است.

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

 

2- معایب ایجاد یک وب‌سایت .Mobi

• دو سایت جداگانه برای نگهداری و مدیریت و صرف هزینه دارید (دامنه‌ی معمولی .com و دامنه‌ی موبایل .mobi)

• باید کارهای سئو و بهینه‌سازی دامنه .mobi را از ابتدا شروع کنید.

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

 

• رویکرد 2: همگام شدن با سایت اصلی یا طراحی وب‌سایت واکنش‌گرا

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

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

 

1- مزایای طراحی واکنش‌گرا

• وجود یک سایت برای دستگاه‌های مختلف، به جای مدیریت چند سایت برای دستگاه‌های مختلف.

• تم‌های بسیاری برای طراحی وب‌سایت واکنش‌گرا در وردپرس به‌طور رایگان و یا با هزینه بسیار پائین، وجود دارند.

• طراحی وب‌سایت به روش واکنش‌گرا، روش توصیه شده توسط گوگل برای طراحی نسخه موبایل سایت است.

 

2- معایب طراحی واکنش‌گرا

• سایت‌هایی که طراحی وب‌سایت موبایل واکنش‌گرا دارند، ممکن است بارگذاری کندتری از سایت‌های .mobi داشته باشند.

• تبلیغات موجود در سایت، معمولاً در هنگام تنظیم مجدد صفحه نمایشگر، دچار مشکل می‌شوند.

• معماری اطلاعات و قابلیت کارکرد سایت، ممکن است دچار ایراداتی شود.

 

در نهایت:

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

بیشتر بخوانید: 24 ترفند‌ جدید برای کسب درآمد از اینترنت

 

کدام روش برای شما مناسب‌تر است؟

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

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

 

وب‌سایت‌های ریسپانسیو، در مقایسه با برنامه‌های کاربردی (اپلیکیشن‌ها)

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

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

 

1- مزایای استفاده از اپلیکیشن

• از آنجایی که کدِ شما مخصوص یک پلتفرم نوشته می‌شود، احتمال عملکرد بهترِ آن، وجود دارد.

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

• برنامه‌ها می‌توانند از کارکردهای دستگاه‌های موبایل استفاده کنند، مانند دوربین‌ها یا شتاب‌سنج‌های ساخته شده در موبایل‌ها

 

2- معایب استفاده از اپلیکیشن

• توسعه و مدیریت آن، گران است.

• کاربر باید کارهای بیشتری را انجام دهد تا بتواند با سایت تعامل داشته باشد ( باید اپ‌استورِ برنامه‌ مخصوص به پلتفرم را دانلود کند، خود برنامه را دانلود کند و یا برنامه را ارتقا دهد)

• باید برای تبلیغ اپلیکیشن در اپ‌استورها، هزینه‌هایی پرداخت شود.

                         

چه کسب‌و‌کارهایی از داشتن اپلیکیشن‌ها سود می‌برند؟

کسب‌و‌کارهایی که بیش از همه از برنامه‌های کاربردی سود می‌برند، آن‌هایی هستند که نیاز به تحویل محتوای خاصی دارند. مانند کسب‌و‌کارهایی که می‌خواهند برای عضوهای خود از طریق برنامه‌های خاص، ویدئو‌های HD پخش کنند (مانند Netflix، HBO GO، Hulu plus و غیره). همچنین این برنامه‌ها، برای کاربردهای ویژه هم عالی هستند، مانند برنامه‌ای که به کاربران کمک می‌کند تا نزدیک‌ترین رستوران به خود را پیدا کنند.

 

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

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

• به نحوه‌ قراردادن محتوای خود فکر کنید: مشخص کنید که محتواهای شما چگونه در سایت قرار می‌گیرند. آیا ترتیب خودشان را در تبدیل از دسکتاپ به موبایل، مجدداً تنظیم می‌کنند؟

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

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

• نشانگرهای بصری را از یاد نبرید: در‌حالیکه بسیاری از مرورگرهای دسکتاپ، دارای نشانگرهای پیشروی ساخته شده به صورت درونی مانند نشانه‌های بارگذاری هستند، این موارد چندان در مرورگرهای موبایل رایج نمی‌باشند. بهتر است که بازخورد (feedback) بصری مخصوص خودتان را، به عنوان بخشی از طراحی موبایل، ارائه دهید. وقتی که یک کاربر، یک دکمه را تپ می‌کند، کاری کنید که آن دکمه، تغییر ظاهر دهد تا نشان دهید که عمل تپ بر روی آن دکمه انجام شده‌است. همچنین آیکون‌های چرخنده را برای نشان دادن بارگذاری سایت امتحان کنید.

• طراحی را بر‌روی دستگاه‌های زیادی آزمایش کنید: تست‌های بسیار زیادی انجام دهید. ابزارهای آزمایشی و برابرسازهای زیادی وجود دارند که به شما کمک می‌کنند تا ببینید که سایت‌تان بر روی دستگاه‌های مختلف، به چه شکل دیده می‌شود.

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

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

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

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

 

عوامل موفقیت وب‌سایت‌های دارای نسخه موبایل

• امکان لمس مناسب تمام صفحات: آیا کاربران می‌توانند همه‌ لینک‌های موجود در سایت شما را به سادگی و راحتی تپ کنند؟

• اسکرول کردن به صورت عمودی: آیا افراد می‌توانند از انگشت شست خود برای خواندن تمام محتوای صفحه‌ استفاده کنند؟

• گرافیک‌های اضافی: آیا می‌توانید عکس‌ها یا ویدئوهای اضافی را حذف کنید؟

• فیلدهای بزرگ در فرم‌ها: آیا کاربران می‌توانند با انگشت‌ شست خود فیلد‌ها را تپ و انتخاب کنند؟

• درخواست حداقل اطلاعات مورد‌نیاز در فرم‌ها: آیا واقعاً به همه‌ مواردی که در فرم درخواست کرده‌اید، نیاز دارید؟

• کدنویسی مدرن: آیا از زبان HTML5 استفاده می‌کنید؟

 

چگونه می‌توانید نسخه‌ی موبایل وب‌سایت خود را مشاهده و بررسی کنید؟

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

 

چگونه نسخه موبایل وب‌سایت خود را آزمایش کنید؟

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

• MobiReady: یک ابزار آزمایش، که میزان بهینه بودن سایت شما را برای دستگاه‌های موبایل، با در نظر گرفتن بهترین شیوه‌ها و استانداردها، آزمایش می‌کند. شما از 1 تا 5 امتیاز می‌گیرد و یک تجزیه و تحلیل کامل را از سایت خود دریافت می‌کنید.

• The Responsinator: یک ابزار رایگان برای آزمایش طراحی واکنش‌گرای سایت شما، در بین دستگاه‌های موبایل محبوب

• GoMoMeer: این ابزار از شرکت گوگل، نشان می‌دهد که سایت شما در یک گوشی هوشمند، به چه شکل دیده می‌شود و یک گزارش رایگان با توصیه‌های شخصی‌سازی شده به شما درباره‌ بهینه‌سازی بهتر سایت‌تان ارائه می‌دهد.

• Screenfly: این ابزار، به شما اجازه می‌دهد تا وب‌سایت خود را بر‌روی دستگاه‌های متنوعی مشاهده کنید. فقط کافی است تا آدرس سایت خود را بنویسید.

• Mobile Phone Emaluator: یک برابرساز موبایل محبوب. این ابزار به شما اجازه می‌دهد تا سایت خود را بر‌روی تعداد زیادی از دستگاه‌های موبایل، آزمایش کنید.

• iPad Peek: این ابزار، همانطور که از نامش مشخص است، به شما اجازه می‌دهد تا نحوه‌ دیده‌شدن سایت خود را بر‌روی دستگاه‌های آیپد یا آیفون مشاهده کنید.

بیشتر بخوانید: راهنمای کامل چگونگی راه‌اندازی فروشگاه اینترنتی

 

نتیجه‌گیری

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

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

مشاهده نسخه pdf مقاله: مهم‌ترین نکات را درباره طراحی نسخه موبایل سایت‌ در سال 2019 بدانید