HTML (এইচটিএমএল ) সম্পর্কে জানুন, শিখুন এবং হয়ে উঠুন একজন দক্ষ ওয়েব ডেভেলপার

HTML (এইচটিএমএল )কি?

HTML (এইচটিএমএল) এর মাধ্যমে একটি ওয়েব পেজ এর মূল কাঠামো গঠন করা হয় । এটি একটি মার্ক-আপ ল্যাংগুয়েজ । যার পূর্ণরূপ হচ্ছে Hyper Text Markup Language (হাইপার টেক্সট মার্কআপ ল্যাংগুয়েজ), এটি কোন প্রোগ্রামিং ল্যাংগুয়েজ নয় । এটিকে Markup Language (মার্কআপ ল্যাংগুয়েজ) বলার কারণ হলঃ এটি কত গুলো Markup (মার্কআপ) ট্যাগের সমন্বয়ে গঠিত, আর Markup (মার্কআপ) ট্যাগের কাজ হল ওয়েব পেজে বিভিন্ন ধরনের এলিমেন্ট কীভাবে প্রদর্শিত হবে তা নির্দেশ করা, একটি ওয়েব পেজের এলিমেন্ট হল যথাক্রমেঃ ইমেজ, টেক্সট, ভিডিও, অডিও ইত্যাদি ।

HTML (এইচটিএমএল ) কেন প্রয়োজনঃ

যেহেতু HTML (এইচটিএমএল ) একটি ওয়েব পেজ এর মূল কাঠামো গঠন করে । সেহেতু ওয়েব ডিজাইন ও ডেভেলপমেন্ট শিখতে HTML (এইচটিএমএল ) এর বিকল্প নেই ।

HTML (এইচটিএমএল ) এর ইতিহাসঃ

ইউরোপীয় বিজ্ঞানী টিম বারনাস-লী ১৯৮৯ সালে ইউরোপের পাটিক্যাল ফিজিক্স ল্যাবরেটরির একজন কম্পিউটার বিশেষজ্ঞ থাকাকালীন ওয়েব নিয়ে গবেষণা করে ওয়েব তৈরি করেন। এর পর ১৯৯০ সালের দিকে তিনি HTML(এইচটিএমএল) নিয়ে গবেষণা শুরু করেন, HTML (এইচটিএমএল) তৈরির প্রাথমিক উদ্দেশ্য ছিল বৈজ্ঞানিক গবেষণার তথ্য-উপাত্তগুলো দ্রুত সময়ে পৃথিবীর বিভিন্ন স্থানে আদান-প্রদান করা এবং এই সনের মধ্যেই তিনি HTML(এইচটিএমএল)  ল্যাংগুয়েজ তৈরির কাজ সম্পন্ন করেন । একই সালে NCSA কর্তৃক ডেভেলপকৃত মোজাইক ব্রাউজারের মাধ্যমে HTML(এইচটিএমএল) এর পরিচিতি লাভ করে । তাছাড়া তিনি, অলাভজনক জনসেবামূলক প্রতিষ্ঠান ও ওয়ার্ল্ড ওয়াইড ওয়েবের তত্ত্বাবধায়ক ওয়ার্ল্ড ওয়াইড ওয়েব কনসোটিয়াম (W3C) এর ডিরেক্টর । W3C (ওয়ার্ল্ড ওয়াইড ওয়েব কনসোটিয়াম) কর্তৃক প্রথম ডেভেলপকৃত HTML3.2 প্রকাশিত হয় ১৯৯৭ সালের জানয়ারিতে ও একই সনের শেষের দিকে প্রকাশ হয় HTML4.2 এবং W3C (ওয়ার্ল্ড ওয়াইড ওয়েব কনসোটিয়াম) কর্তৃক  HTML(এইচটিএমএল) এর সর্বশেষ ভার্সন HTML5 প্রকাশিত হয় ২০১০ সালে।

এইচটিএমএল শেখার প্রস্ততি:

এইচটিএমএল শিখতে পূর্বে তেমন কোন প্রস্ততির প্রয়োজন নেয় । শুধু কম্পিউটার সম্বন্ধে প্রাথমিক ধারণা থাকলেই চলবে । এইচটিএমএল শেখা খুবই সোজা, কথা না বাড়িয়ে চলুন শুরু করা যাক । প্রথমে আপনার কম্পিউটারের “Start” বাটন চেপে “Control Panel” এ যান এবং সেখান থেকে “Folder Options” গিয়ে “View”মেনুতে নিচের দিকে লিখা আছেঃ “Hide extensions for know file types” এটি থেকে টিক চিহ্নটি তুলে দিন এবং ওকে বাটনে ক্লিক করে সেভ করে নিন তাহলে আপনার কম্পিউটারের সকল ফাইলের এক্সটেনশন দেখা যাবে । যেমনঃ এখন যদি আপনি একটি কম্পিউটার সফটওয়্যার এর এক্সটেনশন দেখেন তাহলে দেখা যাবে এটি আসছে xxxxx.exe এই যে exe এটাই হল এক্সটেনশন । যাই হোক তার পর হল প্রোগ্রাম লেখার প্রস্ততি, এইচটিএমএল প্রোগ্রাম লিখতে তেমন বিশেষ কোন জিনিসের প্রয়োজন নেই । এটি শিখতে টেক্সট এডিটর যেমনঃ নোটপ্যাড(Notepad) হলেই চলে আর এটি সকল কম্পিউটারে ডিফল্টভাবে দেয়া থাকে । এবং সাথে আপনার প্রয়োজন হবে একটি ইন্টারনেট ব্রাউজারের যেমনঃ মজিলা ফায়ারফক্স, গুগল ক্রোম, অপেরা, কমোডো ড্রাগন ইত্যাদি । তাছাড়া কোডিং আরও সহজ করতে ব্যবহার করতে পারেন অ্যাডভান্স টেক্সট এডিটর যা আপনার এইচটিএমএল শেখাকে অতি সহজ করে দিবে । এটি ব্যবহারে উপকার গুলো বোঝতে পারবেন । নোটপ্যাড++ (Notepade++) এখান থেকে ডাউনলোড করতে পারেন । 

এইচটিএমএল এর গঠন:

এইচটিএমএল এর প্রধান দু’টি অংশ থাকে একটি হল Head অংশ যেটি <head> দিয়ে শুরু এবং </head> দিয়ে শেষ হয় । আর দ্বিতীয়টি হল Body যা <body> দিয়ে শুরু এবং </body> দিয়ে শেষ হয় । আবার এই দু’টি কে <html> </html> এর ভিতর রাখতে হয় । যেমনঃ

<html>

<head>

</head>

<body>

</body>

</html>

আবার হেড এর ভিতর টাইটেল দিতে হবে এবং বডিতে ডেসক্রিপশন দিতে হবে চলুন দেখিঃ

<html>

<head>

<title> This is my first web title </title>

</head>

<body>

This is my first web page. And 2nd HTML class.

</body>

</html>

এবার কোডটুকু index.html নামে সেভ করে যেকোন ব্রাউজারে ওপেন করুন। 

এইচটিএমএল ট্যাগ কি?

ট্যাগ হল এইচটিএমএল এর প্রাণ অর্থাৎ ট্যাগই হল এইচটিএমএল এর সবকিছু । আর এইচটিএমএল শেখার উদ্দেশ্য হল ট্যাগ সম্পর্কে বিস্তারিত জানা, তাই এইচটিএমএল এ ট্যাগ এর গুরুত্ব অপরিসীম । এইচটিএমএল ট্যাগ গুলো (<) দিয়ে শুরু হয় এবং (>) দিয়ে শেষ হয় এটি হল একটি ট্যাগ তবে এই সম্পূর্ণ ট্যাগটি শেষ করতে শুরু (<>) এবং </> দিয়ে শেষ করতে হবে । শুরু আর শেষ ট্যাগ ছাড়াও রয়েছে ধারণকৃত ট্যাগ যেমনঃ <html> এখানে html হল ধারণকৃত ট্যাগ । তবে ট্যাগগুলো ব্রাউজারে প্রদর্শিত হবে না । যেমনঃ নিচের কোড টুকু পরীক্ষা করা যাক

<html>

<head>

<title> This is my first web title </title>

</head>

<body>

This is my first web page. And 2nd HTML class.

</body>

</html>

সতর্কীকরণঃ ট্যাগগুলো সবসময় ছোট হাতের বর্ণে লিখবেন । 

এইচটিএমএল ট্যাগ এর তালিকাঃ

<html> </html> এইচটিএমএল ডকুমেন্ট নির্দেশ করে ।

<head> </head>  এইচটিএমএল হেড অংশ নির্দেশ করে ।

<title> </title> এইচটিএমএল

<body></body> ডকুমেন্টের শিরোনাম তথা টাইটেল নির্দেশ করে ।

<h></h> হেডার অংশ নির্দেশ করে ।

<p> </p> টেক্সট এর প্যারাগ্রাফ নির্দেশ করে ।

<b></b> বোল্ড টেক্সট নির্দেশ করে ।

<i> </i> ইতালিক টেক্সট নির্দেশ করে ।

<u> </u> আন্ডারলাইন টেক্সট নির্দেশ করে ।

<a> </a> লিংক টেক্সট নির্দেশ করে ।

<font></font> ফন্ট এর প্যারামিটার নির্দেশ করে ।

<img/> ইমেজ ট্যাগ নির্দেশ করে ।

<br/> লাইন ব্রেক নির্দেশ করে ।

উপরে কিছু ট্যাগ আছে যেগুলো শুরু ট্যাগ আছে কিন্তু শেষ ট্যাগ নাই । যেমনঃ <img/> এগুলো কোন ইলিমেন্ট ধারণ করে না ।

Previous
Next Post »

পোস্ট সম্পর্কিত সমস্যার জন্য মন্তব্য দিন।ডাউনলোড লিঙ্ক এ সমস্যা জন্য ইনবক্স করুন Aimzworld007
ConversionConversion EmoticonEmoticon

Thanks for your comment