• Smartfeed
  • انٹرنیٹ پر اردو زبان و ادب کے فروغ کے لیے کوشاں

    متصل |  شمولیت اختیار کریں۔

    نئے موضوع کی ترسیل موضوع کا جواب دیں  [ 11 مراسلے ] 

    بدھ فروری 24, 2010 9:33 pm

    غیر متصل
    منتظم اعلٰی
    منتظم اعلٰی
    رکن کی نمائندہ تصویر
    تاریخ شمولیت:: پیر فروری 25, 2008 3:46 pm
    مراسلات: 6864
    مكانیت: بوریوالا

    دوسروں کا شکریہ ادا کیا: 44 بار
    موصول شکریے: 374 بار
    السلام علیکم

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

    ایچ ٹی ایم ایلHTMLایک تعارف


    HTML یا Hyper Text Markup Language(ہائپر ٹیکسٹ مارک اپ لینگوئج) ایک ایسی زبان ہے۔جس میں ورلڈ وائڈ ویب کی ہائپر ٹیکسٹ ڈاکومنٹس لکھی جاتی ہیں۔


    اس کی نمایاں خصوصیات

    1۔ یہ آپ کو ہائپر ٹیکسٹ لنک دیتی ہے جن کی مدد سے اگر آپ روشن ٹیکسٹ کو کلک کرتے ہیں تو آپ ایک نئی ڈاکومنٹ میں رسائی حاصل کر لیتے ہیں۔جو آپ کو کسی اور سائٹ پر لے جاتی ہے۔نئی ڈاکومنٹ اپنے یو۔ایل۔آر کے ذریعے تلاش کی جاتی ہے اور یہ بھی ایچ۔ٹی۔ایم۔ایل کی کوئی دوسری ڈاکومنٹ،تصویریا ساؤنڈ فائل ہو سکتی ہے۔
    2۔ ایچ۔ٹی۔ایم۔ایل اس طرح ڈیزائن کی گئی ہے یہ کسی مخصوص پلیٹ فارم پر بھروسہ نہیں کرتی اور نہ ہی اسے مخصوص ہارڈ وئیر یا سافٹ وئیر کی ضرورت ہوتی ہے۔
    3۔ ـ ایچ۔ٹی۔ایم۔ایل کے پروگرام سادہ ASCII ٹیکسٹ فائل میں لکھے جاتے ہیں۔اس کا مطلب یہ ہے کہ یہ کسی بھی ٹیکسٹ ایڈیٹر مثلا نوٹ پیڈ وغیرہ میں لکھے جا سکتے ہیں۔


    ایچ۔ٹی۔ایم۔ایل ایڈیٹر کیا ہوتا ہے؟


    ایڈیٹر ایک ایپلی کیشن کا نام ہے جس میں آپ ایچ۔ٹی۔ایم۔ایل کا کوڈ لکھتے ہیں۔کوئی بھی ٹیکسٹ ایڈیٹر آپ کا ایچ۔ٹی۔ایم۔ایل ایڈیٹر بن سکتا ہے۔ونڈوز کا نوٹ پیڈ جو تمام ونڈوز آپریٹنگ سسٹمز میں پایا جاتا ہے ساری دنیا میں ایچ۔ٹی۔ایم۔ایل ایڈیٹر کے طور پر استعمال ہو رہا ہے۔لیکن وہ لوگ جو کچھ بہتر کی تلاش میں ہیں ان کے لئے ایچ۔ٹی۔ایم۔ایل کا ایک Enhanced ٹیکسٹ ایڈیٹر HotDog بہت کار آمد ثابت ہو سکتا ہے۔اس کے علاوہ بہت سے کمرشل ایچ۔ٹی۔ایم۔ایل ایڈیٹرز مارکیٹ میں دستیاب ہیں جن میں Adob pagemill یا مائیکروسافٹ کا فرنٹ پیج شامل ہیں۔جو Wysiwyg یعنی“What you see is what you get“ کا ماحول دیتے ہیں۔
    یہ تھا کچھ تعارف ایچ۔ٹی۔ایم۔ایل کے ساتھ اب شروع کرتے ہیں ایچ ٹی ایم ایل پر تفصیلی گفتگو۔



    ہر ایچ ٹی ایم ایل صحفہ کا بنیادی عنصر ایلیمنٹ (Element) کہلاتا ہے، جس کا اردو ترجمہ جز ہی کیاجا سکتا ہے؟ ایلیمنٹ ایچ ٹی ایم ایل صحفہ میں عبارت کی بناوٹ کے لئے استعمال کیا جاتا ہے، ہر ایلیمنٹ دو ٹیگز کے مجموعہ سے بنتا ہے، شروع والے ٹیگ کو ابتدائیہ یا اوپننگ ٹیگ کہا جاتا ہے اور ہر اوپنگ ٹیگ < سے شروع ہوتا ہے اور > پر ختم ہوتا ہے، اسی طرح ایلیمنٹ کے اختتام میں جو ٹیگ استعمال ہوتا ہے اسے اختتامیہ یا کلوزنگ ٹیگ کہا جاتا ہے ۔ اوپننگ اور کلوزنگ ٹیگ کی بناوٹ میں صرف / کا فرق ہوتا ہے ، مثلا
    کوڈ: تمام منتخب کریں
    <p> This is paragraph </p>.

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

    اقتباس:
    Html زبان کی بنیاد Html Tags ہی ہوتے ہیں۔ یہ ٹیگز وہ اشارے ہوتے ہیں تو آپ کے ٹیکسٹ کی فارمیٹنگ کے بارے میں بتاتے ہیں کہ اسے کیسا ظاہر ہونا ہے۔ مثال کے طور پر آپ کے الفاظ کا سائز کیا ہو گا ان کا سٹائل کیا ہوگا ان کی فونٹ کونسی ہو گی۔ دوسرے الفاظ میں ٹیگز ایسے مختصر الفاظ ہیں جو آپ کے کمپیوٹر کو بتاتے ہیں کہ لکھے گئے الفاظ کو سکرین پر کیسے ظاہر کرنا ہے۔
    Html Tags ہمیشہ <> میں لکھے جاتے ہیں اور جتنے ٹیکسٹ کو آپ نے ٹیگز لگانے ہوتے ہیں یا یوں کہئے کہ جتنے ٹیکسٹ کو آپ نے مطلوبہ انداز دینا ہوتا ہے اس کے بعد انہیں انہیں بریکٹس سے بند بھی کیا جاتا ہے لیکن بند کرتے ہوئے ان میں / کا اضافہ کیا جاتا ہے۔یعنی </>۔
    اب مثال کے طور پر آپ نے اپنے ویب صفحہ پر موجود ایک لائن کو بولڈ انداز میں پیش کرنا ہے تو اس کے لئے آپ یوں لکھیں گے۔

    کوڈ: تمام منتخب کریں
    <b> Your Text Area</b>


    اوپر والی لائن میں ہم نے Html Tags استعمال کرتے ہوئے کمپیوٹر کو یہ سمجھایا ہے کہ Your Text Area کے الفاظ کو بولڈ انداز میں ظاہر کیا جائے یعنی نمایاں کر کے دکھایا جائے۔

    ویب صفحہ کے شروع میں <html> کوڈ کمپیوٹر کو بتاتا ہے کہ اس صفحہ کو Html زبان میں لکھا گیا ہے اور اسے ظاہر کرتے ہوئے Html زبان کو ڈی کوڈ کرے۔
    اسی طرح ویب صفحہ کے آخر میں <html/> کوڈ ظاہر کرتا ہے کہ Html زبان میں لکھا گیا مواد ختم ہو چکا ہے اس لئے صفحہ کو اس سے آگے ظاہر کرنا بند کر دے۔

    اسی طرح اپنے صفحہ پر موجود مواد کو ہیڈنگز دینے کے لئے بھی Html Tags کا استعمال کیا جاتا ہے۔ مندرجہ ذیل ہیڈنگز ٹیگز اپنے مواد پر ہیڈنگز دینے کے کام آتے ہیں[/size]

    کوڈ: تمام منتخب کریں
    <h1>This is a heading</h1>
    <h2>This is a heading</h2>
    <h3>This is a heading</h3>
    <h4>This is a heading</h4>
    <h5>This is a heading</h5>


    یہ ٹیگز آپ کی عبارت کو بالکل اس انداز میں ظاہر کریں گے۔

    ہیڈنگ نمبر ایک ایسے ظاہر ہو گی۔
    ہیڈنگ نمبر دو ایسے ظاہر ہو گی۔
    ہیڈنگ نمبر تین ایسے ظاہر ہو گی۔
    ہیڈنگ نمبر چار ایسے ظاہر ہو گی۔
    ہیڈنگ نمبر پانچ ایسے ظاہر ہو گی۔

    [size=150]اسی طرح پیراگراف کو بھی Html Tags سے ظاہر کرتے ہیں۔جو ایسے ظاہر کیا جاتا ہے۔

    کوڈ: تمام منتخب کریں
    <p>This is a paragraph</p>
    <p>This is another paragraph</p>


    ٹیکسٹ کی فارمیٹنگ کے علاوہ Html Tags کی مدد سے لکھی گئی عبارت کو لنک دیاجانا ممکن ہے یعنی جسے کلک کرنے سے آپ کسی دوسری جگہ تک پہنچ سکتے ہیں۔اس کا کوڈ ایسے دیا جاتا ہے۔

    کوڈ: تمام منتخب کریں
    <a href="http://infopioneer.blogspot.com">Info Pioneer Blog</a>


    جب آپ اس کوڈ کو اپنے ویب صفحہ پر دیکھیں گے تو کچھ ایسا نظر آگے گا۔
    Info Pioneer Blog

    اس کے علاوہ اپنے صفحہ پر تصاویر ظاہر کرنے کے لئے بھی انہی ٹیگز کا استعمال کیا جاتا ہے جو کہ کچھ یوں ہے۔

    کوڈ: تمام منتخب کریں
    <img src="/images/avatars/gallery/old_avatars/
    8115857084a2fe5a7085c6.jpg" width="104" height="142" />


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

    اردونامہ پر موجود تصویری عکس : Picture on Urdu Nama : Urdu Forum : Urdu


    گزشتہ سے پیوستہ :

    کوڈ: تمام منتخب کریں
    h1,h2,h3,h4,h5,h6

    یہاں h ہینڈنگ کو ظاہر کرتا ہے اور 1,2,3 درجہ کو ظاہر کرتے ہیں، مختلف عنوان اس طرح لکھے جائیں گے
    کوڈ: تمام منتخب کریں
    ۔
    <h1>This is biggest heading.</h1>
    <h6>This is smallest heading.</h6>

    اوپر والی مثالوں سے ظاہر ہے، کہ ایچ ٹی ایم ایل صحفہ میں ہر ایلمنٹ میں ابتدائیہ اور اختتامیہ یا اوپنگ اور کلوزنگ ٹیگز کا موجود ہونا لازمی ہے، لیکن کچھ ٹیگز اس پابندی سے مستثنیٰ ہیں، جیسے لائن بریک اور ہوریزنٹل لائن کے ٹیگز کو یوں استعمال کیا جاتا ہے ،
    کوڈ: تمام منتخب کریں
    <br />
    <hr />

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

    _________________
    روابط: ٹیوٹر|بلاگ|ویب سائیٹ|گوگل بز|یوٹیوب|فلکر|پینورامیو|میراچشتیاں

    اردونامہ کی ایک زبردست آفر



    واپس اوپر واپس اوپر
      کوائف نامہ WWWYIM

    بدھ فروری 24, 2010 9:44 pm

    غیر متصل
    منتظم اعلٰی
    منتظم اعلٰی
    رکن کی نمائندہ تصویر
    تاریخ شمولیت:: پیر فروری 25, 2008 3:46 pm
    مراسلات: 6864
    مكانیت: بوریوالا

    دوسروں کا شکریہ ادا کیا: 44 بار
    موصول شکریے: 374 بار
    اب اوپر موجود مثالوں اور ٹیگز کا استعمال کرتے ہوئے ایک ویب صفحہ بنانے کی کوشش کرتے ہیں۔سب سے پہلے اپنے کمپیوٹر پر ٹیکسٹ ایڈیٹر یا نوٹ پیڈ کو کھول لیں ۔ آغاز کے طور پر ہم ایک مختصر ویب صحفہ بنائیں گے ۔
    نوٹ پیڈ یا ٹیکسٹ ایڈیٹر کھولنے کے بعدسب سے پہلے ہمیں یہ بتانا ہو گا کہ یہ ایک ایچ ٹی ایم ایل صحفہ ہے، اس کے لئے جو ایلمنٹ استعمال ہوتا ہے وہ درج ذیل ہے ۔
    کوڈ: تمام منتخب کریں
    <html>

    اسے اپنے نوٹ پیڈ میں لکھ لیں، ہم نے اوپر یہ بھی پڑھا ہے کہ ٹیگ دو اقسام کے ہوتے ہیں ایک ابتدائی اور دوسرے اختتامی، درج بالا ایچ ٹی ایم ایل ابتدائی یا اوپننگ ٹیگ ہے، اور ایک ایلمنٹ میں اختتامی ٹیگ لازمی ہونا چاہیے۔ اس لئے اس ٹیگ کے نیچے والی سطر میں ہم اس کا اختتامی ٹیگ لکھ لیں گے، جو کہ درج ذیل ہے ۔
    کوڈ: تمام منتخب کریں
    </html>

    انٹرنیٹ پر موجود ہر صحفہ ان دو ٹیگز کے درمیان لکھا جاتا ہے، اور ہر ویب صحفہ کی اساس یہی ٹیگ ہے، جسے ان دو ٹیگز کے بیچ میں موجود ہونا چاہیے ۔
    ایچ ٹی ایم ایل ٹیگز کے درمیان، بنیادی ٹیگز جو ہونا لازمی ہیں وہ درج ذیل ہیں ۔
    کوڈ: تمام منتخب کریں
    <head>

    اس ٹیگ کے بیچ میں صحفہ کے بارے میں معلوماتی درج کی جاتی ہیں، اگر آپ کسی بھی سائیٹ کا سورس کوڈ دیکھیں تو اس ٹیگ کے بیچ میں مختلف ٹیگز نظر آتے ہیں، یہ سب ٹیگز براؤزر کو صحفہ کے متعلق معلومات فراہم کرتے ہیں، جو کہ پڑھنے والے سے مخفی ہوتی ہیں ۔ویب کا یہ حصہ بے حد اہمیت کا حامل ہوتا ہے اور نہ صرف آپ کے براؤزر کو معلومات فراہم کرتا ہے کہ اس سائیٹ کو کس طرح کھولنا ہے بلکہ سرچ انجن بھی بنیادی معلومات اسی حصہ سے حاصل ہوتی ہیں اور سرچ انجن اپنی Indexing میں اس حصہ سے ہی بنیادی معلومات حاصل کرتا ہے۔ اس ٹیگ کے بعد جو دوسرا ٹیگ ہونا لازمی ہے وہ درج ذیل ہے ۔
    کوڈ: تمام منتخب کریں
    <body>

    اس ٹیگ کے اندر جو کچھ بھی لکھا جاتا ہے، وہی دیگر پڑھنے والوں کو نظر آتا ہے، آسان لفظوں میں جس متن کو دکھانا درکار ہو، وہ اس ٹیگ کے بیچ میں ظاہر کیا جاتا ہے ۔ دوبارہ سے یہ بتانے کی شاید ضرورت نہیں کہ جو ٹیگ ہم شروع کریں، اُسے بند کرنا بھی لازمی ہے ۔ اوپر بیان کردہ تینوں ٹیگز کو آپ نوٹ پیڈ میں اگر درست لکھیں گے تو درج ذیل فائل آپ کے پاس موجود ہونا چاہیے ۔
    کوڈ: تمام منتخب کریں
    <html>

      <head>
      </head>

      <body>
      </body>

    </html>


    اگر آپ کے پاس یہ والی فائل موجود ہے، تو مبارک ہو آپ نے اپنی زندگی کی پہلی ویب سائٹ بنا لی ہے، اگر یہ آپ کے خواب میں آنے والی ویب سائٹ جیسی نہیں تو پریشان مت ہوں، کیونکہ کسی بھی ویب سائٹ بنانے کے لئے جس فائل کی ضرورت آپ کو پڑے گی، وہ یہی فائل ہے ۔
    اب جیسا کہ اس سبق سے ظاہر ہوتا ہے ایچ ٹی ایم ایل صحفہ کے دو بنیادی جز ہوتے ہیں، ایک ہیڈ اور دوسرا باڈی ۔ ہیڈ ٹیگ کے اندر صحفہ کی معلومات لکھی جاتی ہیں، جیسے کہ صحفہ کا عنوان، اور باڈی ٹیگ کے اندر صحفہ کا متن لکھا جاتا ہے ۔ اب آپ ہیڈ ٹیگ کے اندر صحفہ کا عنوان لکھ لیں، جو کہ درج ذیل طریقہ سے لکھا جائے گا ۔
    کوڈ: تمام منتخب کریں
    <title>My first page</title>

    لیکن یہ تحریر آپ کے ویب صحفہ پر ظاہر نہیں ہو گی، ویب صحفہ پر صرف وہی تحریر ظاہر ہو گی جو باڈی ٹیگ کے اندر لکھی جائے گی ۔ اس لئے ہم باڈی ٹیگ کے اندر مندرجہ ذیل تحریر لکھ لیتے ہیں ۔
    کوڈ: تمام منتخب کریں
    <p>This is my first web page, i'm a web designer now.</p>

    اوپر بالا مثال میں p کا ٹیگ پیراگراف کو ظاہر کرتا ہے، اور یہی اس کا مقصد ہے، ہر پیراگراف کے آغاز میں اس ٹیگ کو استعمال کیا جاتا ہے ۔
    ان تبدیلیوں کے بعد آپ کے پاس نوٹ پیڈ میں درج ذیل فائل ہو گی۔
    کوڈ: تمام منتخب کریں
    <html>

      <head>
       <title>My first page</title>
      </head>

      <body>
      <p>This is my first web page, i'm a web designer now.</p>
      </body>

    </html>

    اب اس کے بعد ہم اس فائل کو اپنے کمپیوٹر پر مخفوظ کرلیں گے، اگر آپ نوٹ پیڈ کا استعمال کر رہے ہیں تب آپ فائل مینو میں Save As پر جائیں گے، نئی کھلنے والی ونڈو میں نیچے جا کر Save As Type میں All Files کو منتخب کریں، اور یہ کرنا بہت ضروری ہے نہیں تو نوٹ پیڈ اس کو ایک سادہ عبارت میں مخفوظ کر لے گا۔ اس کے بعد فائل کا نام mypage.html لکھ کر مخفوظ کرلیں ۔ لینکس والے صرف فائل کے نام لکھ کر مخفوظ کر لیں تو کافی ہے ۔
    ہر ایچ ٹی ایم ایل صحفہ کو مخفوظ کرتے وقت .htm یا .html پر ختم کرتے ہیں ۔بہتر ہے کہ آپ اس فائل کو ڈیسکٹاپ پر مخفوظ کریں ۔
    فائل مخفوظ کرنے کے بعد، ڈیسکٹاپ یا جہاں بھی آپ نے فائل مخفوظ کی ہو، اُس پر ڈبل کلک کر کے اسے کھولیں، تو آپ کا صحفہ آپ کے سامنے موجود ہو گا ۔

    _________________
    روابط: ٹیوٹر|بلاگ|ویب سائیٹ|گوگل بز|یوٹیوب|فلکر|پینورامیو|میراچشتیاں

    اردونامہ کی ایک زبردست آفر



    واپس اوپر واپس اوپر
      کوائف نامہ WWWYIM

    بدھ فروری 24, 2010 10:05 pm

    غیر متصل
    منتظم اعلٰی
    منتظم اعلٰی
    رکن کی نمائندہ تصویر
    تاریخ شمولیت:: پیر فروری 25, 2008 3:46 pm
    مراسلات: 6864
    مكانیت: بوریوالا

    دوسروں کا شکریہ ادا کیا: 44 بار
    موصول شکریے: 374 بار
    اس تحریر سے شاید آپ ایچ ٹی ایم ایل میں ماہر نہیں بن سکیں گے، لیکن ایچ ٹی ایم ایل کے پیچھے کارفرما عوامل سے آگاہی ضرور حاصل کر لیں گے۔ اور چونکہ ہمارا مقصد بھی یہی ہے کہ ہمیں ایچ ٹی ایم ایل کے بنیادی ایلمنٹس سے آگاہی حاصل ہو اس لئے شاید یہ تحریر آپ کے لئے فائدہ مند ثابت ہو۔ اب ہم مزید کچھ ایلیمنٹس جو ایچ ٹی ایم ایل میں استعمال ہوتے ہیں، ان کا احاطہ کریں گے ۔

    Attributes

    ایچ ٹی ایم ایل میں مختلف ایلیمنٹ کے ساتھ مختلف خصوصیات کا استعمال کیا جاتا ہے، جنہیں Attributes کہتے ہیں، ان کے استعمال سے عبارت کی شکل وغیرہ بدلی جاتی ہے۔
    اوپر بنائی گئی فائل میں ہم نے پیراگراف کے لئے ٹیگ استعمال کئے تھے ۔ اب اس میں ہم Attributes کو ذیل کی طرح لکھ سکتے ہیں ۔
    کوڈ: تمام منتخب کریں
    <p align="center">This is my first web page, i'm a web designer now.</p>

    اس طرح فائل کو مخفوظ کرنے کے بعد جب آپ اسے براؤزر میں دیکھیں گے تو عبارت صحفہ کے درمیان میں نظر آئے گی ۔یہاں Alighٹیگ استعمال کیا گیا ہے براوزر کو بتانے کے لئے کہ اس تحریر کی Alignment کیا ہو گی۔

    بنیادی ٹیگز اور عبارت کی تدوین ۔

    ایلیمنٹ اور Attributes کا استعمال کر کے، ہم ایک مکمل لیکن سادہ ویب صحفہ ترتیب دے سکتے ہیں ۔ایچ ٹی ایم ایل میں استعمال ہونے والے تمام ایلیمنٹس کا احاطہ کرنا اس ایک مضمون میں ممکن نہیں ہے، لیکن تمام اہم ایلمنٹس اور ٹیگز اور ان کے ساتھ استعمال ہونے والے Attributes کا ایک مختصر جائزہ ہم یہاں ضرور لیں گے ۔
    ہم دوبارہ سے اپنی پہلی بنائی ہوئی فائل پر توجہ دیتے ہیں ۔جو کہ درج ذیل ہے۔

    کوڈ: تمام منتخب کریں
    <html>

      <head>
       <title>My first page</title>
      </head>

      <body>
      <p>This is my first web page, i'm a web designer now.</p>
      </body>

    </html>


    اس فائل میں اب ہم کچھ اضافہ کرتے ہیں ۔

    کوڈ: تمام منتخب کریں
    <html>
    <head>
    <title>Basic text formatting.</title>
    </head>
    <body>
    <h1>The king.</h1>
    <p>Once upon a time,
    in mountains of northern india,
    a child was born.</p>
    Once upon a time, <p>in mountains of northern india, a child was born.</p>
    <p>Once upon a time, in mountains of northern india, a child was born.</p>
    <p>Once upon a time, <br /> in mountains of northern india, a child was born.</p>
    <p> Once upon a time, <hr />in mountains of northern india, a child was born.</p>
    <h3>His name was king.</h3>
    <p>He conqured whole india, when he was only 10.</p>
    <hr />
    <p align="center">That is why i called him, The king.</p>
    </body>
    </html>


    اس فائل کو بنانے کے بعدآپ اس کا مشاہدہ براؤزر میں کریں، تو ایک ہی جملہ آپ کو مختلف انداز میں لکھا ہوا نظر آئے گا۔ یہاں پر دو قابلِ غور باتیں ہیں ۔
    کہ جب آپ کسی عبارت کو پیراگراف ایلیمنٹ دیتے ہیں، تو چاہیں آپ نوٹ پیڈ میں ہر سطر کو نئی سطر سے شروع کریں، براؤزر میں یہ ویسے نظر نہیں آئے گا۔
    دوسری بات یہ ہے کہ جب آپ ایک سطر لکھتے ہوئے اُس میں پیراگراف کا استعمال کرتے ہیں تو ٹیگ کے استعمال کے بعد والا حصہ نئی سطر سے شروع ہو گا ۔
    کسی بھی پیراگراف میں نئی سطر شروع کرنے کے لئے یا پیراگراف میں دو پیراگراف کو ایک دوسرے سے الگ کرنے کے لئے لائن بریک <br /> کا استعمال کیا جاتا ہے ۔ اسی طرح <hr /> کے استعمال سے بھی یہی کیا جا سکتا ہے، لیکن ان دونوں میں ایک فرق یہ ہے کہ hr کے استعمال کے بعد ایک قطار ظاہر ہو جاتی ہے ۔جو Horizental Line کہلاتی ہے۔

    اس کے علاوہ مندرجہ ذیل Attributes ایچ ٹی ایم ایل سادہ ویب صفحہ بنانے میں استعمال ہوتے ہیں۔

    <body bgcolor=> آپ کے ویب صفحہ کے پس منظر کا رنگ تجویز کرنے کے لئے استعمال ہوتا ہے۔

    <body text=> صفحہ میں موجود متن کا رنگ تجویز کرنے کے کام آتا ہے۔

    <body link=> آپ کے صفحہ پر موجود لنک کے رنگ کے انتخاب کےلئے استعمال ہوتا ہے۔

    <body alink=> ویب صفحہ پر موجود ایکٹو لنک کے رنگ تجویز کرنے کے کام آتا ہے۔

    <body vlink=> ویب صفحہ پر موجود وہ لنک جن پر کلک کیا جا چکا ہوتا ہے ان کا رنگ تجویز کرتا ہے۔

    <font> آپ کے ویب صفحہ پر موجود متن کی فونٹ کے بارے میں معلومات تجویز کرنے کے کام آتا ہے۔

    <a> آپ کے ویب صفحہ پر موجود متن کےکسی بھی حصہ کو لنک دینے کے کام آتا ہے۔

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

    ایچ ٹی ایم ایل کی بنیادی سے لے کر ایڈونسڈ لیول تک کی معلومات بے حد آسان الفاظ اور مثالوں کے ساتھ یہاں موجود ہے۔

    اگر میں کہیں کوئی غلطی کر گیا ہوں جو یقیننا ہو گی تو معافی کا طلب گار ہوں۔

    _________________
    روابط: ٹیوٹر|بلاگ|ویب سائیٹ|گوگل بز|یوٹیوب|فلکر|پینورامیو|میراچشتیاں

    اردونامہ کی ایک زبردست آفر



    واپس اوپر واپس اوپر
      کوائف نامہ WWWYIM

    جمعرات فروری 25, 2010 2:48 am

    غیر متصل
    مشاق
    مشاق
    رکن کی نمائندہ تصویر
    تاریخ شمولیت:: اتوار اکتوبر 25, 2009 5:48 am
    مراسلات: 1256
    مكانیت: India'maharastra'nasik'malegaon

    دوسروں کا شکریہ ادا کیا: 194 بار
    موصول شکریے: 147 بار
    اسلام علیکم
    گو یہ موضوع ابھی میرے لئیے بہت ہی نیا ہے. مگر پھر بھی اسکو پڑھ کر بہت ہی آسانی سے سمجھ میں آرہا ہے. جزاک اللہ ، احباب آپ کی بتّی کو مزید اونچا فرماتے رہیں تاکہ آپ اسمیں مزید اضافہ کرتے رہیں
    ویسے باقاعدہ کلاس وائیز اگر اسپر لکھتے رہیں تو کیا ہی بہتر ہو.چند سوالات اکٹھا ہوجائیں مربوط فرما کر ایک کلاس پریڈ کی شکل دے دیں اور جگہوں پر بھی اس موضوع کو یوں ہی دیکھنے کی کوشش کی چکّر آجانے پر بند کردیا یہ تو بہت اچھّا ہے کہ آپ اچھے استاد نہیں ورنہ طالب علموں کی بجائے آپ ہی سمجھ رہے ہوتے. :mrgreen: :mrgreen: :mrgreen:
    ہمارے ادھر نویں(9)--دسویں (10) درجہ سے اسکولوں میں اسکے اسباق داخل ہوچکے ہیں اب کل گھر کے بچّوں کو بتاوں گا اور پھر انکو کیسا سمجھ میں آیا. اسکو درج کروں گا.

    _________________
    یا اللہ تعالٰی بدگمانی سے بد اعمالی سےغیبت سےعافیت کے ساتھ بچا.
    اردونامہ پر موجود تصویری عکس : Picture on Urdu Nama : Urdu Forum : Urdu



    واپس اوپر واپس اوپر
      کوائف نامہ YIM

    جمعرات فروری 25, 2010 6:53 am

    غیر متصل
    منتظم اعلٰی
    منتظم اعلٰی
    رکن کی نمائندہ تصویر
    تاریخ شمولیت:: اتوار اپریل 12, 2009 8:48 pm
    مراسلات: 3327
    عمر: 30

    دوسروں کا شکریہ ادا کیا: 103 بار
    موصول شکریے: 176 بار
    بہت زبردست کاوش ہے
    اللہ آپ کی صلاحیتوں کو مزید جلا دے

    _________________
    شازل
    شازل کا بلاگ



    واپس اوپر واپس اوپر
      کوائف نامہ WWW

    جمعرات فروری 25, 2010 9:26 am

    غیر متصل
    مدیر
    مدیر
    رکن کی نمائندہ تصویر
    تاریخ شمولیت:: ہفتہ اکتوبر 17, 2009 11:17 am
    مراسلات: 3563
    مكانیت: اللہ کی زمین

    دوسروں کا شکریہ ادا کیا: 110 بار
    موصول شکریے: 232 بار
    بہت خوب ناکام استاد جی آپ نے تو کمال کردیا اگر آپ ایسے ہی ناکام ہیں تو یہ بہت خوشی کی بات ہے کیونکہ کامیاب استادوں کی اکثر سمجھ نہیں آتی

    _________________
    ہمیں شوق اذیت ہے وگرنہ اس زمانے میں
    تیری یادیں بُھلانے کو بہت سامان رکھا ہے



    روابط: بلاگ|ویب سائیٹ|سکرائبڈ |ٹویٹر



    واپس اوپر واپس اوپر
      کوائف نامہ WWWYIM

    جمعرات فروری 25, 2010 5:41 pm

    غیر متصل
    منتظم اعلٰی
    منتظم اعلٰی
    رکن کی نمائندہ تصویر
    تاریخ شمولیت:: پیر فروری 25, 2008 3:46 pm
    مراسلات: 6864
    مكانیت: بوریوالا

    دوسروں کا شکریہ ادا کیا: 44 بار
    موصول شکریے: 374 بار
    السلام علیکم

    احباب کا بہت بہت شکریہ جنہوں نے میرے اس ناقص سبق کو اتنی اہمیت دی اور میری بتی مزید اونچی کر دی۔
    ویسے جس کے لئے یہ لکھا گیا ہے وہ کہاں ہیں؟؟؟؟؟؟

    ارے کوئی انہیں بتائے گا پلیز کہ ہم نے معرکہ مار لیا ہے۔ :mrgreen:

    _________________
    روابط: ٹیوٹر|بلاگ|ویب سائیٹ|گوگل بز|یوٹیوب|فلکر|پینورامیو|میراچشتیاں

    اردونامہ کی ایک زبردست آفر



    واپس اوپر واپس اوپر
      کوائف نامہ WWWYIM

    جمعرات فروری 25, 2010 6:21 pm

    غیر متصل
    منتظم اعلٰی
    منتظم اعلٰی
    رکن کی نمائندہ تصویر
    تاریخ شمولیت:: اتوار اپریل 12, 2009 8:48 pm
    مراسلات: 3327
    عمر: 30

    دوسروں کا شکریہ ادا کیا: 103 بار
    موصول شکریے: 176 بار
    بے فکر رہیں مدعی کہیں‌نہیں‌جاسکتا
    ہم ہیں‌ناں 8)

    _________________
    شازل
    شازل کا بلاگ



    واپس اوپر واپس اوپر
      کوائف نامہ WWW

    جمعرات فروری 25, 2010 6:37 pm

    غیر متصل
    منتظم اعلٰی
    منتظم اعلٰی
    رکن کی نمائندہ تصویر
    تاریخ شمولیت:: پیر فروری 25, 2008 3:46 pm
    مراسلات: 6864
    مكانیت: بوریوالا

    دوسروں کا شکریہ ادا کیا: 44 بار
    موصول شکریے: 374 بار
    حوصلہ بڑھانے کا بہت بہت شکریہ۔

    _________________
    روابط: ٹیوٹر|بلاگ|ویب سائیٹ|گوگل بز|یوٹیوب|فلکر|پینورامیو|میراچشتیاں

    اردونامہ کی ایک زبردست آفر



    واپس اوپر واپس اوپر
      کوائف نامہ WWWYIM

    جمعہ مئی 28, 2010 11:43 pm

    غیر متصل
    کارکن
    کارکن
    رکن کی نمائندہ تصویر
    تاریخ شمولیت:: جمعرات مئی 13, 2010 10:33 pm
    مراسلات: 11

    دوسروں کا شکریہ ادا کیا: 0 بار
    موصول شکریے: 5 بار
    بہت خوب استاد جی بڑھیا کام ہے۔
    اس سبق کی وجہ سے مجھے html سیکھنے میں بہت مدد ملی ہے۔
    ]



    واپس اوپر واپس اوپر
      کوائف نامہ

    ہفتہ مئی 29, 2010 12:49 am

    غیر متصل
    منتظم اعلٰی
    منتظم اعلٰی
    رکن کی نمائندہ تصویر
    تاریخ شمولیت:: پیر فروری 25, 2008 3:46 pm
    مراسلات: 6864
    مكانیت: بوریوالا

    دوسروں کا شکریہ ادا کیا: 44 بار
    موصول شکریے: 374 بار
    شکر ہے کسی کو تو مدد ملی۔

    _________________
    روابط: ٹیوٹر|بلاگ|ویب سائیٹ|گوگل بز|یوٹیوب|فلکر|پینورامیو|میراچشتیاں

    اردونامہ کی ایک زبردست آفر



    واپس اوپر واپس اوپر
      کوائف نامہ WWWYIM
    سابقہ مراسلات کا مشاھدہ:  بہ ترتیب  
    نئے موضوع کی ترسیل موضوع کا جواب دیں  [ 11 مراسلے ] 

    تمام اوقات پاکستانی معیاری وقت کے مطابق ھیں


    کون متصل ھے

    فورم پر موجود اراکین: کوئی مندرج اراکین متصل نہیں ہیں اور 2 مہمانان


    آپ کو اجازت نہیں ھے: اس فورم میں نئے موضوعات شروع کرنے کی
    آپ کو اجازت نہیں ھے: اس فورم میں جوابات ارسال کرنے کی
    آپ کو اجازت نہیں ھے: اس فورم میں موجود اپنے مراسلت کی ترمیم و تدوین کی
    آپ کو اجازت نہیں ھے: اس فورم میں اپنے مراسلات حذف کرنے کی
    آپ کو اجازت نہیں ھے: اس فورم میں اپنے مراسلوں کے ساتھ فائلیں منسلک کرنے کی


    تلاش برائے ــــ:
    رجوع بہ:  


    Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group اردو ترجمہ از: سید شاکرالقادری، و محمد کاشف مجید

        Foruzstyleshout