Rank AI Studio

এইচটিএমএল টিউটোরিয়াল | ভূমিকা - Part: 1
---------------------------------------------------------------------------------
এইচটিএমএল (HTML)এর অর্থ হচ্ছে Hyper Text Markup Language, এটা কোনও প্রোগ্রামিং ল্যাংগুয়েজ নয়, এটি হচ্ছে একটি মার্কআপ ল্যাংগুয়েজ।

এখন প্রথমে একটু জেনে নিই প্রোগ্রামিং ল্যাংগুয়েজ কি, আর মার্কআপ ল্যাংগুয়েজই বা কি?

মার্কআপ ল্যাংগুয়েজঃ মার্কআপ ল্যাংগুয়েজ হল এমন একটি কম্পিউটার ল্যাংগুয়েজ, যা মুলত একটি ডকুমেন্টের মধ্যে ট্যাগ ব্যবহার করে বিভিন্ন এলিমেনটকে ডিফাইন করে। এটি হিউম্যান রিডেবল ল্যাংগুয়েজ অর্থাৎ আমরা এই ল্যাংগুয়েজটি পড়তে পারবো বা বুঝতে পারবো। একটু সহজ ভাবে বললে, এ মার্কআপ ল্যাংগুয়েজ সাধারণত স্ট্যান্ডার্ড বা আদর্শ শব্দ ব্যবহার করে, কখনই এটি প্রোগ্রামিংয়ের ন্যায় জটিল Syntax ব্যবহার করেনা। সাধারণত মার্কআপ ল্যাংগুয়েজের এলিমেনট গুলো নেওয়া হয়েছে আমাদের ব্যবহিত এবং পরিচিত শব্দগুলো থেকে, তবে এখানে শুধু পার্থক্য হল এ শব্দগুলোকে '< >' এবং '' ট্যাগ দ্বারা ক্লোজ করে ব্যবহার করা হয়। যেন কম্পিউটার এই এলিমেনট গুলো পড়তে পারে এবং উক্ত টেক্সট কে প্রদর্শন করতে পারে, যা আমরা ব্রাউজারের মাধ্যমে দেখতে পারি।

উদাহরণ স্বরূপঃ This is a paragraph of text written in HTML
এটি যদি আমরা এডিটরে লিখি, তবে কম্পিউটার ট্যাগের মধ্যকার কন্টেন্ট পড়বে এবং তা প্রদর্শন করবে। প্রশ্ন আসতে পারে কম্পিউটার কেন শুধু ট্যাগ দিয়ে মোড়ানো এমন টেক্সট প্রদর্শন করে । বিষয়টি ব্যাখ্যা করা যায় এভাবে, আমরা অনেক সময় আমাদের পড়ার বইয়ে গুরুত্বপূর্ণ শব্দগুলোকে মার্ক করতে লাল কলম দিয়ে আন্ডারলাইন দেই, এটা আমরা এই জন্য করি কারণ আশে-পাশের শব্দগুলো থেকে মার্ক করা শব্দটির গুরুত্ব আমাদের কাছে অনেক বেশি, ঠিক তেমনি মার্কআপ ট্যাগ ব্যবহার করেও কম্পিউটার কে জানানো হয় কোন এলিমেনটগুলো আমি প্রদর্শন করাতে চাচ্ছি ওয়েব পেজে। আর তাই কম্পিউটার তখন সে কমান্ড অনুসরণ করে।

মার্ক আপ ল্যাঙ্গুয়েজ মোট তিনটিঃ
HTML, XHTML এবং XML
তবে HTML, XHTML সেইম মার্কআপ ল্যাঙ্গুয়েজ কিন্তু এখানে পার্থক্য হল XHTML, HTML এর তুলনাতে অনেক বেশি Restricted, যেমন শুধু HTML লেখার সময় এমন অনেক এলিমেনট রয়েছে যেগুলো লিখতে ending tag না ইউজ করলেও চলে, কিন্তু XHTML লেখার সময় মার্ক আপ ল্যাঙ্গুয়েজ লেখার সকল নিয়ম মেনে চলতে হবে। আর তাই প্রত্যেক এলিমেনট লিখতে অবশ্য তা ending tag ব্যবহার করে শেষ করতে হবে। যেমন ইমেজ লেখার ক্ষেত্রে HTML এ শুধু লিখলেই চলে কিন্তু XHTML এর ক্ষেত্রে অবশ্যই ending tag ইউজ করে লিখতে হবে এভাবে ।

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

তারপর জাভাস্ক্রিপ্টের পালা, জাভাস্ক্রিপ্ট শিখে এর এপ্লিকেশন ব্যবহার করলে তোমার ঐ ওয়েব পেজটি ডাইনামিক হওয়া শূরু হল। সবশেষে পিএইচপি + ডেটাবেস শিখলে তুমি পূর্নাঙ্গ ডেটাবেস Driven ওয়েবসাইট তৈরী করতে পারবে।

যে জিনিস লাগবে এইচটিএমএল শিখতে (অর্থ্যাৎ এইচটিএমএল কোড কোথায় লিখবে)

আমরা আমাদের ডিফল্ট নোটপ্যাড দিয়ে কোড লেখা শুরু করতে পারি, তবে সবচেয়ে ভালো হবে Notepad++ নামক এডিটর টি ব্যবহার করা। কারণ উইন্ডোজে বাই ডিফল্ট যে নোটপ্যাড টি থাকে সেটা দিয়ে কোড লেখা খুব কষ্টকর এবং এতে কোনও মজা বা সুবিধা কিছুই পাবেনা। তবে এরকমই একটা হালকা নোটপ্যাড আছে নাম "Notepad++" এখানে প্রচুর সুবিধা পাবে এবং এটা প্রফেশনাল কোড লেখার জন্য নি:সন্দেহে ব্যবহার করতে পারবে। এই যে ডাউনলোড লিংক- https://notepad-plus-plus.org/download/v7.5.6.htmlডাউনলোড করে এটি ইন্সটল করতে হবে। তারপর এই এডিটর ইউজ করে কোড লিখতে হবে।

এইচটিএমএল শিখতে যে শব্দগুলি ভালভাবে জানা দরকার-

এইচটিএমএল এলিমেন্ট (Element)
এইচটিএমএল ট্যাগ (Tag)
এইচটিএমএল অ্যাট্রিবিউট (Attribute)

এ শব্দগুলি সবসময় আসবে এবং এগুলির পরিষ্কার ধারনা থাকতে হবে।

HTML, XHTML এবং HTML5

HTML এর সর্বশেষ ভার্সন হচ্ছে HTML5। এইচটিএমএল ৫ এ এক্সএইচটিএমএল সকল নিয়ম অনুসরন করা হয়। কাজেই HTML 5 শিখলেই আগের ভার্সনগুলি অটোমেটিক শেখা হয়ে যাবে। তাই আমরাও ঐভাবে টিউটোরিয়ালগুলি দেব।

* W3C নামের এই সংস্থাটি HTML তৈরী এবং ম্যানেজমেন্ট করে।

* HTML 5 মুলত HTML ই তবে এখানে নতুন নতুন অনেক ট্যাগ এবং নিয়ম যুক্ত হয়েছে যেগুলির বর্ননা আমরা পরবর্তী টিউটোরিয়ালগুলিতে প্রয়োজন অনুসারে দিয়ে দেব।

Notepad++ v7.5.6 - Current Version Download Notepad++