Holy grail (web design)
ہولی گریل ایک ویب پیج کی ترتیب ہے جس میں متعدد مساوی اونچائی والے کالم ہوتے ہیں جن کی وضاحت اسٹائل شیٹس کے ساتھ کی جاتی ہے۔ یہ عام طور پر مطلوب اور نافذ کیا جاتا ہے، لیکن کئی سالوں تک، مختلف طریقوں سے جس میں اسے دستیاب ٹیکنالوجی کے ساتھ نافذ کیا جا سکتا تھا، ان سب میں خامیاں تھیں۔ اس کی وجہ سے، ایک بہترین عمل درآمد تلاش کرنے کا موازنہ مبہم ہولی گریل کی تلاش سے کیا گیا۔ سی ایس ایس اور ایچ ٹی ایم ایل کی حدود، بامعنی طور پر بامعنی صفحات کی خواہش جو سرچ انجنوں میں اچھی درجہ بندی کرتے ہیں، اور مختلف براؤزرز کی خامیاں تاریخی طور پر مل کر ایسی صورتحال پیدا کرتی ہیں جس میں اس قسم کی ترتیب بنانے کا کوئی طریقہ نہیں تھا جسے مکمل طور پر درست سمجھا جائے۔ چونکہ بنیادی ٹیکنالوجیز نے مناسب حل فراہم نہیں کیا، ویب ڈیزائنرز نے حدود کے ارد گرد کام کرنے کے مختلف طریقے تلاش کیے۔ عام حل میں صفحہ کے ڈھانچے میں تبدیلیاں، گرافکس کا اضافہ، اسکرپٹنگ، اور سی ایس ایس کا تخلیقی استعمال شامل تھے۔ یہ طریقے نامکمل، تکلیف دہ تھے، اور کچھ لوگ انہیں ویب کے معیارات اور ان کے ارادے کا غلط استعمال سمجھتے تھے۔ مزید حالیہ ویب معیارات نے اس ترتیب کو نافذ کرنے کے لیے بہت زیادہ مکمل اور مضبوط حل فراہم کیے ہیں۔ خاص طور پر، سی ایس ایس لچکدار باکس لے آؤٹ اور سی ایس ایس گرڈ لے آؤٹ ماڈیولز دونوں نے مکمل حل فراہم کیے ہیں۔ مسئلہ بہت سے ویب صفحات کو متعدد (اکثر تین) کالموں کے ساتھ ایک ترتیب کی ضرورت ہوتی ہے، جس میں مرکزی صفحہ کا مواد ایک کالم (اکثر مرکز) میں ہوتا ہے، اور اضافی مواد جیسے مینو اور دوسرے کالموں (سائڈبار) میں اشتہارات ہوتے ہیں۔ ان کالموں کو عام طور پر علیحدہ پس منظر کی ضرورت ہوتی ہے، ان کے درمیان سرحدوں کے ساتھ، اور ایک ہی اونچائی پر ظاہر ہونا چاہئے اس سے کوئی فرق نہیں پڑتا ہے کہ کس کالم میں سب سے اونچا مواد ہے۔ ایک عام ضرورت یہ ہے کہ سائڈبار کی ایک مقررہ چوڑائی ہو، جس میں مرکزی کالم ونڈو (سیال یا مائع ترتیب) کو بھرنے کے لیے سائز میں ایڈجسٹ ہوتا ہے۔ ایک اور عام ضرورت یہ ہے کہ، جب کسی پیج میں اسکرین کو بھرنے کے لیے کافی مواد نہ ہو، تو فوٹر کو نیچے خالی جگہ چھوڑنے کے بجائے براؤزر ونڈو کے نیچے آنا چاہیے۔ اس کو پورا کرنے میں بہت سی رکاوٹیں تھیں: سی ایس ایس، اگرچہ اسٹائل کے لیے کافی مفید تھا، لیکن اس میں پیج لے آؤٹ کے لیے محدود صلاحیتیں تھیں۔ بلاک عناصر (جیسے ڈیو عناصر) کی اونچائی کا تعین عام طور پر ان کے مواد سے ہوتا ہے۔ لہذا دو ڈویژن، شانہ بہ شانہ، مواد کی مختلف مقدار کے ساتھ، مختلف بلندیاں ہوں گی جب تک کہ ان کی اونچائی کسی مناسب قیمت پر مقرر نہ کی جائے۔ ایچ ٹی ایم ایل کا مقصد لفظی طور پر استعمال کرنا ہے ؛ ایچ ٹی ایم ایل عناصر کا انتخاب کیا جانا چاہیے جو ان کے مواد کو درست طریقے سے بیان کریں۔ ویب پیج کی ظاہری شکل جیسا کہ صارف ایجنٹ کے ذریعہ پیش کیا جاتا ہے اس کا تعین اسٹائل کے اصولوں کے ذریعہ آزادانہ طور پر کیا جانا چاہئے۔ بہت سے نفاذ غیر ٹیبلولر مواد کے لیے ٹیبلز کا استعمال کرکے، یا بامعنی مقصد کے بغیر متعدد ڈیو عناصر کو گھونسلہ بنا کر ایچ ٹی ایم ایل کا غلط استعمال کرتے ہیں۔ ایچ ٹی ایم ایل کا غیر بامعنی استعمال صارفین یا صارف ایجنٹوں کو الجھاتا ہے جو صفحہ کے مواد کی ساخت کو سمجھنے کی کوشش کر رہے ہیں، اور یہ رسائی کا مسئلہ ہے۔ چونکہ سرچ انجن ویب پیج کے سورس کوڈ کے آغاز میں موجود مواد کو زیادہ متعلقہ سمجھ سکتے ہیں، اور جب کچھ صارف ایجنٹوں جیسے اسکرین ریڈرز کے ذریعے دیکھا جاتا ہے تو مواد کو سورس کوڈ کے ترتیب میں پڑھا جاتا ہے، ویب ڈیزائنرز صفحہ کی ظاہری شکل کو متاثر کیے بغیر صفحہ کے ماخذ میں مواد کو من مانی ترتیب میں رکھنے کی صلاحیت چاہتے ہیں۔ مختلف براؤزرز کے ذریعہ مواد کی غلط پیش کش کی وجہ سے، ایک ایسا طریقہ جو معیار کے مطابق براؤزر میں کام کرتا ہے وہ اس میں کام نہیں کر سکتا جو سی ایس ایس کو صحیح طریقے سے نافذ نہیں کرتا ہے۔ معروف حل میزیں سی ایس ایس کے وسیع پیمانے پر نفاذ سے پہلے، ڈیزائنرز عام طور پر صفحات ترتیب دینے کے لیے میزیں استعمال کرتے تھے۔ بعض اوقات انہوں نے ایک دوسرے کے اندر کئی میزوں کو گھونسلے بنا کر اپنی مطلوبہ ترتیب حاصل کی۔ اگرچہ ٹیبل خلیوں کے اندر کالموں کو رکھنا مطلوبہ بصری ظاہری شکل کو آسانی سے حاصل کر لیتا ہے، لیکن ٹیبل کا استعمال کرنا لفظی طور پر غلط ہے، حالانکہ بامعنی سیاق و سباق کو دوبارہ حاصل کرنے کے لیے "رول" ڈبلیو اے آئی-اے آر آئی اے ایچ ٹی ایم ایل خاصیت کو "پریزنٹیشن" پر سیٹ کیا جا سکتا ہے۔ پیج سورس میں کالموں کی ترتیب کو کنٹرول کرنے کا بھی کوئی طریقہ نہیں ہے۔ ڈسپلے کے ساتھ ڈویژن: ٹیبل سی ایس ایس ڈسپلے پراپرٹی کا استعمال کرتے ہوئے کالموں کو برابر اونچائی بنانا ممکن ہے۔ اس کے لیے نیسٹڈ کنٹینر ڈویژنز کی ضرورت ہوتی ہے جو ڈسپلے کرنے کے لیے سیٹ کیے جاتے ہیں: ٹیبل اور ڈسپلے: ٹیبل قطار، اور کالم جو ڈسپلے کرنے کے لیے سیٹ کیے جاتے ہیں: ٹیبل سیل۔ یہ لفظی طور پر درست ہے، کیونکہ صرف ڈسپلے متاثر ہوتا ہے۔ تاہم، اس طریقہ کار میں سورس کوڈ کی ترتیب کو کنٹرول کرنے کی صلاحیت کا فقدان ہے۔ یہ کچھ پرانے، غیر تعاون یافتہ براؤزرز، جیسے انٹرنیٹ ایکسپلورر 7 کے ساتھ بھی کام نہیں کرے گا۔ جعلی کالم یہ طریقہ ایک پس منظر کی تصویر کا استعمال کرتا ہے جو تینوں کالموں کے پس منظر کے رنگ اور عمودی سرحدیں فراہم کرتا ہے۔ ہر کالم کا مواد ایک ڈویژن میں منسلک ہوتا ہے، اور فلوٹس، منفی مارجن، اور متعلقہ پوزیشننگ جیسی تکنیکوں کا استعمال کرتے ہوئے اس کے پس منظر پر رکھا جاتا ہے۔ پس منظر عام طور پر صرف چند پکسلز اونچا ہوتا ہے، اور اسے "ریپیٹ-وائی" خاصیت کا استعمال کرتے ہوئے صفحہ کا احاطہ کرنے کے لیے بنایا جاتا ہے۔ یہ مقررہ چوڑائی کے ترتیب کے لیے ٹھیک کام کرتا ہے، اور فیصد پر مبنی متغیر چوڑائی والے صفحات کے لیے ڈھال لیا جا سکتا ہے، لیکن سیال مرکز کے صفحات کے لیے استعمال نہیں کیا جا سکتا۔ جاوا اسکرپٹ اس طریقہ کار میں، صفحہ لوڈ ہونے کے بعد، ایک اسکرپٹ ہر کالم کی اونچائی کی پیمائش کرتا ہے، اور ہر کالم کی اونچائی کو زیادہ قیمت پر مقرر کرتا ہے۔ یہ ان براؤزرز میں کام نہیں کرے گا جو جاوا اسکرپٹ کو سپورٹ نہیں کرتے، یا جاوا اسکرپٹ کو غیر فعال کر دیا ہے۔ فکسڈ یا مطلق پوزیشننگ اس طریقہ کار میں کالم کے حصوں کے کونے صفحہ پر ایک مخصوص جگہ پر بند ہوتے ہیں۔ یہ قابل قبول یا مطلوبہ بھی ہو سکتا ہے، لیکن ہولی گریل کا مسئلہ حل نہیں کرتا کیونکہ یہ ایک نمایاں طور پر مختلف ترتیب ہے۔ اس طریقہ کار کے نتائج میں اسکرین کے نچلے حصے میں کالموں کے نیچے ظاہر ہونے والا مواد (جیسے فوٹر)، کالم کے مواد کے نیچے خالی جگہ، اور تمام مواد کو دیکھنے کے لیے ہر کالم کے لیے اسکرول بار کی ضرورت شامل ہو سکتی ہے۔ گھونسلے والے حصے اس کے پس منظر کے ساتھ اس کے مواد پر قابو پانے کے لیے اونچائی میں بڑھے گا۔ اس رویے کو ایک دوسرے کے اندر گھونسلے والے تین حصے بنا کر مسئلے کو حل کرنے کے لیے استعمال کیا جاتا ہے جو تین پس منظر فراہم کرتے ہیں۔ ان ڈویژنوں کو پوزیشننگ تکنیک کا استعمال کرتے ہوئے ان کے مناسب مقام پر رکھا جاتا ہے، اور تین مواد ڈویژنوں کو اندرونی پس منظر ڈویژن کے اندر رکھا جاتا ہے، جو ان کے متعلقہ پس منظر پر رکھے جاتے ہیں۔ اس کے بعد پس منظر کی تقسیم اتنی ہی اونچی ہو جاتی ہے جتنی کہ سب سے اونچی مواد کی تقسیم۔ اس طریقہ کار کی خرابیوں میں تین غیر لفظی تقسیم، اور اس پیچیدہ ترتیب کے عناصر کی پوزیشننگ میں دشواری شامل ہیں۔ بارڈر کلر نیسٹڈ ڈویژن طریقہ کار کا ایک آسان ورژن ایک کنٹینر ڈویژن کا استعمال کرتا ہے۔ اس ڈویژن کی پس منظر کی خصوصیات مرکزی کالم کا پس منظر فراہم کرتی ہیں، اور بائیں اور دائیں سرحدیں، جن کی چوڑائی سائیڈ کالم کی چوڑائی کے برابر دی جاتی ہے، سائڈبار کے پس منظر کے رنگ فراہم کرتی ہیں۔ ہر کالم کا مواد اس کے پس منظر پر رکھا جاتا ہے۔ یہ طریقہ اب بھی ایک غیر لفظی تقسیم کا استعمال کرتا ہے، اور پس منظر کی تصاویر اور سرحدوں کو سائڈبار پر لاگو کرنا مشکل بنا دیتا ہے۔ نیچے کی پیڈنگ کالم کنٹینر کے نچلے حصے میں بڑی مقدار میں پیڈنگ رکھنے سے، پس منظر کالم کے مواد سے بہت نیچے تک پھیل جائے گا۔ ایک متعلقہ منفی مارجن کالموں کے نیچے موجود مواد کو اس کی مناسب پوزیشن میں واپس لے آئے گا۔ اس طریقہ کار میں پوزیشننگ آسان ہے، کیونکہ کالم کے مواد کے کنٹینر میں اس کا پس منظر بھی ہوتا ہے۔ 32767 پی ایکس کی پیڈنگ ویلیو سب سے بڑی ہے جسے تمام جدید براؤزرز پہچان لیں گے۔ اگر کالم کی اونچائی میں فرق اس سے زیادہ ہے، تو چھوٹے کالم کا پس منظر کالم کو مکمل طور پر نہیں بھرے گا۔ موجودہ حل سی ایس ایس 3 معیارات میں ایسے ماڈیول ہوتے ہیں جو صفحہ کے عناصر کو مناسب طریقے سے ترتیب دے سکتے ہیں۔ ان میں سے دو ہولی گریل کے مسئلے کو مکمل طور پر حل کرتے ہیں۔ پرانے براؤزرز میں ان ماڈیولز کے لیے سپورٹ کی کمی یا بصورت دیگر کمی ہے۔ بہت سے ڈیزائنرز پرانے براؤزرز کے لیے ہم آہنگ اسٹائل فراہم کرتے ہوئے ان ماڈیولز کو نافذ کریں گے، جنہیں جدید براؤزرز میں نئے نحو کے ذریعے اوور رائڈ کیا جائے گا۔ 2020 میں پرانے براؤزرز کے لیے سپورٹ کم اہم ہو گئی، جب ونڈوز 7 کے لیے توسیعی سپورٹ ختم ہو گئی، اور انٹرنیٹ ایکسپلورر کا استعمال کم عام ہو گیا۔ سی ایس ایس لچکدار باکس لے آؤٹ (فلیکس باکس) ورلڈ وائڈ ویب کنسورشیم (ڈبلیو 3 سی) نے مختلف تجاویز کے ذریعے ترتیب کے مسئلے سے رابطہ کیا ہے۔ سب سے زیادہ پختہ تجویز لچکدار باکس لے آؤٹ ماڈیول (اے کے اے) ہے۔ فلیکس باکس)، جو نومبر 2018 تک امیدوار کی سفارش کی حیثیت میں ہے۔ کسی عنصر کی ڈسپلے پراپرٹی کو ڈسپلے کرنے کے لیے ترتیب دینا: فلیکس یا ڈسپلے: ان لائن فلیکس عنصر کو ایک نئی قسم کا کنٹینر (بالترتیب بلاک یا ان لائن بلاک کی طرح) بننے کا سبب بنتا ہے، جس میں چائلڈ آبجیکٹ کی پوزیشننگ کے نئے طریقے ہوتے ہیں۔ ڈبلیو 3 سی تجویز میں ایک مثال شامل ہے جو چار سادہ سی ایس ایس اصولوں کا استعمال کرتے ہوئے ہولی گریل کالم ترتیب کو حاصل کرتی ہے، اور ترتیب کو ایک سادہ میڈیا استفسار اصول کے ساتھ جواب دہ بناتی ہے۔ ماڈیول کو ترتیب کے بہت سے دوسرے مسائل کو حل کرنے کے لیے بھی استعمال کیا جا سکتا ہے۔ لچکدار باکس لے آؤٹ ماڈیول تمام جدید براؤزرز میں معاون ہے، حالانکہ انٹرنیٹ ایکسپلورر کے نفاذ میں مسائل ہیں۔ سی ایس ایس گرڈ لے آؤٹ گرڈ لے آؤٹ ماڈیول اسی طرح ایک ڈیزائنر کو ترتیب کے لیے کنٹینر بنانے کی اجازت دیتا ہے، جس میں مقررہ یا متغیر سائز کی قطاریں اور کالم ہوتے ہیں جن میں عناصر رکھے جا سکتے ہیں۔ یہ دسمبر 2020 تک امیدوار کی سفارش کی حیثیت میں ہے۔ یہ تمام جدید براؤزرز میں معاون ہے، تاہم انٹرنیٹ ایکسپلورر کے نفاذ میں مسائل ہیں۔ یہ ماڈیول گرڈ پوزیشننگ ماڈیول، ٹیمپلیٹ لے آؤٹ ماڈیول، اور ایڈوانسڈ لے آؤٹ ماڈیول کے طور پر کیے گئے پچھلے کام کا تسلسل ہے۔ اس ماڈیول کا ایک پہلو کنٹینر میں نیم گرافک طور پر گرڈ سلاٹ بنانے کی صلاحیت ہے، اس انداز میں جسے "اے ایس سی آئی آئی آرٹ" کے طور پر بیان کیا گیا ہے، جیسا کہ سپرسیڈ ٹیمپلیٹ لے آؤٹ ماڈیول میں ہے۔ اگرچہ لچکدار باکس ماڈیول 2 جہتی صفحہ ترتیب انجام دینے کی صلاحیت رکھتا ہے، لیکن اس کا مقصد عناصر کو بنیادی طور پر ایک محور کے ساتھ رکھنا ہے۔ پیچیدہ صفحات کو ترتیب دینے کے لیے گرڈ لے آؤٹ کو ترجیح دی جاتی ہے، اور ایسے صفحات جن کی ترتیب ذمہ دار ڈیزائن میں بہت مختلف ہوتی ہے۔ خالص سی ایس ایس کا استعمال کرنے والا پہلا تین کالموں والا فلیکنگ ڈیزائن 2001 میں بلیو روبوٹ کے روب چندانیس نے سائٹ wrongwaygoback.com کے لیے تیار کیا تھا۔ اس وقت نیل ٹیلبوٹ دائیں ہاتھ کے کالم کی پوزیشننگ کا تعین کرنے کے لیے جاوا اسکرپٹ کا استعمال کر رہے تھے۔ چندانیس اس کے بجائے خالص سی ایس ایس کا استعمال کرتے ہوئے پوزیشننگ کے لیے ایک خوبصورت حل لے کر آئے اور اس کے فورا بعد Glish.com کے ایرک کوسٹیلو نے دی ہولی گرل کا نام دیا۔ ٹیبل لیس ویب ڈیزائن رسپانسیو ویب ڈیزائن حوالہ جات کیسکیڈنگ اسٹائل شیٹس رسپانسیو ویب ڈیزائن بھی دیکھیں۔