بازگشت به وبلاگ

چگونه وب‌سایت خود را برای موبایل بهینه کنیم: راهنمای بدون کد برای کسب‌وکارهای محلی

webceke

چگونه وب‌سایت خود را برای موبایل بهینه کنیم: راهنمای بدون کد برای کسب‌وکارهای محلی

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

چرا سایت‌های دسکتاپ‌محور روی گوشی خراب می‌شوند

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

  • نقاط لمسی کوچک. دکمه‌ها، لینک‌ها و شماره تلفن‌هایی که برای نشانگر ماوس اندازه‌گیری شده‌اند، با انگشت شست قابل لمس نیستند. گوگل حداقل اندازه ۴۸ پیکسل را برای نقاط لمسی توصیه می‌کند، اما بسیاری از منوهای دسکتاپ لینک‌ها را در ردیف‌های ۲۰ پیکسلی فشرده می‌کنند.
  • اسکرول افقی. چیدمان‌های با عرض ثابت کاربران را مجبور می‌کند برای خواندن یک جمله، صفحه را با دو انگشت بزرگ و به پهلو بکشند. هیچ چیز سریع‌تر از این اولین برداشت را خراب نمی‌کند.
  • منوهای ناخوانا. یک نوار ناوبری با هشت آیتم اصلی و منوهای کشویی تودرتو، روی صفحه ۳۷۵ پیکسلی به یک آشفتگی تنگ و همپوشان تبدیل می‌شود.
  • بارگذاری کند موبایل. تصاویر بهینه‌شده برای دسکتاپ، اسکریپت‌های بی‌استفاده و فونت‌های مسدودکننده رندر می‌توانند بارگذاری سه ثانیه‌ای را روی اتصال 4G به ده ثانیه تبدیل کنند — و بیشتر کاربران موبایل بعد از سه ثانیه صفحه را ترک می‌کنند.

هر یک از این مشکلات یک نشت تبدیل است. بازدیدکننده‌ای که نمی‌تواند دکمه «همین حالا تماس بگیر» شما را لمس کند، به دنبال آن نخواهد گشت.

گام ۱: تست سازگاری با موبایل گوگل را اجرا کنید

قبل از هر تغییری، یک نقطه شروع به دست آورید. تست سازگاری با موبایل گوگل و PageSpeed Insights هر دو به صورت رایگان و فوری وضعیت سایت شما را روی گوشی نشان می‌دهند.

  1. آدرس صفحه اصلی خود را در تست سازگاری با موبایل وارد کنید.
  2. گزارش را برای تنظیمات viewport، اندازه نقاط لمسی و عرض محتوا بررسی کنید.
  3. PageSpeed Insights را باز کنید و به تب موبایل بروید تا امتیاز بارگذاری واقعی خود را ببینید.
  4. سه «فرصت» اصلی را یادداشت کنید — معمولاً فشرده‌سازی تصویر، جاوااسکریپت بی‌استفاده و بارگذاری فونت.

این‌ها را بنویسید. آن‌ها را به ترتیب تأثیرشان برطرف می‌کنید، نه به ترتیبی که گوگل فهرست کرده است.

گام ۲: چهار مشکل اصلی را در یک سازنده وب‌سایت هوش مصنوعی برطرف کنید

خبر خوب این است که چهار مشکل رایج موبایل ساختاری هستند، نه ظاهری. نیازی به نوشتن کد ندارید — به سازنده‌ای نیاز دارید که موبایل را به عنوان پیش‌فرض در نظر بگیرد، نه یک فکر بعدی. با webceke، کسب‌وکار خود را در یک جمله توصیف می‌کنید و این ابزار یک سایت چندزبانه و چندصفحه‌ای با چیدمان موبایل‌محور از پیش آماده تولید می‌کند.

در ادامه نحوه رسیدگی به هر مشکل آمده است:

  • نقاط لمسی: در ویرایشگر، هر دکمه یا لینک را انتخاب کنید و حداقل ارتفاع را ۴۸ پیکسل تنظیم کنید. لینک‌های مجاور را با حداقل ۸ پیکسل فاصله پر کنید.
  • اسکرول افقی: مطمئن شوید تگ متای viewport شما width=device-width, initial-scale=1 است. سپس بررسی کنید که هیچ تصویر یا جدولی عرض پیکسلی ثابت بیشتر از ۳۶۰ پیکسل نداشته باشد.
  • منوها: ناوبری خود را در صفحه‌های زیر ۷۶۸ پیکسل به یک منوی همبرگری تبدیل کنید. آیتم‌های اصلی را به پنج یا کمتر محدود کنید.
  • سرعت بارگذاری: تصاویر اصلی را به زیر ۲۰۰ کیلوبایت فشرده کنید، بارگذاری تنبل را فعال کنید و هر فونت یا اسکریپتی را که فعالانه استفاده نمی‌کنید حذف کنید.

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

گام ۳: قبل از راه‌اندازی روی دستگاه‌های واقعی تست کنید

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

  • سایت خود را روی یک آیفون و یک گوشی اندروید باز کنید — اگر لازم است از کسی قرض بگیرید.
  • سعی کنید هر دکمه را با یک دست و بدون بزرگ‌نمایی لمس کنید.
  • گوشی را به حالت افقی بچرخانید و بررسی کنید که چیزی خراب نشود.
  • با تغییر به 3G در تنظیمات شبکه گوشی، روی اتصال کند تست کنید.
  • از یک دوست یا عضو خانواده بخواهید شماره تلفن شما را در کمتر از ده ثانیه پیدا کند.

اگر نتوانستند، کار بیشتری برای انجام دادن دارید.

مزایای یک سایت موبایل‌محور

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

آماده‌اید بازسازی را رد کنید؟ کسب‌وکار خود را در یک جمله در webceke توصیف کنید و در چند دقیقه یک سایت آماده موبایل و چندزبانه دریافت کنید — سپس آن را از تست گوگل عبور دهید تا مطمئن شوید قبول می‌شود.

Keep reading