HTML

HTML কী?
HTML শব্দের পূর্ণ রূপটি হলো- Hyper text Markup Language| HTML ডকুমেন্ট হলো সাধারণ টেক্সট ফাইলের মতোই। HTML ফাইলে টেক্সট ছাড়া কোনো শব্দ, স্থির ছবি, এ্যানিমেশন ইত্যাদি কিছুই থাকে না। এর সাথে উল্লিখিত প্রয়োজনীয় মিডিয়া ফাইলের নির্ধারিত স্থানে স্থানে লিঙ্ক করে দিতে হয়। মনে করুন, আপনি একটি HTML ফাইলে একাট দেশের বিবরণ লিখছেন। এবার এখানে ঐ দেশের মানচিত্রের ছবি যোগ করতে চান। সে ক্ষেত্রে আগে ঐ দেশের মানচিত্রটি একটি ফাইল হিসাবে রেখে HTML টেক্সট ফাইলের সাথে লিঙ্ক করে সেভ করুন। এরপর HTML ফাইল পড়তে পারে এমন কোনো সফটওয়্যারের (যেমন মজিলা ফায়ারফক্স, ইন্টারনেট এক্সপ্লোরার, গুগল ক্রোম ইত্যাদি) সাহায্যে উক্ত HTML টেক্সট ফাইলটি খুলুন। দেখবেন, টেক্সট ফাইলটির একটি জায়গায় ঐ দেশের মানচিত্রের পাথ-সহ ফাইল নাম আন্ডারলাইনযুক্ত নীল রঙ-এ চিহ্নিত হয়ে গিয়েছে। এবার উক্ত আন্ডারলাইনযুক্ত নীল রঙে মাউস দিয়ে ক্লিক করলে মানচিত্রটি দেখা যাবে। এভাবে একটি টেক্সট ফাইলকে Markup দ্বারা নির্দেশিত করে প্রতিভাত করা হয় বলে এর এর নামকরণ করা হয়েছে Hypertext Markup Language (HTML )।

HTML শিক্ষার জন্য যা যা লাগবেঃ
HTML শিক্ষার জন্য শিক্ষার্থীকে কমপিউটার পরিচালনায় (অপারেটিং সিস্টেম) উইন্ডোজ ভিত্তিক যে কোন ওয়ার্ড প্রসেসর চালানোর পূর্ব অভিজ্ঞতা থাকতে হবে। শিক্ষার্থীদের কমপিউটারে অবশ্যই প্রয়োজনীয় সফটওয়্যার থাকতে হবে। যেমনঃ-

১। এডিটরঃ
প্রথমেই প্রয়োজন হবে HTML এর কমান্ড সমূহ লেখার জন্য একটি এডিটর। এই এডিটর অবশ্য অপারেটিং সিস্টেমের সঙ্গে বিল্ট-ইন অবস্থাতেই পাওয়া যায়। এডিটর হিসেবে ঊইন্ডোজের জন্য নোটপ্যাড ছাড়াও সহজে কাজ করার জন্য ব্যবহার করতে পারেন বিভিন্ন HTML এডিটর। যেমনঃ- Macromedia Dreamweaver, MS FrontPage ইত্যাদি।
২। ব্রাউজারঃ
HTML এর পেইজ দেখার জন্য প্রয়োজন হবে ব্রাাউজার। ব্রাউজার হলো ওয়েব পেইজ দেখার জন্য ব্যবহৃত এক ধরনের সফটওয়্যার। বর্তমান সময়ের জনপ্রিয় ব্রাউজার হলো- মজিলা ফায়ারফক্স, ইন্টারনেট এক্সপ্লোরার ও গুগল ক্রোম।

HTML ট্যাগের ব্যবহারঃ
HTML ফাইল তৈরি করা হয় কিছু ট্যাগ ও তার এ্যাট্রিবিউটের সমন্বয়ে| আর প্রতিটি এ্যাট্রিবিউটের সাথে সুনির্দিষ্ট মান দিতে হয়। তাছাড়া ট্যাগের বানান সঠিকভাবে লিখতে হয়। অধিকাংশ ক্ষেত্রে ট্যাগ একবার আরম্ভ করলে তার কার্যক্রম শেষ হলে ট্যাগের সমাপনী দিতে হবে। এর জন্য স্ল্যাস ( / ) চিহ্ন বসে। অর্থাৎ শুরুর ক্ষেত্রে ট্যাগ

<B> এবং সমাপনীর ক্ষেত্রে ট্যাগ  </B>

তবে সমাপনী ট্যাগ কোন কোন ক্ষেত্রে ব্যবহার করার প্রয়োজন পড়ে না। যেমন আনুভূমিক রেখার ক্ষেত্রে ব্যবহৃত

<HR>

ট্যাগের জন্য সমাপনী ট্যাগের প্রয়োজন হয় না।

প্রথম HTML প্রোগ্রাম
এডিটরে প্রোগ্রামটি লিখুন

<html>
     <head>
            <title>Exa-1(a)</title>
     </head>

    <body>
           This is my first HTML Program
    </body>
</html>

ব্রাউজারে দেখা যাবে

ট্যাগ ও এট্রিবিউট সাজিয়ে লিখার নিয়ম :
প্রতিটি ট্যাগ ও এ্যাট্রিবিউট সঠিক বানানে এবং বিধিবদ্ধ রীতিতে বিন্যাস্ত করতে হবে কিন্তু পারত পক্ষে প্রতিটি ট্যাগ লিখবেন পৃথক পৃথক লাইনে। এতে বড় প্রোগ্রামের সংশোধনের ক্ষেত্রে সুবিধা পাওয়া যাবে। যেমন- Exa-1(a)-তে যে প্রোগ্রামটি লিখেছি তা যদি নীচের মতো করে সাজান, তাহলে দেখবেন আপনি নিজেই বিরক্ত হচ্ছেন।

<html><head><title> Exa-1(a)</title></head><body> This is my first HTML line </body></html>

উপরের এই পদ্ধতিতে প্রোগ্রাম লিখলে, কেমন হ-য-ব-র-ল দেখাবে কিন্তু Exa-1(a)-তে যেভাবে লিখেছি তা সুন্দর দেখাবে এবং প্রয়োজনে সহজেই এই প্রোগ্রামকে পরিবর্তন করা সম্ভব হবে।



ট্যাগ ও এ্যাট্টিবিউট অনুসারে লাইনের বিন্যাস :
একটি ট্যাগের অধীনে যখন একাধিক ট্যাগের সমন্বয় করে কোন কোড লিখতে হলে বিভিন্ন ধাপ অনুসরণ করে ট্যাগগুলো লিখতে হয়। নীচের উদাহরনটি লক্ষ্য করুন।

<html>
      <head>
            <title>Exa-1(b)...LIST<title>
      </head>
     <body>
            <ol Start=5>
               <li> Starting number</li>
               <li> Next number</li>
            </ol>
       </body>
</html>

HTML এর ক্ষেত্রে Font Family Property নির্ধারণ :
HTML এর ক্ষেত্রে Font Family Property নির্ধারিত হবে Font ট্যাগ ও তার FACE এ্যাট্টিবিউট দ্বারা। ধরুন, আপনি আপনার টেক্সটে Verdana ফন্ট ব্যবহার করতে চান, তাহলে এডিটরে প্রথমে Font ট্যাগ লিখুন, এরপর এর FACE এট্রিবিউট লিখে সমান চিহ্ন (=) ব্যবহার করে Verdana লিখুন। যেমন:

<html>
      <head>
             <title>Exa-2(a)...Font Family Property</title>
      </head>

     <body>
           <Font Face=”Verdana”>This is Verdana Text</Font>
     </body>
</html>

Leave a Reply