تست سایت در مرورگرهای مختلف؛ راهنمای کامل و رایگان

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

توی این آموزش، اول مرورگر کاربران رو با Google Analytics 4 یا همون GA4 پیدا می‌کنیم. GA4 نسخه فعلی سرویس آمارگیری گوگل هست و گزارش مرورگر، سیستم‌عامل و نوع دستگاه کاربران رو نشون می‌ده. بعد سراغ یک روش کاملاً رایگان برای تست سایت در مرورگرهای مختلف می‌ریم. خود وردپرس هم امکان پیش‌نمایش دسکتاپ، تبلت و موبایل رو داره؛ ولی این قابلیت فقط برای بررسی سریع چیدمان مفیده و جای تست با مرورگر و دستگاه واقعی رو نمی‌گیره.

چطور مرورگر کاربران سایت رو پیدا کنیم

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

اگه Google Analytics 4 از قبل روی سایتتون راه‌اندازی شده، می‌تونید گزارش مرورگرها رو بدون نصب ابزار تازه‌ای ببینید. این سرویس اطلاعاتی مثل مرورگر، سیستم‌عامل و نوع دستگاه کاربران رو در گزارش‌های بخش Tech نشون می‌ده. یادتون نره که دسترسی به سرویس‌های گوگل ممکنه برای بعضی کاربران یا موقعیت‌ها محدود باشه.

دیدن مرورگر کاربران در Google Analytics 4

اول وارد ویژگی یا Property مربوط به سایتتون در Google Analytics 4 بشید. Property همون فضای جداگانه‌ایه که اطلاعات سایت شما داخل اون جمع می‌شه. گزارش‌ها وقتی اطلاعات مفیدی نشون می‌دن که GA4 از قبل روی سایت فعال بوده باشه و تعدادی بازدید واقعی ثبت شده باشه.

برای دیدن مرورگر کاربران، از منوی سمت چپ وارد Reports بشید. بعد Tech رو باز کنید و روی Tech details بزنید. توی جدول گزارش، بُعد اصلی رو روی Browser بذارید. بُعد یا Dimension یعنی ویژگی‌ای که اطلاعات بر اساس اون دسته‌بندی می‌شن؛ اینجا هم بازدیدها بر اساس نام مرورگر جدا می‌شن. حالا می‌تونید مرورگرهایی مثل Chrome، Safari، Edge و Firefox رو جدا از هم بررسی کنید.

اگه گزارش Tech details رو توی منو نمی‌بینید، ممکنه این گزارش در مجموعه گزارش‌های شما منتشر نشده باشه. کاربری که دسترسی Editor یا Administrator داره می‌تونه از بخش Library گزارش رو به مجموعه گزارش‌ها اضافه و منتشر کنه. اگه جدول خالیه، اول مطمئن بشید کد رهگیری GA4 درست نصب شده و سایت بازدید ثبت‌شده داره.

بازه زمانی رو روی مدتی بذارید که آمار کافی داشته باشه؛ مثلاً ۲۸ یا ۹۰ روز گذشته. فقط تعداد بازدیدها رو بررسی نکنید. رفتار کاربران و مسیرهای مهم سایت هم سرنخ می‌دن که آیا کاربران یک مرورگر خاص بیشتر با مشکل روبه‌رو می‌شن یا نه. البته اختلاف بین این عددها به‌تنهایی چیزی رو ثابت نمی‌کنه و باید موضوع رو با تست عملی بررسی کنید.

از آمار مرورگرها چه برداشتی داشته باشیم

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

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

Internet Explorer دیگه مرورگر معمولی برای تست سایت‌های عمومی نیست. پشتیبانی برنامه Internet Explorer 11 روی بعضی نسخه‌های رایج ویندوز ۱۰ در ۱۵ ژوئن ۲۰۲۲ تموم شده و مایکروسافت استفاده از Microsoft Edge رو پیشنهاد می‌کنه. IE mode در اج بیشتر برای سامانه‌های قدیمی سازمانی به کار می‌ره. پس فقط وقتی اون رو آزمایش کنید که مشتری سازمانی شما مشخصاً چنین نیازی داشته باشه.

تست رایگان سایت در مرورگرهای مختلف

برای شروع تست لازم نیست افزونه‌ای نصب کنید یا پولی بپردازید. نسخه‌های فعلی گوگل کروم، فایرفاکس و مایکروسافت اج رایگان هستن. سافاری هم همراه دستگاه‌های اپل ارائه می‌شه. بهتره مرورگرهایی رو نصب کنید که طبق گزارش Google Analytics 4، بیشتر کاربران سایتتون از اون‌ها استفاده می‌کنن.

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

اندازه پنجره رو توی هر مرورگر چند بار کم‌وزیاد کنید. بعد ابزار توسعه‌دهنده مرورگر رو باز کنید و حالت نمایش موبایل رو فعال کنید. در کروم و اج معمولاً با زدن کلید F12 و انتخاب Toggle device toolbar به این بخش می‌رسید. فایرفاکس هم بخشی به نام Responsive Design Mode برای همین کار داره. این ابزارها اندازه صفحه و بعضی ویژگی‌های دستگاه رو شبیه‌سازی می‌کنن، ولی دقیقاً مثل یک آیفون، آیپد یا گوشی اندرویدی واقعی رفتار نمی‌کنن.

برای اینکه خیالتون راحت‌تر بشه، سایت رو دست‌کم روی یک گوشی واقعی هم باز کنید. اگه Google Analytics 4 نشون می‌ده تعداد کاربران iPhone یا Safari بالاست، تست روی یکی از دستگاه‌های اپل رو در اولویت بذارید. تغییر نام مرورگر یا اندازه صفحه نمی‌تونه رفتار واقعی موتور مرورگر Safari رو شبیه‌سازی کنه.

پیش‌نمایش موبایل و تبلت در وردپرس

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

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

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

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

رفع مشکلاتی که فقط در یک مرورگر دیده می‌شن

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

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

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

سؤالات متداول

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

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