غالبًا ما تكون طريقة الدفع هي الخطوة الأخيرة قبل إكمال عملية الشراء. لتحقيق الحد الأقصى من الإحالات الناجحة، يُرجى التأكد من أن طريقة الدفع سهلة الاستخدام وآمنة.
التأكد من أن المستخدمين يعرفون ما يجب ملؤه
اجعل طريقة الدفع بسيطة قدر الإمكان، مع عرض الحقول المطلوبة فقط
حدِّد مبلغ الدفعة. ويكون زرّ إرسال مثاليًا لإجراء ذلك.
<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 ]+" للسماح للمستخدمين بإضافة مسافات عند إدخال رقم بطاقة،
لأن هذه هي طريقة عرض الأرقام على البطاقات المطبوعة.