20 زیرترقی ڈیزائن ویب ٹولز

مواد

• 01. CSS3 چارٹ پر کلک کریں
• 02. پیٹرنائزر
• 03. کوڈ کٹ
• 04. بیسکیمپ
• 05. HTML5 Boilerplate
• 06. گوگل رچ ٹکڑے
• 07. سپرائٹ باکس
• 08. XRAY
• 09. پرائمر
• 10. ایڈوب بریکٹ
• 11. کوڈپین
• 13. کہیں بھی کوڈ
• 14. کلاؤڈ 9 IDE
• 15. سائٹ کی تصدیق کنندہ
• 16. FitText.js
• 18. جے ایس لنٹ
• 19. جے ایس فڈل
• 20. سرقہ کا چیکر

اگر آپ زندگی گزارنے کے لئے ویب سائٹ بناتے ہیں تو ، آپ بلا شبہ ویب ڈیزائن کے واضح ٹولز - فائر بگ ، براؤزر شاٹس ، نیز مختلف فونٹ ایمبیڈنگ خدمات اور صفحہ کی رفتار کے تجزیہ کاروں کا استعمال کریں گے۔

تو یہ مضمون ان کے بارے میں نہیں ہے۔ اس کے بجائے ہم نے سوچا کہ ہم انڈرورٹڈ ٹولز پر ایک نظر ڈالیں جو آپ کو کلائنٹ سائڈ براؤزر کی ترقی کو بہتر بنانے اور اپنی بنائی ہوئی ہر چیز کی سختی سے جانچ کرنے میں مدد فراہم کرسکتے ہیں۔ امید ہے کہ آپ کو ہماری خصوصیت میں کوئی ایسی کارآمد چیز ملے گی جس کے بارے میں آپ نے پہلے نہیں سنا ہوگا۔ دریں اثنا ، اگر آپ کسی ایسے آلے کے بارے میں جانتے ہیں جس کے مستحق پریس نہیں ملتا ہے تو ، ہمیں ذیل میں دیئے گئے تبصروں میں اس کے بارے میں بتائیں…

01. CSS3 چارٹ پر کلک کریں

CSS3 کلک چارٹ CSS3 اوصاف کے لئے ایک آسان حوالہ ٹول ہے۔ مجھے یقین ہے کہ ہم سب نے یہ سمجھنے کے لئے بہت جدوجہد کی ہے کہ کسی وقت سی ایس ایس باکس شیڈو اقدار کی ضرورت ہے ، اور اسی جگہ سی ایس ایس 3 کلک چارٹ آتا ہے۔ ساتھ ہی سی ایس ایس ترکیب مثال کے طور پر آپ کو یہ بتانے کے لئے کہ کس طرح کسی خاص کو استعمال کرنا ہے۔ وصف ، اس میں ہر ایک وصف کا مظاہرہ ہوتا ہے۔

02. پیٹرنائزر

پیٹرنائزر ایک آن لائن ٹول ہے جو آپ کو آن لائن انٹرفیس کا استعمال کرتے ہوئے سی ایس ایس 3 پٹیوں کو تیار کرنے میں مدد فراہم کرتا ہے۔ آپ اپنی ضرورت کی ہر چیز کو اپنی مرضی کے مطابق بنا سکتے ہیں ، جس میں دھاریوں / چیکوں کے درمیان فرق ، جس زاویے پر نظر آتے ہیں اور ان کا رنگ ، یا دستیاب نمونوں کی موجودہ لائبریری کو براؤز کرسکتے ہیں۔

03. کوڈ کٹ

کوڈ کٹ میک کے لئے ایک ایپ ہے جو فرنٹ اینڈ ڈویلپرز کو SASS کا استعمال کرتے ہوئے یا آسان زندگی گزارنے کی اجازت دیتی ہے۔ کوڈ کٹ آپ کی کم یا SASS فائلوں کو چلتے پھرتے مرتب کرتا ہے تاکہ آپ کو اپنے پروجیکٹ کی شبیہہ فائل کے سائز کو بہتر بنائے اور آپ کے براؤزر ونڈو میں صفحہ کو براہ راست دوبارہ لوڈ کریں۔

04. بیسکیمپ

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

05. HTML5 Boilerplate

HTML5 بوائلرپلیٹ صرف اتنا ہے: HTML5 پروجیکٹس کے لئے ایک بوائلر پلیٹ ، جو آپ کو ایک ڈاؤن لوڈ میں فرنٹ اینڈ ڈویلپمنٹ پروجیکٹ شروع کرنے کے لئے درکار سب کچھ حاصل کرنے میں مدد فراہم کرتا ہے۔

06. گوگل رچ ٹکڑے

ونڈو شاپرس سے اپنی ویب سائٹ کی اپیل کرنا بہت ضروری ہے۔ گوگل کا رچ سنیپیٹ ٹول ، جو ویب ماسٹر ٹولز کے اس سویٹ کا ایک حصہ ہے ، آپ کو پیش نظارہ اور کسٹمائز کرنے کی سہولت دیتا ہے کہ آپ کی سائٹ تلاش کے نتائج میں کس طرح دکھاتی ہے۔ یہ جانچ پڑتال کے لئے ایک آسان حل فراہم کرتا ہے کہ آپ کی ویب سائٹ گوگل کو مفید ڈیٹا فراہم کررہی ہے ، اور آپ کی سائٹ کی فہرست کو بڑھا رہی ہے۔

07. سپرائٹ باکس

سپرائٹ باکس سی ایس ایس اسٹرائٹ کلاس اور آئی ڈی تیار کرنے کے لئے ایک مفید نظام ہے۔ اپنی تخلیق کردہ اسپرائٹ امیج اپ لوڈ کریں ، اور WYSIWG ٹول کا استعمال کرکے آپ اسٹرائٹ میں اپنے انفرادی عناصر کی جلدی وضاحت اور پیش نظارہ کرسکتے ہیں۔ یہ ٹول اسپرٹیس کے استعمال سے اندازہ لگاتا ہے ، جس سے آپ کے گرافکس کو بالکل درست انداز میں ترتیب دینے کا ایک تیز اور آسان عمل ہوتا ہے۔

08. XRAY

یہ چھوٹا سا بک مارکلیٹ آپ کو صفحہ پر مخصوص عناصر کے بارے میں باکس ماڈل کی معلومات دیکھنے کے لئے کسی صفحے سے تفتیش کرنے کی اجازت دیتا ہے۔ بک مارکلیٹ کو صرف اپنے پسندیدہ بار پر گھسیٹیں ، پھر جب کسی ایسے صفحے کو دیکھ کر جب آپ تفتیش کرنا چاہتے ہیں تو ، بک مارک پر کلک کریں اور پھر اس عنصر پر کلک کریں جس کے بارے میں آپ ڈیٹا دیکھنا چاہتے ہیں۔ ایک پاپ اپ DOM کے اندر عنصر کی حیثیت ، بنیادی طرز کی معلومات اور IDs / کلاسوں کو ظاہر کرتا ہے۔

09. پرائمر

پرائمر واقعی ایک آسان ٹول ہے جو آپ کو ونڈو میں HTML چسپاں کرنے کی اجازت دیتا ہے ، اور HTML میں استعمال ہونے والی کلاسوں اور آئی ڈی کی بنیاد پر آپ کے لئے خالی سی ایس ایس برآمد کرے گا۔ آئیڈیل اگر آپ سب سے پہلے اپنا مارک اپ بنا کر کام کرتے ہیں ، اور پھر اسٹائل لگاتے ہیں تو پرائمر آپ کے ایچ ٹی ایم ایل کو پارس کرے گا اور خود کلاس یا آئی ڈی کی مثال سے ہر چیز کو اپنی گرفت میں لے لے گا اور خالی سی ایس ایس نوڈس کا ایک سادہ سیٹ تیار کرے گا جس میں آپ کو پیسٹ کرنے یا تیار کرنے کے ل ready تیار ہوگا۔ سی ایس ایس

10. ایڈوب بریکٹ

بریکٹ ویب ڈیزائن اور ترقی کے ل an ایک اوپن سورس ایڈیٹر ہے جو HTML ، CSS ، اور جاوا اسکرپٹ جیسے ویب ٹکنالوجی کے سب سے اوپر پر بنایا گیا ہے۔ تیرتے پینل ، ٹول بار اور شبیہیں کے ذریعہ آپ کے کام کی جگہ کو بے ترتیبی کرنے کے بجائے ، بریکٹ میں آپ کو اپنے کوڈ سے دور کئے بغیر ، ’’ فوری ترمیم ‘‘ میں آن لائن آراء فراہم کرنے پر فوکس کیا گیا ہے۔ یہ پروجیکٹ ایڈوب کے ذریعہ بنایا گیا تھا اور اسے برقرار رکھا گیا ہے ، اور یہ ایم آئی ٹی لائسنس کے تحت جاری کیا گیا ہے۔

11. کوڈپین

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

13. کہیں بھی کوڈ

کوڈ کہیں بھی آپ کو ، کہیں سے بھی کوڈ کی اجازت دیتا ہے ، بغیر کسی چیز کو اپنے ساتھ لانے کی ضرورت ہے۔ کسی بھی کمپیوٹر یا اسمارٹ فون کی مدد سے صرف ایپ میں لاگ ان کریں ، اور آپ کے تمام سرور (FTP ، SFTP ، اور ڈراپ باکس) ، فائلیں وغیرہ آپ کا منتظر ہوں گے۔ یہاں تک کہ جب آپ دوبارہ لاگ ان ہوں گے تو آپ نے جو فائلیں کھولی ہیں وہ بھی کھلی رہیں گی۔ کوڈنی ہیور HTML ، پی ایچ پی ، جاوا اسکرپٹ ، سی ایس ایس ، اور XML سمیت تمام مشہور ویب فارمیٹس کی حمایت کرتا ہے۔

14. کلاؤڈ 9 IDE

کلاؤڈ 9 آئی ڈی ای جاوا اسکرپٹ اور نوڈ ڈاٹ جے ایس ایپلی کیشنز کے ساتھ ساتھ ایچ ٹی ایم ایل ، سی ایس ایس ، پی ایچ پی ، جاوا ، روبی ، اور 23 دیگر زبانوں کے لئے ایک آن لائن ترقی کا ماحول ہے۔ جیسا کہ کہیں بھی کوڈ کہیں بھی ، کلاؤڈ 9 کا مشن بیان یہ ہے کہ ہر ڈویلپر کے پاس آن لائن ایک ورک اسپیس ہونا چاہئے جس سے وہ اس طرح کی ایپلی کیشنز تیار کرے جس طرح وہ ڈیسک ٹاپ یا لیپ ٹاپ پر کرسکتے ہیں۔ چونکہ ایڈیٹر اوپن سورس ہے ، لہذا آپ کسی بھی ویب پر مبنی پلیٹ فارم سے رابطہ قائم کرنے کے لئے آزادانہ طور پر اپنی توسیع لکھ سکتے ہیں۔

15. سائٹ کی تصدیق کنندہ

اس ٹول کا استعمال کرکے اپنی پوری ویب سائٹ کی توثیق کرنے میں وقت کی بچت کریں ، جو صرف ایک کلک میں کرتی ہے۔ سائٹ کا توثیق کرنے والا سرکاری W3C جواز کنندگان کے ذریعہ کی جانے والی توثیق کی تعمیل کرتا ہے ، اور اس میں آپ کی سائٹس پر HTML5 مارک اپ کی توثیق بھی شامل ہے۔

16. FitText.js

زیادہ کام کی وجہ سے دبے ہوئے؟ کوڈنگ ایپ جدید ویب ڈویلپمنٹ کے ل take برتری حاصل کرنے کے لئے ضروری وقت سازی کے کاموں اور دہرائی گئی کاروائیوں کا نظم کرتی ہے۔ ویب ڈویلپر کے بنیادی کاموں پر توجہ مرکوز کرنے سے ، یہ آپ کو زیادہ پیداواری تخلیقی ہونے کی آزادی دیتا ہے۔ ایپ فی الحال بیٹا میں ہے ، لہذا آپ کو دعوت نامے کے ل them ان سے رابطہ کرنے کی ضرورت ہوگی۔

18. جے ایس لنٹ

افسانوی ڈگلس کروکفورڈ کا ایک کارآمد ویب ڈیزائن کا آلہ۔ جے ایس لِنٹ اپنے پُرجوش کوڈنگ کنونشنز کے خلاف جاوا اسکرپٹ کوڈ چیک کرتا ہے۔ کم پیڈینٹک ، اور کم مضبوط ، متبادل جے ایس ہنٹ کی شکل میں دستیاب ہے۔

19. جے ایس فڈل

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

20. سرقہ کا چیکر

ڈپلیکیٹ مشمولات سے نمٹنا ویب ڈیزائنرز کے ل problem ایک بہت بڑا مسئلہ ہے ، کم از کم اس کی وجہ یہ نہیں کہ اس کا اثر آپ کے سرچ انجن اپٹیمیسیشن (SEO) کی کوششوں پر پڑ سکتا ہے۔ ادبی سرقہ کی جانچ پڑتال کا مقصد غیر ارادتا pla سرقہ کے لئے کاغذات کی جانچ کرنا ہے ، لیکن اس سے یہ یقینی بنانے کے لئے ایک مفید ٹول بھی ثابت ہوسکتا ہے کہ آپ کے صفحات کو SEO کے مکمل فوائد ملیں اور یہ بھی آپ کو یہ دیکھنے کی اجازت دی جا that کہ آپ کے مواد کو چوری نہیں کیا جارہا ہے۔ حریف

معاونین: سیم ہیمپٹن اسمتھ ، کیرن پوٹس اور رچرڈ کارٹر

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