جاسازی فرم در سایت: iframe یا لینک؟

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

تیم پرسینو۶ مهر ۱۴۰۵۲ دقیقه خواندنRead this article in English

سه راه برای گذاشتن فرم در سایتتان هست و هرکدام جای خودش را دارد.

۱. لینک ساده

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

مناسب برای: فرم‌های بلند، آزمون، هر چیزی که تمرکز می‌خواهد.

۲. iframe جاسازی‌شده

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

مناسب برای: فرم تماس، ثبت‌نام خبرنامه، فرم‌های کوتاه.

مشکل اصلی: ارتفاع

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

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

مشکل دوم: کوکی شخص ثالث

مرورگرهای جدید کوکی شخص ثالث را محدود می‌کنند. اگر فرم برای ذخیره‌ی پیش‌نویس یا ضداسپم به کوکی تکیه کند، ممکن است داخل iframe کار نکند.

۳. پنجره‌ی بازشو (modal)

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

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

نکته‌های مشترک

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

سئو: محتوای iframe مال شما نیست

این نکته را دست‌کم نگیرید: گوگل محتوای داخل iframe را به صفحه‌ی میزبان نسبت نمی‌دهد. اگر انتظار دارید صفحه‌ی «تماس با ما» به‌خاطر فرمش رتبه بگیرد، اشتباه می‌کنید. متن معنادار باید در خود صفحه باشد، نه فقط داخل فرم.

برچسب‌ها:جاسازیiframeوردپرس