আপনাদের কেমন লাগছে এইচটিএমএল প্রাথমিক লেভেল ? আশাকরি ভালই লাগছে। আজ আমি আপনাদেরকে দেখাবো লিঙ্ক ( Link ) এবং ইমেজ(Image) এই দুটি ট্যাগ সম্পর্কে। আশাকরি আপনারা এগুলো ব্যাবহার করে আপনাদের ওয়েব সাইটকে আরও সুন্দর করে তুলতে পারবেন। যদি কারো বুজতে কোন সমস্যা হয় তবে কমেন্টে জানাবেন।
লিঙ্ক (Link):
আপনি যতটুকু শিখলেন তা দিয়ে একটা সাধারণ ওয়েব পেইজ নিজে নিজে তৈরি করতে পারবেন।

কিন্তু আরও মজার বেপার হল ইন্টারনেট আপনার করা সেই পেইজগুলোকে একসাথে একটি নির্দিষ্ট স্থানে একত্রিত করে রাখে। HTML এর ‘ H’ এবং ‘T’ কে বলা হয় হাইপারটেক্সট (Hypertext) যার সাধারন আর্থ আমরা বলতে পারি একটি লিখিত text কে একত্রে লিঙ্ক করে রাখা। আর এই লিখিত text কে লিঙ্ক করার জন্য ব্যাবহার করা হয় Anchor ট্যাগ (a), শুধু এঙ্কর ট্যাগ ব্যাবহার করলেই হবে না এর সাথে ঐ লিঙ্কের Destination ও যোগ করতে হবে। নিছের কোডটি আপনার এডিটরে Save করে ব্রাউজারে Open করে দেখেনঃ
লক্ষ করে দেখেন এখানে facebook লেখাটি একটি লিঙ্ক এবং এই লিঙ্কে ক্লিক করলে আপনি আমার ফেইসবুক একাউন্টে চলে যাবেন। এটাই হল লিঙ্ক এর কাজ।

এখানে লিঙ্ক ট্যাগের ভীতরে href এর পরে সমান চিন্হ দিয়ে কোটেশনের ভীতরে যে ঠীকানা লিখা হবে লিঙ্ক এ ক্লিক করলে ঠীক ঐ পেইজে নিয়ে যাবে। অনেক সময় দেখা যায় কেউ অনেকগুলো পেইজ তৈরি করল। উদাহরণস্বরূপঃ Home.html, About.html, Services.html, Contact.html ইত্যাদি। এখন আপনি আপনার ঐ পেইজগুলোকে আপনার হোম পেইজের সাথে লিঙ্ক করতে চান। এই ক্ষেত্রে আপনাকে লিঙ্ক করার জন্য নিচের কোডটি সাহায্য করবে :-
আপনার যদি এই পেইজগুলো একটি ফাইলের ভীতরে করা থাকে তাহলে উপরে দেয়া কোডটি আপনার এডিটরে লিখে Save করে ব্রাউজারে Open করে দেখেন এবং লিঙ্কগুলোতে ক্লিক করে দেখেন কাজ করছে কি না।

শুধু যে HTML এক পেইজ থেকে অন্য পেইজে লিঙ্ক করে তা কিন্তু না। যদি কোন পেইজে অনেক বেশি ডাটা থাকে থখন অনেক সময় খুজে পাবার জন্য একই পেইজে লিঙ্ক করার দরকার হয়। তখন আমরা যে বিসয়টিকে খুঁজতে চাই ওতে একটি id ব্যাবহার করব এবং লিঙ্কে href এর পর ঐ id name দিব। নিচের কোডটি দেখলে আরও স্পস্ট হবেঃ
কোডটি আপনার এডিটরে লিখে Save করে ব্রাউজারে Open করে দেখেন এবং লিঙ্কটিতে ক্লিক করে দেখেন কাজ করছে কি না। এই ক্ষেত্রে মনে রাখবেন লিঙ্কে href এর পরে একটি # চিন্হ দিয়ে আপনার দেয়া আইডির নামটি দিতে হবে।

লিঙ্ক সম্পর্কে ওইটুকু জানলেই আশাকরি যেকোনো পেইজে লিঙ্ক করতে পারবেন।
ইমেজ (Image):
ওয়েব পেইজ মানেই কেবল টেক্সট ডকুমেন্ট থাকবে তা কিন্তু নয়। শুধু টেক্সট ডকুমেন্ট দিয়ে ওয়েব পেইজ তৈরি করা হলে তা দেখতে অনেকটা বিরক্তিকর লাগবে। যদি কিছু ইমেজ যোগ করা যায় তাহলে মন্দ হয় না। ওয়েব পেইজকে সুন্দর করার জন্য কিছু ইমেজ যোগ করা দরকার হয়।

আমরা ইমেজ যোগ করার জন্য ইমেজ (img) ট্যাগ ব্যাবহার করে থাকি। নিচের উদাহরণটি দেখলে আরও স্পষ্ট হবেঃ-
এখানে src এট্রিবিউট ব্রাউজারকে ইমেজের অবস্থান নির্দেশ করবে যে ইমেজটি কোথায় আছে। অনেকটা a ট্যাগের মত। উপরে উল্লেখিত নিয়ম অনুযায়ী আমরা ইমেজ ব্যাবহার করতে পারি। শুধু তাই নয় আপনি চাইলে আপনার কম্পিউটার থেকে আপনার ইচ্ছামতো ইমেজ ব্যাবহার করতে পারেন।

এর জন্য আপনার directory তে যেখানে আপনার index.html ফাইলটি আছে ঐখানে একটি নতুন ফাইল করে এর নাম দেন image এবং আপনার ইমেজের নাম দেন example.png তার পর আপনার এডিটরে নিচের দেওয়া কোডের মত লিখে save করেন এবং ব্রাউজারে open করেন দেখবেন আপনার কম্পিউটার থেকে আপনার ওয়েব পেইজে ইমেজ দেখাচ্ছে।
আপনি চাইলে আপনার ইমেজের একটা Size ঠিক করে দিতে পারেন। বিষয়টা হল ইমেজের Size ঠিক না থাকলে ইমেজের Default Size ব্রাউজারে দেখাবে। এই ক্ষেত্রে ইমেজের Size যদি অনেক বড় থাকে তাহলে পেইজটি দেখতে সুন্দর লাগবে না। নিচের উদাহরণের মতো কোডটি লিখলে আপনার ইমেজের Size অনেক সুন্দর লাগবে।


তবে মনে রাখবেন আপনি চাইলে আপনার ইচ্ছামতো আপনার ইমেজের Size নির্দারন করতে পারবেন। আরেকটি জিনিস জেনে রাখেন ইমেজ ট্যাগের কিন্তু কোন শেষ ট্যাগ নাই। এইটা <img/> এইভাবে লিখতে হয়।
আজ এই পর্যন্তই। আগামী দিন অন্য কিছু নিয়ে আবার হাজির হব আপনাদের সামনে।

ততদিন পর্যন্ত ভালো থাকবেন। অবশ্যই কমেন্টে জানাবেন কেমন লাগছে।
মনোযোগ দিয়ে পড়ার জন্য ধন্যবাদ।

।