آپ کی ویب سائٹ پر ایک تصویر کو کیسے لنک کرنا ہے

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

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

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

تصویری لنک کس طرح

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

یہاں آپ ایچ ٹی ایم ایل دستاویز میں آپ کی تصویر کیسے کریں گے.

تصویر ٹیگ کے ارد گرد، اب آپ لنگر کا لنک شامل کریں گے، تصویر سے پہلے لنگر عنصر کھولیں اور تصویر کے بعد لنگر کو بند کردیں. یہ اسی طرح ہے جیسے آپ متن کو کس طرح لنک کریں گے، اس کے بجائے ان الفاظ کو لپیٹنے کے بجائے لنگر ٹیگ کے ساتھ ایک لنک بننا چاہتے ہیں، آپ اس تصویر کو لپیٹ دیتے ہیں. ذیل میں ہماری مثال میں، ہم ہماری سائٹ کے ہوم پیج پر واپس جارہے ہیں، جو "index.html" ہے.

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

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

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

تصویری لنکس کے لئے مقدمات کا استعمال کریں

لہذا ایک تصویر کا لنک بہت آسان ہے. جیسا کہ ہم نے ابھی دیکھا ہے، آپ کو لازمی طور پر مناسب لنگر ٹیگ کے ساتھ تصویر لینا ہے. آپ کا اگلا سوال ہو سکتا ہے "پیش نظارہ علامت (لوگو) / مرکزی صفحہ لنک مثال کے علاوہ جب آپ اصل میں یہ عمل کریں گے؟"

یہاں کچھ خیالات ہیں:

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

تصاویر کا استعمال کرتے ہوئے ایک یاد دہانی

تصویروں کی ویب سائٹ کی کامیابی میں اہم کردار ادا کر سکتا ہے. مندرجہ بالا مندرجہ ذیل مثالوں میں سے ایک ہے جس میں مواد کی طرف توجہ مرکوز کرنے اور لوگوں کو اسے پڑھنے کے لۓ دیگر مواد کے ساتھ تصاویر کا استعمال کرتے ہوئے ذکر کیا گیا ہے.

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

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