زمانی که صفحات خود را inspect میکنید اگر خطایی مرتبط با نمایش در موبایل باشد به شما نشان میدهد. با توجه به همه گیر شدن دستگاه های تلفن همراه نمایش صحیح سایت در تلفن های هوشمند و تبلت از دسکتاپ نیز مهمتر است. همواره اطمینان حاصل کنید که وب سایت به صورت آسان و سریع در دستگاه های تلفن قابل دسترسی است. خطاهای mobile usability در سرچ کنسول به شما کمک خواهد کرد
در این گزارش شما میتوانید تعداد صفحات موبایل فرندلی و غیر آن را مشاهده کنید.
ارورهای بخش mobile usability
خطای Clickable Elements Too Close Together
این خطا نشان میدهد که المان های کلیکی مانند لینک ها و دکمه ها ، آیکون ها نزدیک به هم هستند و کاربر نمیتواند به راحتی بر روی آن ها کلیک کند تا وارد صفحات دیگر شود.
رفع خطا :
به المان هایی که قابل کلیک هستند margin و padding بیشتری بدهید تا فضای کافی در موبایل را داشته باشند.
خطای viewport not set
Viewport یک متاتگ است که مشخص میکند چگونه اندازه صفحه را متناسب با اندازه صفحه نمایش تنظیم کنیم. این تگ مشخص میکند که صفحه در چه مقیاسی باشد تا در دستگاه های با اندازه متفاوت مناسب باشد. این تگ در هدر صفحه قرار دارد که اگر این خطا را دیدید به این معنی است که این تگ وجود ندارد.
رفع خطا :
بنابراین تگ را با ویژگی های زیر در هدر صفحه قرار دهید.
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>سعی کنید که از عرض بزرگ با اندازه ثابت استفاده نکنید زیرا مقیاس بندی آن در موبایل سخت خواهد بود. اگر سایت شما وردپرسی است به احتمال زیاد این خطا را نخواهید دید.
برای تنظیم میتوانید به فایل header.php مراجعه کرده و در صورت وجود نداشتن این تگ ، تگ بالا را اضافه کنید. البته بسته به نوع قالب وردپرس میتواند در فایل دیگر باشد.
خطای content wider than screen
این گزارش صفحاتی را نشان میده که برای دیدن متن و تصاویر باید اسکرول افقی کنید زیرا محتوای قرار گرفته شده از قالب صفحه بزرگتر شده است.
رفع خطا :
توجه کنید که صفحات از عرض relative به جای عرض absolute برای css استفاده کنند.
برای مثال تمامی تصاویر max-width: 100% داشته باشند به جای 1000px
div.fullWidth { width: 100%; }
خطای Text too small to read
این خطا زمانی به وجود می آید که سایز فونت نوشته ها بسیار کم باشد. گوگل اعلام کرده است که از اندازه فونت زیر 12px استفاده نکنید. البته بهتر است که حداقل از سایز 15 استفاده کنید. زیرا اندازه فونت کوچک کاربارن را مجبور به زوم کردن میکند. میتوانید از اندازه فونت relative مانند em و rem استفاده کنید.
خطای incomplete plugin
این خطا زمانی است که صفحه شما شامل پلاگینی است که از تکنولوژی flash یا Silverlight استفاده میکند. اگر از این پلاگین هایی استفاده میکنید که با کروم و سایر مرورگرها خوانایی داشته باشد.
آخرین مقالات مرتبط
