فرم پرداخت اغلب آخرین مرحله قبل از تکمیل خرید است. برای به حداکثر رساندن تبدیل، مطمئن شوید که فرم پرداخت شما کاربرپسند و ایمن است.
اطمینان حاصل کنید که کاربران می دانند چه چیزی را باید پر کنند
فرم پرداخت خود را تا حد امکان ساده نگه دارید و فقط فیلدهای الزامی را نشان دهد.
مبلغ پرداختی را ذکر کنید. دکمه ارسال برای آن ایده آل است.
<button>Pay $300.00</button>
از عبارات خود توضیحی برای عناصر <label> خود استفاده کنید. به عنوان مثال، به جای نام اختصاری مانند «CVV» که فقط توسط برخی مارک ها استفاده می شود، از «کد امنیتی» استفاده کنید.
به کاربران کمک کنید جزئیات پرداخت خود را وارد کنند
برای به حداکثر رساندن تبدیل، اطمینان حاصل کنید که کاربران می توانند فرم پرداخت شما را در سریع ترین زمان ممکن پر کنند.
از inputmode="numeric" برای فیلدهای شماره کارت و کد امنیتی استفاده کنید تا یک صفحه کلید روی صفحه نمایش بهینه شده برای وارد کردن اعداد نشان داده شود.
مقادیر autocomplete مناسب را برای کنترل‌های فرم پرداخت خود اضافه کنید تا مطمئن شوید مرورگرها تکمیل خودکار را ارائه می‌دهند. از autocomplete="cc-name" برای نام، autocomplete="cc-number" برای شماره کارت و autocomplete="cc-exp" برای تاریخ انقضا استفاده کنید.
اطمینان حاصل کنید که کاربران داده ها را در قالب صحیح وارد می کنند
از ویژگی required برای هر <input> استفاده کنید تا مطمئن شوید که کاربران فرم کامل را پر می کنند.
کدهای امنیتی کارت پرداخت می تواند سه یا چهار رقمی باشد. از minlength="3" و maxlength="4" استفاده کنید تا فقط سه و چهار رقم را مجاز کنید.
اطمینان حاصل کنید که کاربران فقط شماره کارت و کد امنیتی را وارد می کنند. از pattern="[0-9 ]+" استفاده کنید تا به کاربران اجازه دهید هنگام وارد کردن شماره کارت، فاصله‌ها را درج کنند، زیرا اعداد در کارت‌های فیزیکی به این شکل نمایش داده می‌شوند.