HTML Versions
Web এর জগতে HTMLএর অনেকগুলি ভার্সন রয়েছে। প্রায়ই শুনে থাকবেন HTML, XHTML, XML, CSS, XSLT ইত্যাদি। অনেকে না জেনে না বুঝেই বলে থাকেন XHTML এসে গ্যাছে এখন আর HTML শেখার দরকার নাই। অনেকে আবার বলে থাকেন XML চলে এসেছে HTML দরকার নাই, এজন্য HTML এর ভার্সন সংক্রামত্ম ধারণা থাকতে হবে। Web এর ক্ষেত্রে বর্তমানে অধিক ব্যবহৃত হচ্ছে HTML-5 ও CSS-3 এ ব্যাপারে আমরা বিসত্মারিত আলোচনা করবো। আপাতত HTML ভার্সন জানার জন্য নিচের টেবিলটি লক্ষ্য করুন। তবে XML বিষয়টি সম্পূর্ণ আলাদা এটি কোন Data প্রদর্শন করতে পারে না। এটি ডাটা সংরক্ষণ এবং পরিবহনের কাজ করে থাকে। এটির Extention নাম হবে XML। তবে এতে Data সংরক্ষণ করে পরে HTML এ কল করে প্রদর্শন করা হয়।
Version | Year |
HTML | 1991 |
HTML+ | 1993 |
HTML 2.0 | 1995 |
HTML 3.2 | 1997 |
HTML 4.01/XHTML 1.0 | 1999 |
XHTML 1.0 | 2000 |
HTML5 | 2012 |
XHTML5 | coming |
এই বইয়ের কোডিং এর ভার্সন
এই বইয়ের কোডিংগুলি মূলতঃ HTML 5 এর উপর নির্ভর করে লেখা। তবে অনেক Element HTML 1, HTML 2 এবং HTML 3-2 তে সাপোর্ট করবে। যেগুলি করবে না সেগুলির জন্য আলাদা Note দেওয়া আছে। HTML 5 ও HTML 4 এর (XHTML 1) এর কোডিং মূলতঃ কাছাকাছি সামান্য কিছু পরিবর্তন আছে। সেগুলি Note দেওয়া আছে। আর HTML 5 এ যে বিষয়গুলি নতুন সংযোজন করা হয়েছে এখানে সেগুলি আলোচনা করা হয়েছে।
তবে প্রশ্ন হচ্ছে HTML 5 এর উপর সরাসরি লিখলেই চলতো। কিন্তু আমার মনে হয় সমসত্ম ভার্সন সম্বন্ধে জানার প্রয়োজন আছে। বিভিন্ন Freelancing সাইটে Outsourcing এর জন্য এ রকম অনেক কাজ পাওয়া যায়, যেমন: ইউজাররা তাদের পুরাতন সাইটকে আপগ্রেড করতে বলেন। এক্ষেত্রে পুরাতন কোড সম্বন্ধে ধারণা থাকার দরকার আছে। আবার অনেকে বলে থাকেন আমার সাইটটি IE 10 এ সাপোর্ট করে কিন্তু IE 7, 8, 9 এ সাপোর্ট করে না, আপগ্রেড করতে হবে। এক্ষেত্রে এবিষয়ে ধারনা থাকার দরকার আছে। ভবিষ্যতে যারা Web কে প্রফেশন করতে চান তারা অবশ্যই নতুন ভার্সনে (HTML 5) কোডিং করবেন। তবে পুরাতন কোডিং সম্বন্ধে ধারনা রাখবেন।
HTML 5 এর সমসত্ম বিষয় জানার জন্য ASP, JavaScript ও PHP’র সম্বন্ধে ধারণা থাকার দরকার আছে। এজন্য আমাদের প্রকাশিত HTML 5, CSS3, Xhtml, XML, PSD to HTML বইটি সংগ্রহ করে নিন।
HTML Structure
HTML ট্যাগ ব্যবহার করে প্রোগ্রাম লেখা হয়। প্রতিটি ট্যাগ শুরু হয় একটি <(Less than) চিহ্ন এবং >(Grater than) চিহ্ন দিয়ে। এই দুইটি চিহ্ন < > দিয়ে ট্যাগ শুরু হয় এবং এই দুইটি চিহ্নসহ প্রথম চিহ্নের সাথে একটি ব্যাক স্লাস (/) চিহ্ন দিয়ে ট্যাগ শেষ করা হয়, যেমন </>
সর্ম্পুন একটি ট্যাগ যেমন : <html>………</html>
প্রতিটি HTML ফাইল <html> ট্যাগ দিয়ে শুরু করাটা এবং </html> ট্যাগ দিয়ে শেষ করা বাধ্যতামূলক। html ট্যাগের মধ্যে আবার head এবং body সেকশন থাকে।
সুতরাং HTML ফাইলের Structure হবে নিম্নরুপ:
<html>
<head>
....................... Head section
</head>
html
<body>
.....................................Body section
</body
</html>
চলুন এখন আমরা আমাদের প্রথম html প্রোগ্রামটি হাতে কলমে লিখে html শিখবো। এজন্য প্রথমে Text Editor খুলে কোড টাইপ করতে হবে। আমরা এডিটর হিসাবে Notepad ব্যবহার করবো। ফাইলটি তৈরি হবার পর Internet Explorer/Mozila Firefox বা যেকোন ব্রাউজার ব্যবহার করে করে ফাইলটি খুলবো। html এর এই অংশটি ব্যবহারের জন্য যে কোন ড্রাইভে নির্দিষ্ট নাম দিয়ে একটি ফোল্ডার খুলে নিয়ে সমস্ত ফাইল সেই ফোল্ডারে রাখুন। প্রয়োজনে কোন অডিও, ভিডিও, ইমেজ বা এনিমেশন ফাইল দরকার হলে সেটিকেও একই ফোল্ডারে রাখুন। এতে প্রথম দিকে প্রোগ্রমিং শিখতে সুবিধা হবে। নতুবা Path বা URL টাইপ করার সময় ভুল হতে পারে। মনে রাখবেন, ট্যাগ ছোট হাত বা বড় হাত যে কোন অক্ষর লিখতে পারেন। তবে ছোট হাতের লেখাই উচিত।
আমরা D:ড্রাইভে Nova_Html নামে একটি ফোল্ডার খুলে নিয়েছি। পরে সমস্ত বিষয়ে বিসাতরিত জানা যাবে-চলুন প্রথমে একটি সাধারণ পেজ তৈরী করে ফলাফল দেখে আসি.......
চলুন শুরু করা যাক
1. ডেক্সটপ থেকে Start>All Programs>Accessorizes>Notepad কমান্ড দিন।
2. Notepad খুলে যাবে এবং কোড লেখার জন্য কার্সর অবস্থান করবে। নিম্নোক্ত কোডিং লিখুন।
৩. এখন File>Save কমান্ড দিন।
3. ডায়ালগ বক্স আসবে। ফাইলটি Program001 বা যে কোন নাম দিন এবং ডট (.) দিয়ে .html/htm Extention নাম দিন। ফাইলের সর্ম্পুন নামটি হবে Program001.html/Program001.htm ( আগেই নির্দিষ্ট ফোল্ডার সিলেক্ট করে রাখুন)। শেষে ফাইলটি Save করুন।
এখন আমরা একটি ব্রাউজার দ্বারা ফাইলটি অর্থ্যা HTML ডকোমেন্টটি বা ওয়েব পেজটি খুলে দেখবো। নির্দিষ্ট ফোল্ডরে রাখা ফাইলটির উপর ডাবল কিক্ল করলে ডিফল্ড ব্রাউজার দ্বারা খুলে যাবে। উইন্ডোজের সাথে সাধারনত ডিফল্ট ব্রাউজার হিসাবে Internet Exploer থাকে। কাজেই ডাবল ক্লিক করলে Internet Explorer দ্বারা ফাইলটি খুলে যাবে। একাধিক ব্রাউজার থাকলে ফাইলটির উপর Right ক্লিক করলে মেনু আসবে, এখান থেকে Open With সিলেক্ট করলে একাধিক ব্রাউজার লিষ্ট আসবে। লিষ্ট থেকে যেটি সিলেক্ট করবেন সেই ব্রাউজারে ফাইলটি খুলবে।
4. এখন ফাইলটির উপর ডাবল ক্লিক বা Right করুন। Internet Explorer বা অন্য কোন ব্রাউজারে ফাইলটি খুলে যাবে। আপনার তৈরী করা প্রথম ওয়েব পেজটি দেখা যাবে।
কোডিং এর ব্যাখ্যা
কোডিং-এ লক্ষ্য করুন
প্রথমে <html> দিয়ে ট্যাগ শুরু হয়েছে এবং </html> চিহ্ন দিয়ে ট্যাগ শেষ হয়েছে। html ট্যাগের মধ্যে আবার head এবং body নামে দুইটি ট্যাগ রয়েছে। <head> ট্যাগের মধ্যে Program 1 লেখা আছে। সাধারনত head অংশে ডকোমেন্ট সংক্রান্ত বিভিন্ন ইনফরমেশন দেওয়া থাকে। এর মধ্যে Auther এর নাম, তারিখ, টাইটেল ইত্যাদি বিভিন্ন ধরনের ইনফরমেশন দেওয়া যায়। ট্যাগটি যথারীতি </head> চিহ্ন দিয়ে শেষ করা হয়েছে।
ফলাফলঃ ব্রাউজারের প্রথম লাইনে Program 1 লেখা এসেছে।
দ্বিতীয় ট্যাগটি body ট্যাগ। এই ট্যাগের মধ্যে যে টেক্সট লেখা হয় ব্রাউজার হুবুহু সেটি দেখাবে। এই ট্যাগের মধ্যে লেখা আছে। I am Bappi Ashraf . This is Nova System.
ফলাফল: ব্রাউজারে প্রথম লাইনে Program 1 লেখার সাথে I am Bappi Ashraf. This is Nova System. লেখা ভেসে উঠেছে।