طراحی منو سایت برای موبایل
توسط حمیدرضا عباسی
افراد و کاربران وب سایت ها تمایل دارند تا به صورت آنلاین، اطلاعات مورد نظر خود را جستجو کنند. گوگل به افراد نوید می دهد که در سال ۲۰۱۳، افراد بیشتر از این که از این که از لپ تاپ یا desktop برای جستجوی مطالب خود استفاده کنند، به سمت دستگاه های موبایل رو می آورند.
نه تنها استفاده از رسانه ها در دنیای وب تغییر کرده، بلکه استفاده افراد از تلفن های هوشمند نیز، روز به روز در حال افزایش است و این مسئله در دنیای تکنولوژی، چالش های زیادی را ایجاد کرده است.
کاربران وب سایت ها، از تلفن های هوشمند خود برای انجام یک سری کارهای خاص مثل چک کردن مقصد، جدول زمانی حمل و نقل های عمومی و تراز نامه های بانکی.افراد به راحتی میتوانند از طریق مرورگر های موبایل و کامپیوترهای خود در ها وب سایت، آن چه که بخواهند را پیدا کنند. مثلا به جای این که بیرون بروند و ساعت ها منتظر آمدن اتوبوس شوند، در خانه خود نشسته و خیلی راحت از طریق اینترنت، به اطلاعات مورد نظر خود دست می یابند.
در این مقاله از سلسله مقاله های طراحی سایت و بهینه سازی سایت و سئو وب سایت که در شرکت طراحی سایت وب شهر برای شما تهیه و تنظیم شده است قصد داریم تا شما را با این تکنیک ها و ترفندها آشنا نماییم تا در نهایت سایت های خود را برای موبایل ها و تبلت ها زیباتر و مدرن تر طراحی نمایید.
فضای صفحه نمایش ها در دستگاه های هوشمند ، محدود شده است. کاربران خیلی پرمشغله هستند. آن ها اغلب مجبورند تا چند کار را به صورت همزمان انجام دهند. درنتیجه باید برای رسیدن به هدف خود، فقط از یک انگشت برای جستجوی مطالب مورد نظر استفاده کنند.
به خاطر همین، جستجو در تلفن های هوشمند ، به نسبت سخت تر از وب سایت های قدیمی است. درک سوالات، نوع نیاز کاربران وب سایت، محدودیت دستگاه ها و ناامید شدن کاربران در فرآیند جستجو، همه بر روی طراحی منوهای جستجو در وب موبایل ها تاثیر می گذارند.
زمانی که کاربران موبایل آنلاین می باشند،آن ها چه سوالاتی را در وب سایت مطرح می کنند؟
تحقیقات برگرفته شده از Compuware ها در سال ۲۰۱۱ نشان داد که کاربران در تلفن های هوشمند خود، اطلاعات محلی را به صورت آنلاین در وب سایت ها جستجو می کنند. پس طراحان وب سایت باید در طراحی منوهای جستجو دقت زیادی به خرج دهند.چرا که کاربران وب سایت مطالب مورد نظر خود مثل مکان یابی یا اطلاعات تماس را در این منوهای وب سایت جستجو می کنند.
خودتان را جای کاربران وب سایت بگذارید. نگاهی به ترافیک موبایل ها بیاندازید. شما طراحان وب سایت باید ۳ تا ۴ طبقه بندی عالی را پیدا کنید و برای هرکدام ، اسمی را در نظر بگیرید. انتخاب این نام باید بر مبنای بیشترین جستجوهای انجام شده در وب سایت باشد.
اگر موبایل وب سایت برای تجارت آجر و سنگ طراحی شده است، پس بهتر است که دکمه ای برای مکان و اطلاعات تماس در نظر گرفته شود.
ما طراحان وب سایت همیشه لینک ” از وب سایت ما دیدن کنید” را به وب سایت خود اضافه کرده و طراحی وب موبایل خود را دقیقا در راستای آخرین ورژن موبایل ها انجام می دهیم تا کاربران خیلی راحت در خانه یا محیط کار بنشینند و اطلاعات مورد نظر خود را از طریق وب سایت ها به راحتی جستجو کنند.
طراحی برای محیط های مختلف
زمانی که طراحان وب سایت در حال طراحی منوهای جستجو در سایت های مبتنی برای موبایل و تبلت می باشند، باید علاوه بر در نظرگرفتن پارامترها و تاثیرات مربوط به محیط های بیرونی، خود دستگاه های موبایل را هم مورد ارزیابی قرار دهند.
طراحان وب سایت هم باید مثل معماران که دقیقا طراحی یک ساختمان را برای شهر، بیابان و یا جنگل در نظر نمی گیرند،(یک بعدی کار نمی کنند) باید یک سری فرصت ها و محدودیت های محیطی مربوط به دستگاه های موبایل را مدنظر قرار دهند تا بهترین منو را برای جستجوی کاربران وب طراحی کنند.
مشکل این جاست که طراحان وب دقیقا نمی دانند که کاربران از چه دستگاهی برای جستجوی اطلاعات خود استفاده می کنند. طراحان باید موبایل ها را به گونه ای طراحی کنند که استفاده از طراحی واکنشگرا مثل درخواست های رسانه CSS را برای پیدا کردن مکان ها و همچنین اندازه دستگاه و اندازه مطالب در آن ها را مد نظر قرار دهند. خواه طراحان بخواهند یک مارک تجاری در وب سایت ها ، البته با توجه به طراحی واکنشگرا طراحی کنند و یا وب سایتی را برای موبایل ها طراحی کنند، باید منوهای جستجوها را به بهترین نحو برای کاربران وب سایت طراحی کنند.
منوهای جستجو برای صفحه نمایش های کوچک
طراحان وب سایت باید بدانند که استفاده کاربران از دستگاه های هوشمند برای جستجوی مطالب در وب سایت، بسیار متفاوت تر از desktop یا لپ تاپ ها می باشد. طراحی منو برای این دستگاه های کوچک ، کار ظریف و حساسی است و طراحان وب سایت باید در طراحی منوها دقت کافی به خرج دهند.
بهترین کار اول : کم کردن تعداد دکمه های منو
طراحان وب سایت باید موبایلی را برای کاربران خود طراحی کنند که کاربر پسند باشد. آن ها باید بر خلاف desktop ها که لینک های زیادی دارند، تعداد دکمه های منوی جستجو را درطراحی وب موبایل ها به ۵ و یا کمتر برسانند و در صورت نیاز، منوهای اضافی را طراحی کنند.
بهترین کار دوم: کاهش تعداد tap ها
تا آن جایی که امکان دارد ، تعداد tap را در طراحی موبایل ها کاهش دهید. هرچه تعداد tap ها و کلیک کردن ها در موبایل ها کمتر باشد، کاربران به راحتی می توانند دنبال مطلب مورد نظر خود بگردند. شما طراحان وب سایت باید به این نکته توجه داشته باشید که تا آن جایی که امکان دارد ، تعداد اشتباهات طراحی خودتان را پایین بیاورید تا کاربران مجبور نشوند با استفاده از دکمه back به منوی قبلی برگردند. طراحی وب سایت شما باید کاربران را جذب کند ، نه این که آن ها را ناامید و خسته کند.
بهترین کار سوم: scroll کردن در منوی جستجو
طراحان وب سایت باید مهم ترین پارامترها را در قسمت بالای وب سایت قرار دهند. دستگاه های موبایل، هر یک اندازه های متفاوتی دارند.اگر طراحان از منو ها و لیست های زیادی در طراحی موبایل وب ها استفاده کنند ، پس کاربران وب سایت مجبور می شوند تا برای پیدا کردن مطلب مورد نظر خود، در این صفحه نمایش ای کوچک مرتبا scroll کنند.
بهترین کار چهارم : دکمه های که روی هم روی هم قرار می گیرند
کاربران ، وب سایت شما را همانند یک تابلوی نقاشی می بینند، نه یک منظره مثل desktop. شما باید منوهای جستجو را به صورت عمودی و نه افقی طراحی کنید. بهترین کار ممکنه برای طراحی وب موبایل ها این است که طراحان باید حداکثر از ۵ طبقه بندی برای طراحی منوهای وب سایت خود استفاده کنند. البته اگر آن ها به منوهای اضافی نیاز داشتند، می توانند تعداد طبقه بندی ها را زیاد کنند که البته خیلی بعید به نظر می رسد.
بهترین کار پنجم : منوهای تودرتو
منوهای تودرتو به عنوان منوی جستجوی تاشو شناخته شده که برای وب سایت هایی مناسب است که به منوهایی برای گذاشتن مطالب در وب سایت نیاز دارند و مجبورند تا طبقه بندی ها و آیتم های بیشتری را به منو جستجو اضافه کنند.
بهینه سازی منوهای جستجو موبایل ها برای دکمه ها و صفحات لمسی کوچک
طراحان موبایل وب ها باید در طراحی های خود به صفحات لمسی و دکمه های خیلی کوچک توجه کنند. الان دیگر کاربران وب سایت ها ، برای جستجوی خواسته های خود از ماوس های زیبا استفاده نمی کنند. آن ها از انگشتان خود کمک می گیرند و بر روی نقطه مورد نظر اشاره می کنند. البته دقت استفاده از انگشتان برای جستجوها به مراتب کمتر از کار با ماوس ها می باشد و در نتیجه اگر کاربران سریع نتوانند به هدف خود برسند، به شدت نا امید خواهند شد.
طراحان وب سایت ها باید برای طراحی وب سایت ها برای موبایل ها ، فضای بیشتری را در اطراف لینک منوها در نظر بگیرند و یا می توانند برای سهولت کار کاربران، لینک ها را با دکمه هایی برای طبقه بندی منوها عوض کنند.
زمانی که کاربران از فضاهای بزرگتر برای جستجوی مطالب خود استفاده کنند، پس سریع می توانند بر روی دکمه های کوچک کلیک کرده و با tap ها را با انگشتان خود لمس کنند. اندازه مناسب برای کاربری که انگشت متوسطی دارد، حداقل ۴۴ در ۴۴ پیکسل می باشد و در نتیجه دکمه ها و منوهای جستجو می توانند بقیه مطالب وب سایت را به وضوح نشان دهند. البته اگر هدف کاربران وب سایت، منوی آیتم ها باشد نه استفاده از صفحه اصلی.
برای طراحی استاندارد برای موبایل های لمسی، طراحان بهتر است که دکمه منوهای جستجو را در صورت نیازبزرگتر در نظر بگیرند.
نکاتی برای بهینه سازی وب سایت
- انتخاب منو در بالا یا پایین صفحه نمایش، به هدف کاربران وب سایت بستگی دارد. اگر آن ها به دنبال مطالب یا scroll می باشند، بهتر است که منو ها را در پایین صفحه نمایش طراحی کنیم تا کاربران وب سایت بتوانند از وب سایت شما استفاده بهینه را ببرند، نه اینکه دنبال وب سایتی دیگری برای رسیدن به اهداف خود بگردند.
- تا آنجایی که امکان دارد، برای جا دادن مطالب درصفحه نمایش وب سایت، منو ها را مخفی کنید و زمانی که کاربران بر روی آن ها tap می کنند، منوها را نشان دهید. شما طراحان وب سایت می توانید بدون پاک کردن محتوای مطالب، منوها را در قسمت جلو یا وسط وب سایت طراحی کنید.
- لینک منو را در بالای صفحه نمایش قرار دهید و دکمه جستجو را به وب سایت خود اضافه کنید.
- برای مدل های بسیار بزرگ ، از منوهای جستجو دراز و باریک، و برای موبایل ها ، از منوهای عریض و کوتاه استفاده کنید. این منوهای عریض و کوتاه به شما کاربران وب سایت کمک می کنند تا عناوین و مطالب را بهتر ببینید.
- طول سر فصل تصاویر را کم کرده و برای طراحی لوگوهای کوچکتر، آن ها را با هم ترکیب کنید تا فضای منوی جستجو بازتر شود.
- طراحی مارک های تجاری را مطابق با سبک، رنگ و نوع دکمه های جستجو انجام دهید. تاکید خود را برروی فضای تصاویر یا گرافیک ها قرار ندهید.
- متون را بالاخص در دکمه های منو و لیست عناوین، محدود کنید. در بعضی مواقع که متون خیلی پیچیده می باشند، از منوهای روی هم با فضای بیشتر انتخاب کنید تا بتوانید هر خط را به وضوح ببینید.
- تا آن جایی که امکان دارد، منوهای جستجو را خیلی ساده طراحی کنید. طراحان وب سایت حتی الامکان باید صفحات اصلی را پاک کرده و بیشتر بر روی آیتم هایی تاکید کنند که مورد نیاز کاربران می باشند.
توجه به منوهای جستجو
کاربران وب سایت، خیلی پرمشغله و حواس پرت هستند. آن ها تمایلی ندارند که دکمه های جستجو را تغییر دهند.این کاربران صرفا به جستجوهای خود در وب سایت ادامه داده و در آخر خسته می شوند و سایت را رها می کنند.
طراحان وب سایت ها نباید انتخاب های زیادی را در اختیار کاربران وب سایت قرار دهند
طراحی وب سایت نباید به صورت افقی باشد تا کاربران مجبور شوند که hover و scroll کنند. منوهای slider برای کاربران خسته کننده هستند. اگر شما طراحان قرار است که منوهای جستجو را طراحی کنید، باید خیلی ساده آنها را طراحی کرده تا کاربران از کار با آن ها خسته نشوند. طراحی خلاقانه منوهای جستجو، کار بسیار راحتی است. کاربران وب سایت باید به آسانی بتوانند منوها را ببینند و اطلاعات مورد نیاز خودشان را در وب سایت جستجو کنند.
نتیجه گیری
طراحی وب سایت ها برای موبایل ها ، مسئله بسیار جدیدی است و طراحان منوهای جستجوی را مطابق با دستگاه های محتلف طراحی می کنند.
اگر طراحی منوها برای کاربران خسته کننده باشد، آنها سریعا وب سایت را ترک می کنند و به وب سایت دیگر می روند.
اطلاعات مختلف و جستجوی اطلاعات در هر کاربری در وب سایت متفاوت است. حتی ممکن است یک کاربر وب سایت های مختلفی را با اهداف متفاوت جستجو کند. مثلا کاربر موبایل به دنبال وب سایت های جدید و سرفصل های خاص، برای موبایل خود می باشد. اطلاعات تماس برای او اهمیتی ندارند. حتی کاربر موبایل تمایل دارد تا از طریق جستجو در وب سایت، دندانپزشک با آرایشگر مورد نظر خود را پیدا کند.
حتی طراحی منوهای جستجو برای وب موبایل های قدیمی هم متفاوت است. اما هدف طراحی در هر دو روش یکی است. به این معنا که کاربران به محض بازدید از وب سایت شما، از خودشان می پرسند که فروشگاه کجاست؟ چه اتفاقی دارد در جهان می افتد؟ تراز حساب کاربری من در بانک به چه شکلی است؟ اگر طراحان ، منوهای جستجو را به صورت بهینه طراحی کنند، قطعا کاربران وب سایت خیلی سریع می توانند به پاسخ سولات خود برسند.
شما طراحان وب سایت باید به نیاز کاربران، افزایش ترافیک و بازدید مجدد آنها از وب سایت، رضایت کاربران و کارآیی وب موبایل ها برای تجارتی بهینه، توجه کنید.
حمیدرضا عباسی
حمیدرضا عباسی هستم، کارشناس نرم افزار و دانشجوی کارشناسی ارشد تجارت الکترونیک، طراح و توسعه دهنده وب سایت و متخخص سئو، از سال ۹۰ به صورت حرفه ای شروع به فعالیت در زمینه طراحی وب سایت کردم و بسیار علاقه مند و مشتاق به استفاده از تکنولوژی های جدید و بروز در زمینه طراحی وب سایت و تجارت الکترونیک هستم.
مطالب پیشنهادی
روش هایی جهت حفظ رتبه در موتورهای جستجو
25 مهر 1396