قابل رسائی ویب فارم کیسے بنائیں

Sep 13, 2025
کيسے

فارم ویب کا ایک لازمی جزو ہیں کیونکہ وہ صارفین کو آپ کے کاروبار سے منسلک کرتے ہیں اور ان کی مدد کرتے ہیں کہ وہ آپ کی سائٹ یا اپلی کیشن کے لئے کیا آئے ہیں. یہ کہا جا رہا ہے، آپ اس بات کو یقینی بنانا چاہتے ہیں کہ آپ کے تمام صارفین کو آپ کے فارموں کو بغیر کسی خوفناک تجربے کا سامنا کرنا پڑتا ہے. مقصد یہ ہے کہ یہ کلیدی صارف کی بات چیت ممکن ہو سکے کے طور پر frictionless کے طور پر.

اگرچہ یہ سچ ہے کہ عمارت کی شکلیں اوقات میں ایک مشکل کام ہوسکتی ہیں، انہیں اعتدال پسند قابل رسائی بنانے کے طور پر پیچیدہ نہیں ہے جیسا کہ آپ سوچتے ہیں (ایک اچھا ویب سائٹ بلڈر یہ سپر آسان بنائے گا). اکثر اس طرح کے ارد گرد پھینک دیا جاتا ہے جیسے 'ہمارے پاس رسائی کے بارے میں فکر کرنے کا وقت نہیں ہے' یا 'ہم اسے بعد میں قابل رسائی بنائے گا'. یہ عذر اکثر (اگر ہمیشہ نہیں) غلط ہیں اور آپ اپنی ٹیم کو اس ذہنیت کو تبدیل کرنے میں مدد کرسکتے ہیں.

مزید مشورہ تلاش کر رہے ہیں؟ ہم نے آپ کو موضوعات پر خطوط کے ساتھ احاطہ کیا ہے ویب میزبانی کرنے کے لئے کلاؤڈ اسٹوریج .

  • صارف کی جانچ سافٹ ویئر کے 13 بہترین ٹکڑے ٹکڑے

یہاں کچھ سوالات ہیں جب آپ فارموں کی تعمیر کرتے وقت پر غور کریں:

  • بصری معذوری کے ساتھ کسی کو کیا مشکلات میرے فارم کا استعمال کر رہی ہے؟
  • کیا صارف کو ان پٹ کے لئے کیا اعداد و شمار کی توقع کی واضح اشارہ ہے؟
  • کیا فارم استعمال کرنا آسان ہے - کیا صارفین کو جلدی سمجھنے کے قابل ہو جائے گا؟
  • کیا میں فارم کو مکمل کرنے کے لئے کی بورڈ کا استعمال کرنے میں کامیاب ہوں؟

بنیادی سبسکرائب فارم کیسے بنائیں

میں نے آپ کو آگے بڑھنے میں مدد کرنے کے لئے آپ کو کچھ سٹارٹر کوڈ دیا ہے. ہم اس کے ساتھ شروع اور آخر میں یہ حاصل کرو .

میں نے آپ کو کچھ بنیادی اسٹائل اور عناصر فراہم کی ہے جو ایک سادہ سبسکرائب فارم بنائے گی لیکن اس میں بہت کچھ ہے کہ ہم اس فارم کو زیادہ قابل استعمال بنانے کے لئے یہاں کر سکتے ہیں. آپ کو تخلیق کردہ کسی بھی چیز کے ساتھ، اچھا سیمنٹیکل ایچ ٹی ایم ایل کا استعمال کرتے ہوئے آپ کو ایک طویل راستہ ملے گا.

چلو سے منسلک کرکے شروع کریں & lt؛ ان پٹ اور جی ٹی؛ ان کے متعلقہ عناصر & lt؛ لیبل اور جی ٹی؛ ایس. ہم ایسا کرتے ہیں & lt؛ ان پٹ اور جی ٹی؛ ایک ID اور اس کا استعمال کرتے ہوئے اس کے لئے خاصیت کے لئے & lt؛ لیبل اور جی ٹی؛ . ہم ان کے لئے "نام" اور "ای میل" استعمال کرسکتے ہیں اور ہم نے پہلے سے ہی دو چیزیں کئے ہیں:

  1. ہم نے لیبل کو ان پٹ میں پروگرام سے منسلک کیا ہے. اس کا فائدہ یہ ہے کہ یہ لیبل سکرین ریڈر صارف کو پڑھا جائے گا اگر یہ ان پٹ توجہ مرکوز ہے.
  2. صارف اب لیبل پر کلک کر سکتے ہیں اور متعلقہ ان پٹ پر توجہ مرکوز کیا جائے گا، لہذا صارفین اب ایک بڑا ہدف کا سائز ہے.

اب کہ ہمارے آدانوں اور لیبلز تمام وائرڈ ہیں، ہم ایچ ٹی ایم ایل ان پٹ کی اقسام کی وضاحت کرسکتے ہیں. یہ واقعی مفید اور بہترین صارف کا تجربہ دینے کے لئے ایک آسان طریقہ ہے. شامل کرنا قسم خصوصیت صارف کو خود کو آپ کے فارم کو بھرنے میں مدد کرے گی اور موبائل صارفین کے لئے زیادہ مناسب کی بورڈ بھی فراہم کرے گی. ہمارے استعمال کے کیس کے لئے ہم کر سکتے ہیں قسم = "متن" نام ان پٹ اور کے لئے قسم = "ای میل" ای میل ان پٹ کے لئے.

ہم یہ بھی چاہتے ہیں کہ ہمارے صارفین کو اس قسم کے اعداد و شمار (اور اس کی فارمیٹنگ) کا ایک اچھا خیال ہے جو ہم ان سے توقع رکھتے ہیں. یہاں یہ بہت واضح ہے لیکن یہ ہمیشہ کیس نہیں ہے. یہ ایک لیبل فراہم کرنے کے لئے یہ عام طور پر اچھی مشق ہے جو ہمیشہ قابل ذکر اور ایک جگہ دار ہے جو متوقع ان پٹ سے بات کرتا ہے. اس کا مطلب یہ نہیں ہے جگہ دار ان پٹ کے لئے ایک بصری لیبل کے طور پر خصوصیت جہاں صارف ٹائپنگ شروع ہوتا ہے ایک بار جب لیبل قابل ذکر نہیں ہے. یہ بہت سے ڈویلپرز کے لئے ایک مقبول عمل ہے اور واقعی ایک بار اور سب کے لئے بستر پر ڈالنے کی ضرورت ہے. ہم نام کے لئے "سابق جین ڈے" کے لئے "سابق جین ڈے" کا ایک جگہ دار دے سکتے ہیں. ای میل کے لئے.

اب ہم توجہ مرکوز پر کام کر سکتے ہیں حالت اسٹائل. توجہ مرکوز ریاستوں کے پہلے سے طے شدہ اسٹائل براؤزرز کے درمیان مختلف ہیں اور ہم اس سے زیادہ صارف دوستانہ بنانے کے لۓ جو کچھ بھی ڈیفالٹ اسٹائل کو بہتر بنا سکتے ہیں. ہمارے معاملے میں، ہم چاہتے ہیں کہ آدانوں کو موٹی، رنگ کے نقطہ نظر کو بٹن کے ساتھ ملتا ہے.

  • آپ کی ویب سائٹ زیادہ قابل رسائی بنانے کے لئے آسان طریقوں

ان پٹ منتخب کرنے کے لئے توجہ مرکوز شیلیوں کو شامل کریں

آخر میں، ہمیں بٹن عنصر کے ارد گرد کچھ توجہ مرکوز شیلیوں کو شامل کرنے کی ضرورت ہے. یہ اکثر نظر انداز ہوتا ہے لیکن واقعی میں کی بورڈ صرف صارفین کو معلوم ہے کہ وہ کہاں ہیں. ہمیں یہ شامل کرنے کی ضرورت ہے & amp؛ :: moz-focus-innner. فائر فاکس میں کچھ ڈیفالٹ اسٹائل سے چھٹکارا حاصل کرنے کے لئے بٹ (آپ شاید مستقبل کے استعمال کے لئے اس ٹکڑا کو بچانے کے لئے چاہتے ہیں).

اس طرح، ہمارے پاس بنیادی سبسکرائب فارم ہے جس پر آپ فخر کر سکتے ہیں اور بہتر بنا سکتے ہیں. کیونکہ ہم نے اچھے سیمانکس استعمال کیے ہیں، یہ فارم صرف کی بورڈ کے ذریعہ قابل رسائی ہے (ٹیب اور اسپیس بار کا استعمال کرنے کی کوشش کریں / چابیاں درج کریں). بٹن کے لئے استعمال کردہ رنگ 11.51 کا رنگ تناسب ہیں، WCAG (ویب مواد تک رسائی کے ہدایات) کے لئے اے اے اے کے معیارات سے ملاقات کرتے ہیں. ہم نے بصری صارفین اور اسکرین ریڈر صارفین کے ساتھ ساتھ اپنی کی بورڈ کے استعمال کے لئے اسٹائل شدہ توجہ مرکوز دونوں کے لئے لیبل فراہم کیے ہیں. آخر میں، یاد رکھیں کہ فونٹ سیٹ کیا گیا ہے 18px. جسم میں. اس سے ہماری شکل بہت زیادہ پڑھنے کے قابل بناتی ہے (آپ کو 14px سے اوپر رہنے کی کوشش کرنی چاہئے).

دماغ میں رسائی کے ساتھ ڈیزائن اور عمارت کی مشق ہوتی ہے لیکن آپ اس کے لئے ایک بہتر ڈویلپر ہوں گے اور ویب کو بہتر جگہ بنانے میں مدد ملے گی.

generate, the award winning conference for web designers, returns to NYC on April 24-25! Click the image to book a ticket 

پیدا، ویب ڈیزائنرز کے لئے ایوارڈ جیتنے والی کانفرنس، 24-25 اپریل کو NYC پر واپس آتی ہے! ایک ٹکٹ بک کرنے کے لئے تصویر پر کلک کریں

یہ مضمون اصل میں مسئلہ 316 میں شائع کیا گیا تھا نیٹ ویب ڈیزائنرز اور ڈویلپرز کے لئے دنیا کی بہترین فروخت میگزین. مسئلہ 316 خریدیں یا یہاں سبسکرائب کریں .

متعلقہ مضامین:

  • اس مفت آلے کے ساتھ رسائی کو حل کرنے میں ناکام ہے
  • 2019 میں ڈویلپرز کے لئے 50 بہت اچھے نئے اوزار
  • آپ کے ڈیزائن کتنی قابل رسائی ہیں؟

کيسے - انتہائی مشہور مضامین

آرٹ میں پیش کرنے کے لئے لازمی گائیڈ

کيسے Sep 13, 2025

(تصویری کریڈٹ: روب لنن) اگر آپ سوچ رہے ہو کہ آرٹ میں کیا فورا لگ رہ�..


MO.JS لائبریری کے ساتھ متحرک کیسے کریں

کيسے Sep 13, 2025

(تصویری کریڈٹ: Pexels / فرینک Kagumba) mo.js ایک منفرد موشن گرافکس جاوا اسک�..


زبرش میں انسانی ناک کو کس طرح مجسمہ: 4 آسان مراحل

کيسے Sep 13, 2025

انسانی نرسوں میں تمام سائز اور سائز میں آتے ہیں. تاہم، یہ ضروری ہے کہ ان�..


فوٹوشاپ میں پس منظر کو کیسے ہٹا دیں

کيسے Sep 13, 2025

صفحہ 1 کا 4: جادو چھڑی کا آلہ جادو چھڑی کا آلہ فوری انتخاب �..


کس طرح ایک Papercraft روبوٹ بنانے کے لئے

کيسے Sep 13, 2025

گزشتہ موسم گرما میں صرف گریجویشن کرنے کے بعد، میں اب بھی آزادانہ مثال ک�..


سی ایس ایس کے سائز کے ساتھ حیرت انگیز اثرات کیسے بنائیں

کيسے Sep 13, 2025

فرنٹ اینڈ ڈویلپرز آئتاکاروں میں سوچتے ہیں؛ آئتاکاروں کے اندر آئتاکارو�..


کس طرح ایک اضافی حقیقت حقیقت مارکر کوڈ کوڈ

کيسے Sep 13, 2025

صفحہ 1 کا 2: صفحہ 1 صفحہ 1 ..


InDesign کے ساتھ مخلوط سیاہی بنائیں

کيسے Sep 13, 2025

صفحہ 1 کا 2: ایک مخلوط سیاہی سوئچ بنائیں ا�..


اقسام