HTML ও CSS প্রোগ্রামিং ল্যাঙ্গুয়েজ কি এবং এর সকল খুঁটিনাটি বিষয়।

HTML ও CSS  প্রোগ্রামিং ল্যাঙ্গুয়েজ মূলত ওয়েবসাইটের ডিজাইন করার ক্ষেত্রে আমরা ব্যবহার করি HTML ও CSS  প্রোগ্রামিং ল্যাঙ্গুয়েজ মূলত দুইটি আলাদা বিষয়। HTML কে সাধারণত মার্কআপ ল্যাঙ্গুয়েজ বলা হয়ে থাকে।
আর এটি ওয়েবসাইটের কাঠামো তৈরি করতে অর্থাৎ আপনি যদি কোন ঘর নির্মাণ করতে চান সে ক্ষেত্রে যেমন ঘরের কাঠামো আগে নির্মাণ করতে হবে ঠিক একইভাবে ওয়েবসাইটের ক্ষেত্রে HTML ল্যাঙ্গুয়েজ ব্যবহার করতে হবে। CSS প্রোগ্রামিং ল্যাঙ্গুয়েজ নিয়ে আপনাদের সাথে নিচে বিস্তারিত আলোচনা করব।

নিচের যে অংশ থেকে পড়তে চান সেখানে ক্লিক করুনঃ

HTML প্রোগ্রামিং ল্যাঙ্গুয়েজ কি

HTML প্রোগ্রামিং ল্যাঙ্গুয়েজ বলতে মূলত মার্কআপ ল্যাঙ্গুয়েজ কে বোঝায়। HTML প্রোগ্রামিং ল্যাঙ্গুয়েজ এর পূর্ণরূপ হল হাইপার টেক্স মার্কআপ ল্যাঙ্গুয়েজ। HTML কোডিং মূলত ওয়েবসাইট ডিজাইন এর ক্ষেত্রে ব্যবহার করে থাকি। আপনার মনে প্রশ্ন জাগতে পারে HTML প্রোগ্রামিং ল্যাঙ্গুয়েজ কিভাবে ব্যবহার করা হয়ে থাকে? উত্তর হল মূলত আমরা যখন একটি ঘর নির্মাণ করে থাকি ঠিক সে সময় সবার প্রথম কাজ হল তার কাঠামো নির্মাণ করা ঠিক একই ভাবে আপনি যখন কোন ওয়েবসাইট তৈরি করবেন সে ক্ষেত্রে HTML কোডিং এর মাধ্যমে ওয়েবসাইটের কাঠামো নির্মাণ করতে পারবেন।

আপনাদের বোঝার সুবিধার্থে নিচে স্ক্রিনশট এর মাধ্যমে দেখানো হলোঃ
HTML প্রোগ্রামিং ল্যাঙ্গুয়েজ নিয়ে সাধারণভাবে প্র্যাকটিস করার জন্য দুইটা জিনিসের প্রয়োজন হবে। একটি হলো সাবলাইম টেক্সট ্ নামের একটি কোড এপ্পস। এবং এর সাথে আপনাকে আরেকটি কাজ করতে হবে সেটি হল উপরের লাল তীর চিহ্ন দ্বারা যেই sopnobonait.html নামের এক্সটেনশন তৈরি করা রয়েছে সেটি আপনার পিসিতে তৈরি করতে হবে। এরপরে কোডিং অ্যাপস এ এসে আপনার পিসিতে করা এক্সটেনশন ওপেন করুন এবং সেখানে <html> টাইপ করে ইন্টার চাপুন তাহলে এইচটিএমএল৫ এর মূল কাঠামো চলে আসবে।

HTML প্রোগ্রামিং ল্যাঙ্গুয়েজ এর ট্যাগ পরিচিতি

মূলত HTML প্রোগ্রামিং ল্যাঙ্গুয়েজ করার জন্য প্রথম শর্ত হলো এর প্রত্যেকটি ট্যাগ সম্পর্কে বিস্তারিত জানতে হবে। যেমন নিচের ছবিটা আমরা দেখতে পাচ্ছি এইচটিএমএল এর কোডিং এ হেড ট্যাগের মধ্যে আমাদের ওয়েবসাইটটির নাম লিখেছি এবং সেটির ডান পাশে ক্রোম ব্রাউজারে সবার উপরে দেখাচ্ছে। আর যখন এইচটিএমএল কোডিং এর ক্ষেত্রে বডি ট্যাগ এর মধ্যে কোন কিছু লিখছি তখন সেটি আউটপুট হিসেবে ক্রোম ব্রাউজারে বডি সেকশনে দেখাচ্ছে।
 
HTML প্রোগ্রামিং ল্যাঙ্গুয়েজ জানার জন্য অবশ্যই আপনাকে ট্যাগ সম্পর্কে বিস্তারিত জানতে হবে। যেমন আমরা যখন বাংলা ভাষা শিখি তখন ক খ বর্ণমালার সঙ্গে পরিচিতি হতে হয় আবার ইংরেজি ভাষার ক্ষেত্রে এবিসিডি আলফাবেট এর সঙ্গে পরিচিত হতে হয় ঠিক একই ভাবে HTML প্রোগ্রামিং ল্যাঙ্গুয়েজ এর ক্ষেত্রে ট্যাক্স সম্পর্কে বিস্তারিত জানতে হয়।

HTML প্রোগ্রামিং ল্যাঙ্গুয়েজ এর ট্যাগসমূহ

HTML প্রোগ্রামিং ল্যাঙ্গুয়েজ এর অনেক ট্যাগ রয়েছে আপনাদের বোঝানোর জন্য আমি কিছু ট্যাগের উদাহরণ নিচে তুলে ধরলাম।

<h2>,<h3>,<h4> এইগুলো হল হেডিং ট্যাগ অর্থাৎ এগুলো দ্বারা বোঝাবে আপনি যখন কোন প্যারাগ্রাফ লিখবেন তার শুরুতে প্যারাগ্রাফের যেই টপিকটা লেখা হয় বড় অক্ষরের মাধ্যমে সেটিকেই বলা হচ্ছে হেডিং| অর্থাৎ এইচটিএমএল প্রোগ্রামিং এর ক্ষেত্রে আপনি হেডিং ট্যাগ এর মধ্যে যেটা লিখবেন সেটিকে আউটপুট হিসাবে অনেক বড় আকারে দেখাবে নিচে একটি স্ক্রিনশট এর মাধ্যমে আপনাদের সেটি বোঝানো হলো।

<p> HTML প্রোগ্রামিং ল্যাঙ্গুয়েজ এর ক্ষেত্রে এই ট্যাগের ভিতরে কোন কিছু লিখলে সেটির আউটপুট প্যারাগ্রাফ আকারে পাওয়া যায়।

<br> এই ট্যাগ দ্বারা আমরা লাইন ব্রেক করে থাকি অর্থাৎ যখন একটি লাইন শেষ করে দ্বিতীয় আরেকটি লাইন থেকে লেখা শুরু করব সে সময় এই ট্যাগ ব্যবহার করব।

HTML প্রোগ্রামিং ল্যাঙ্গুয়েজ এর টেক্সট ট্যাগ

মূলত এই ট্যাগগুলো ব্যবহার করা হয়ে থাকে লেখার ডিজাইনের ক্ষেত্রে। নিচে প্রত্যেকটি ট্যাগের সাথে ডান পাশে কোন ট্যাগের কি কাজ সেটি বলা হলো।

<b> - Blod text
<strong> - Imporant text
<i> - Italic text
<mark> - Mark text
<del> - Delet text
<small> - small text
<ins> - inserted text
অর্থাৎ ওপরে যেই ট্যাগগুলো নিয়ে আলোচনা করা হলো এগুলোর কোনটার কাজ লেখাকে মোটা করা আবার কোনটা ইটালি লেখা করবে অথবা কোনটার কাজ লেখা ডিলিট করা যা উপরে প্রত্যেকটি ট্যাগের সঙ্গে ডান পাশে উল্লেখ করা হয়েছে।

CSS  প্রোগ্রামিং ল্যাঙ্গুয়েজ কি

CSS  প্রোগ্রামিং ল্যাঙ্গুয়েজ হল যখন আমরা এইচটিএমএল কোডিং এর মাধ্যমে ওয়েবসাইটের কাঠামো নির্মাণ করি কিন্তু সেটিতে পূর্ণাঙ্গ রূপ পায় না। অর্থাৎ একটি ঘরের কাঠামো নির্মাণ করলেই সম্পূর্ণ কাজ সমাপ্তি ঘটে না ঠিক একই ভাবে ওয়েবসাইটের কাঠামোর নির্মাণ করতে যেমন এইচটিএমএল কোডিং করা হয় ঠিক একইভাবে CSS  প্রোগ্রামিং ল্যাঙ্গুয়েজ এর মাধ্যমে পাঠানোর উপরে রং আলাদা আলাদা ডিজাইন করে থাকে। এক কথায় বলতে গেলে CSS  প্রোগ্রামিং ল্যাঙ্গুয়েজ এর মাধ্যমে আমরা ওয়েবসাইটের কাঠামোকে অনেক আকর্ষণীয় করে তুলতে সক্ষম হয়।

CSS এট্রিবিউট এর ব্যবহার

CSS এট্রিবিউট হল এমন একটি ল্যাংগুয়েজ প্রক্রিয়া যার মাধ্যমে আমরা html এ যে কোডিংগুলো করেছিলাম বা এই ল্যাঙ্গুয়েজ এর মাধ্যমে যে লেখাগুলো লিখেছিলাম সেগুলোর রং অথবা ব্যাকগ্রাউন্ড কালার সমস্ত কিছু চেঞ্জ করতে পারবো CSS এট্রিবিউট এর প্রপার্টি ব্যবহার করে নিচে একটি স্ক্রিনশট এর মাধ্যমে ভালো করে বোঝানো হলো।
ওপরের এই ছবিটিতে আমরা দেখতে পাচ্ছি এইচ টু ট্যাগ এর মধ্যে স্টাইল নামের সেকশনে কালার প্রপার্টি জব করা হয়েছে যার ফলে আউটপুট হিসাবে হেডিং এর কালার চেঞ্জ হয়েছে। অর্থাৎ আপনি যদি ওয়েবসাইটে CSS এট্রিবিউট এর ব্যবহার করতে চান তাহলে অবশ্যই আপনাকে আগে এইচটিএমএল মার্কআপ ল্যাঙ্গুয়েজ ব্যবহার করতে হবে। এরপরে আপনি সিএসএস প্রোগ্রামিং ল্যাঙ্গুয়েজ ব্যবহার করতে পারবেন।

 CSS  প্রোগ্রামিং ল্যাঙ্গুয়েজ এর সকল কাজ

 CSS  প্রোগ্রামিং ল্যাঙ্গুয়েজ এর ব্যবহার করে আপনি পুরো ওয়েবসাইটের ডিজাইন চেঞ্জ করে দিতে পারবেন। এর মধ্যে উল্লেখযোগ্য কিছু কাজ হল ওয়েবসাইটে সূচিপত্র তৈরি করা, হেডিং এর ব্যাকগ্রাউন্ড পরিবর্তন করা, যেকোনো ধরনের বাটন তৈরি করতে সক্ষম হবেন অর্থাৎ এক কথায় বলতে গেলে আপনি আপনার ওয়েবসাইট কে সম্পূর্ণ আপনার ইচ্ছামত যদি ডিজাইন করতে চান তাহলে আপনাকে সিএসএস প্রোগ্রামিং ল্যাংগুয়েজ এর সকল প্রপার্টির সম্পর্কে বিস্তারিত জানতে হবে।

আমাদের কথা

HTML ও CSS  প্রোগ্রামিং ল্যাঙ্গুয়েজ নিয়ে গবেষণা করতে গেলে আমাদের সব থেকে বেশি প্রয়োজন হয় এইচটিএমএল এর ট্যাগিং এবং সিএসএস প্রোগ্রামিং ল্যাঙ্গুয়েজ এর প্রোপার্টি। আপনি যদি এই দুইটি সম্পর্কে বিশেষ জ্ঞান অর্জন করতে সক্ষম হন তাহলে আপনি একটি ওয়েবসাইটের সম্পূর্ণ ডিজাইন করতে পারবেন। এর সম্পর্কে আমরা আরো বিস্তারিত ভাবে অন্য কোন আর্টিকেলে আলোচনা করব। যদি আপনার কোন প্রশ্ন থাকে তাহলে কমেন্টে জানান।

এই পোস্টটি পরিচিতদের সাথে শেয়ার করুন

পূর্বের পোস্ট দেখুন পরবর্তী পোস্ট দেখুন
এই পোস্টে এখনো কেউ মন্তব্য করে নি
মন্তব্য করতে এখানে ক্লিক করুন

স্বপ্নবোনা আইটির নীতিমালা মেনে কমেন্ট করুন। প্রতিটি কমেন্ট রিভিউ করা হয়।

comment url