تست ریسپانسیو سایت بر اساس ۳ مشخصه اصلی گوگل

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

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

چرا گوگل روی ریسپانسیو حساس است؟

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

خب حالا بریم سراغ اصل ماجرا. گوگل تو مستنداتش می‌گه اگه می‌خواید سایتتون ریسپانسیو باشه، سه تا مشخصه‌ی اصلی رو باید رعایت کنید. یکی‌یکی می‌ریم جلو.

مشخصه اول: عرض صفحات نباید از عرض موبایل بیشتر باشه

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

از کجا بفهمیم صفحه‌مون درسته؟

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

چرا اسکرول افقی انقدر بده؟

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

مشخصه دوم: سایز متن‌ها

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

سایز فونت مناسب برای موبایل چقدره؟

قانون کلیش اینه: از ۱۶ پیکسل به بالا برید، متنتون نرمال حساب می‌شه و از نظر ریسپانسیو گوگل هیچ مشکلی ندارید. حداقلش هم که بخواید برید، نباید از ۱۴ پیکسل پایین‌تر بیاید. یه بازه‌ی امن، همین ۱۴ تا ۱۶ پیکسل به بالاست.

یادتونه یه زمانی سایت‌ها پر بودن از متن‌های ۱۲ و ۱۳ پیکسلی؟ اون دوران تموم شده. الان دیگه استفاده از فونت‌های ریز نه‌تنها به چشم نمیاد، بلکه مستقیم روی ریسپانسیو بودن سایتتون اثر منفی می‌ذاره. پس اگه هنوز جایی از سایتتون متن ریز دارید، وقتشه بروزش کنید.

مشخصه سوم: چسبیده نبودن لینک‌ها و دکمه‌ها

مورد سوم هم به‌ظاهر کوچیکه ولی خیلی مهمه. لینک‌ها و دکمه‌های سایتتون نباید انقدر بهم نزدیک باشن که کاربر موقع تاچ کردن، اشتباهی رو یکی دیگه بزنه.

مشکل لینک‌های چسبیده چیست؟

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

گوگل این قضیه را چطور متوجه می‌شود؟

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

یه توصیه‌: از قالب و پلاگین درست استفاده کنید

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

چطور سایت را تست کنیم؟

حالا که همه‌ی این‌ها رو گفتیم، شاید بگید خب من از کجا بفهمم سایت خودم اوکیه یا نه؟ کارش خیلی ساده‌ست. کافیه برید تو گوگل و عبارت Google Mobile Friendly Test رو سرچ کنید. این سرویس مال خود گوگله و بهتون اجازه می‌ده سایتتونو از نظر ریسپانسیو بررسی کنید. آدرس سایتتونو می‌دید، تست می‌کنه و بهتون گزارش می‌ده. اگه توی نتیجه خطایی دیدید، یعنی یه جای کار سایتتون هنوز با موبایل جور نیست و باید درستش کنید.

جمع‌بندی

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

تیم تولید محتوا

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