کراس براوزنگ (cross browser issues)

کراس براوزنگ سے مراد ایک ویب سایٹ کا مختلف براوزر میں کام کرنا ھے۔ اکژ اوقات ہم محسوس کرتے ھیں کہ ویب سایٹ گوگل کروم میں صحیح کام کر رہی ہے لیکن انٹرنیٹ ایکس پلوریر پر اس کا نقشہ ہل گیا ہے یا رنگ پھیکے پڑ گے ہیں یا کوی اور مسلہ ھے۔ یہ ایک ہی براوزر کے دو مختلف ورزن میں بھی ھو سکتا ھے۔

دنیا میں کئ بڑے برانڈ اور ورژن کے براوزر پاے جاتے ہیں لیکن پانچ بڑے براوزر زیادہ مشہور ہیں ۔ Internet Explorer (IE), Safari Mozilla Firefox, Google Chrome, Opera۔ ان سب کا HTML اور CSS کو سکرین پر دکھانے کے لیے اپنا الگ انجن ھے۔ جس کوbrowser engine/Rendering Engine/layout engine بھی کہتے ھیں۔چونکہ سب کا اپنا اپنا انجن ھے اسی وجہ سے ہر کوی اپنے انجن کے مطابق HTML کو پڑھتا ہے ۔

مشورے
1) Validation

اپنی ویب سایٹ انٹرنیٹ پر شایع کرنے سے پہلے Validate کر لیں۔

HTML Validator
http://validator.w3.org

CSS Validator
http://jigsaw.w3.org/css-validator

2) مختلف براوزر پر ٹیسٹ کریں

اس کے دو طریقے ہو سکتے ہیں۔ اپ سارے براوزر تنصیب کر لیں اور سب پر کوڈ چلا کر دیکھیں ۔دوسرا یہ کہ اپ کوی ایسا پروگرام استعمال کر لیں جو سبھی کے لیے چل جاے۔

BrowserShots
http://browsershots.org

IE Tester
http://www.my-debugbar.com/wiki/IETester/HomePage

Adobe Browser Lab
https://browserlab.adobe.com/en-us/index.html


نوٹ : یہ کراس براوزنگ کا مختصر سا تعارف تھا، ان کے علاوہ بھی اور طریقوں سے ویب سایٹ کو مختلف براوزر کے لیے بہتر بنایا جا سکتا ہے۔

 

زبردست! معلومات میں اضافہ کرنے کے لیے جزاک اللہ خیرا۔ مزید کا انتظار رہے گا
اچھا یہ جو validation ہے اس کا مقصد یہی ہے کہ ہمارے سکرپٹ کو اس وقت درست کہے گا جب تمام براؤزرز کے لیےدرست کام کرے؟ یعنی اس سٹیپ سے پہلے تمام براؤزرز کے لیے سکرپٹ کو قابل قبول بنانا پڑے گا اوراسی مقصد کے لیے پری فکس کا استعمال کیا جائے گا۔
فرصت میں پری فکس والی ٹپ پر بھی روشنی ڈالیے گا!

 

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

 

بلکل بھی نھیں ۔ validation کراس براوزنگ کو یقینی بنانے میں کوی مدد نھیں کرتا ۔اس کا کام لا پتہ|missing کوڈ ، غلط کوڈ پر تنبیہی پیغام دینا اور W3C کے وضاحت کردہ اصولوں کے مطابق کوڈ کو standardize|معیاری بنانا ہے۔جب اپ کی ویب سایٹ standardize ہو جاے اس کے بعد اپ کوڈ کو ٹھیک کرنا شروع کریں یہاں تک کہ وہ تقریباَِ ہر بڑے براوزر میں مناسب حد تک نیک صورت اور سیرت ہو جاے۔مناسب حد تک اس لیے کہ جیسے اپ دنیا میں ہر کسی کو خوش نھیں کر سکتے ویسے ہی تمام براوزر کو ایک ساتھ لے کر چلتے وقت بھی کمی رہ جاتی ھے ۔تو validation اصل میں کوڈ کی Debugging میں مدد کرتا ہے جس سے کراس براوزنگ کوڈ لکھنے یا ٹھیک کرنے میں اسانی ہو جاتی ہے۔

 

اچھا اب میں سمجھ گئی! سوالات تو اور بھی ہیں مگر فی الحال میں زیادہ تنگ نہیں کر رہی، اردو کی پریکٹس ذرا بڑھا لیں باقی پھر ورنہ آپ نے بھاگ جانا ہے
جزاک اللہ خیرا۔

 

کراس براوزنگ کی اچھی بات یہ ہے کہ یہ چونکہ براوزر سے متعلق ھے تو اس کا سرور سے یا سرورکی لینگویج سے کوی تعلق نھیں۔ یعنی یہ کلاینٹ سایڈ تک محدود ہے۔ جس کا مطلب یہ ھوا کہ ہم HTML , CSS اور Javascript میں ہی کچھ ایسی پریکٹس یا مشوروں پر عمل کر سکتے ہیں جن کی بدولت ہم زیادہ سے زیادہ براوزرز میں ویب سایٹ کو صحیح طریقہ سے دکھا سکیں۔ اس حوالے سے دیکھا جاے تو HTML کی اپنی الگ کچھ ٹپس ھیں ، Javascript کے اپنے کچھ مشورے اور پری فکس والی ٹپ جس پر آپ سے بات ھوی تھی وہ CSS کے متعلق تھی۔اس ٹپ کو بتانے سے پہلے مزید کچھ اور تفصیل دیکھ لیتے ھیں۔
یہ تو ھم لوگ جانتے ھیں کہ W3C ہی HTML اور CSS کےلیے سٹینڈرڈ بناتی ھے۔ لیکن کبھی کبھار ایسا ھوتا ھے کہ W3C ابھی کسی Property یا Tag کے بارے میں غور و فکر کر رھی ھوتی ھے کے مختلف براوزر کی کمپنی اپنے ناموں کے سابقوں کے ساتھ اس Property کو مارکیٹ میں لے اتی ھیں۔ مثال کے طور پر CSS3 کی پراپرٹی :

انٹرنیٹ ایکسپلوریر : (background: -ms-linear-gradient(top, red 0%, yellow 10
گوگل کروم : (background: -webkit-linear-gradient(top, red 0%, yellow 100%
فایر فوکس : (background: -moz-linear-gradient(top, red 0%, yellow 100%
اوپرا : ( background: -o-linear-gradient(top, red 0%, yellow 100%

تو اصل ٹپ یہ ھے کہ اپ اپنی CSS3 کی فائل میں سب سے پہلے پرانے ورژن کےلیے ایک پراپرٹی لکھیں ۔پھر تمام براؤزر کی اپنی پراپرٹی شامل کریں اور اس کے بعد ایک عمومی پراپرٹی آخر میں شامل کریں کہ کبھی سب براوزر کا آپس میں اتفاق ہو جاے۔

}body
؛background: yellow
؛(background: -moz-linear-gradient(top, red 0%, yellow 100%
؛(background: -webkit-linear-gradient(top, red 0%, yellow 100%
؛(background: -o-linear-gradient(top, red 0%, yellow 100%
؛(background: -ms-linear-gradient(top, red 0%, yellow 100%
؛(background: linear-gradient(to bottom, red 0%,yellow 100%
}
​

 

جزاک اللہ خیرا۔

اور اگر پہلے سے اتفاق ہو؟ تو کیا پھر بھی باقی تمام براؤزرز کے پری فکس لکھنے لازمی ہیں؟

 

نھیں ۔ اگر ایک ہی عمومی پراپرٹی سے آپ کا کوڈ ہر براؤزڑ میں صحیح کام کر رہا ہے تو پھر الگ الگ لکھنے کی ضرورت نھیں۔