گزارش های بخش Mobile usability و نمایش خطاهای نسخه موبایلی سایت در گوگل وبمستر

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

اهمیت نسخه موبایلی سایت ها

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

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

گزارش ها ارائه شده در بخش Mobile Usability در گوگل وبمستر

در بخش Mobile Usability از گوگل وبمستر صفحاتی از سایت که هنگام نمایش در دستگاه‌های موبایل دارای اشکال و اختلال می باشند گزارش می شود.

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

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

انواع خطاهای گزارش شده در بخش Mobile Usability از گوگل وبمستر

در گزارش های بخش Mobile usability لیست خطاهای متداولی که نمایش داده می شود شامل موارد زیر است:

استفاده از فایل های فلش : Flash usage

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

عدم به کارگیری برچسب viewport در صفحات سایت: Viewport not configured

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

نمایش صفحات سایت در اندازه های ثابت : Fixed-width viewport

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

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

عدم تطابق سایز محتویات سایت با عرض دید در صفحات نمایش : Content not sized to viewport

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

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

استفاده از فونت های کوچک : Small font size

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

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

عناصر قابل کلیک نزدیک به هم : Touch elements too close

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

به کارگیری واسط هایی برای شیفت به نسخه های موبایلی سایت :  Interstitial usage

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

درصورتی که می خواهید یک اپلیکیشن موبایل را در سایت خود معرفی کنید بهتر است از بنرهای مخصوص گوشی های ios (iOS Smart Banners) یا بنرهای مخصوص اپلیکشن ها برای نمایش در مرورگر کروم (Chrome Native App Banners) یا از روش معرفی اپلیکشن به ربات گوگل جهت فهرست مستقیم در نتایج گوگل (App Indexing) استفاده کنید تا که یک دکمه نصب برای اپلیکشن مربوطه به صورت مستقیم در نتایج جستجو گوگل نمایش داده شود.