আজ আমি HTML 5 (এইচটিএমএল ৫)- এর খুঁটিনাটি নিয়ে আলোচনা করব । যারা HTML (এইচটিএমএল)- সম্পর্কে অথবা HTML 5 (এইচটিএমএল ৫)- সম্পর্কে জানেন না বা কিছু জানেন; আশা করি তারা এ সম্পর্কে মোটামোটি ধারণা নিতে পারবেন অর্থাৎ তাদের জন্য টিউনটি কিছুটা হলেও উপকারে আসতে পারে
HTML (এইচটিএমএল) কি ?
নতুনদের মনে প্রশ্ন জাগতে পারে যে, HTML (এইচটিএমএল) আবার কি ? যা অনেকের মুখে শুনা যায় ! তাদের উদ্দেশে আমি বলছি; HTML (এইচটিএমএল) হল এক প্রকার Markup Language (মার্কআপ ল্যাঙ্গুয়েজ), অর্থাৎ এটির মাধ্যমে কোন একটি ওয়েব পেইজের Markup (মার্কআপ) তথা মূল কাঠামো গঠন করা হয় । যার পূর্ণ নাম হচ্ছে Hyper Text Markup Language (হাইপার টেক্সট মার্কআপ ল্যাঙ্গুয়েজ) ।
তাছাড়া HTML (এইচটিএমএল) কত গুলো ট্যাগের সমন্বয়ে গঠিত, যা কোন ওয়েব পেইজের Markup (মার্কআপ) তথা কাঠামো গঠন করে, আর এই Markup (মার্কআপ) ট্যাগ এর কাজ হল কোন ওয়েব পেইজের বিভিন্ন ইলিমেন্ট কিভাবে প্রদর্শিত হবে তা নির্দেশ করা । একটি ওয়েব পেইজের ইলিমেন্ট যথাক্রমেঃ টেক্সট, ইমেজ, অডিও, ভিডিও ইত্যাদি ।
HTML (এইচটিএমএল) আমাদের কেন প্রয়োজন ?
একটি ওয়েব পেইজ বা কোন একটি ওয়েব সাইট তৈরি করতে HTML (এইচটিএমএল)- এর গুরুত্ব অপরিসীম । কেননা; যেহেতু HTML (এইচটিএমএল) কোন একটি ওয়েব পেইজের Markup (মার্কআপ) অর্থাৎ মূল কাঠামো গঠন করে, সেহেতু কোন ওয়েব পেইজ ডিজাইন করতে অথবা ওয়েবসাইট তৈরি করতে HTML (এইচটিএমএল) এর বিকল্প কিছু নেই ।
HTML (এইচটিএমএল) এর ইতিহাস
বহুল ব্যবহারিত আজকের এই HTML (এইচটিএমএল) আমাদের নিকট আপনা-আপনি চলে আসে নাই এটির পেছনেও রয়েছে এক বিশাল ইতিহাস, HTML (এইচটিএমএল) এর সৃষ্টি কর্তা হলেন- ইউরোপীয় বিজ্ঞানী স্যার টিম বার্নাস লী ।
তিনি ১৯৮০ সালে CERN এ একজন বিশেষজ্ঞ থাকাকালীন CERN গবেষকদের মাঝে তথ্য শেয়ারের জন্য ENQUIRE Prototyped নামে একটি System এর প্রস্তাব দেন ।
তারপর, ১৯৮৯ সালে স্যার টিম বার্নাস লী ইন্টারনেট ভিত্তিক একটি Hyper Text (হাইপার টেক্সট) সিস্টেম প্রস্তাবে একটি মেমো লিখেন । এবং ১৯৯০ সালে স্যার টিম বার্নাস লী ব্রাউজারের ও সার্ভারের সফটওয়্যারের HTML (এইচটিএমএল) উল্লেখ্য করেন । তারপর এই বছরেই স্যার টিম বার্নাস লী ও CERN এর তথ্য ইঞ্জিনিয়ার Robert Cailliau যৌথ ভাবে CERN কে এ প্রকল্পের জন্য অর্থায়নের অনুরোধ করেন কিন্তু প্রকল্পটি আনুষ্ঠানিক ভাবে CERN দ্বারা গৃহীত হয়নি । তবে HTML (এইচটিএমএল) পরিচিতি লাভ করে একই সালে NCSA কর্তৃক ডেভেলপকৃত মোজাইক ব্রাউজারের মাধ্যমে ।
তাছাড়া স্যার টিম বার্নাস লী অলাভজন জনসেবামূলক প্রতিষ্ঠান ওয়ার্ল্ড ওয়াইড ওয়েব এর তত্ত্বাবধায়ক ওয়ার্ল্ড ওয়াইড ওয়েব কনসোটিয়াম (W3C) এর ডিরেক্টর । ওয়ার্ল্ড ওয়াইড ওয়েব কনসোটিয়াম কর্তৃক ডেভেলপকৃত HTML 3.2 প্রকাশিত হয় ১৯৯৭ সালের জানয়ারিতে ও একই সনের শেষের দিকে প্রকাশ হয় HTML 4.2 এবং HTML (এইচটিএমএল) এর সর্বশেষ সংস্করণ তথা HTML 5 প্রকাশিত হয় ২০১০ সালে ।
HTML 5 (এইচটিএমএল ৫) কি ?
HTML 5 (এইচটিএমএল ৫) হচ্ছে HTML (এইচটিএমএল) এর সর্বশেষ সংস্করণ । যা ২০১০ সালে প্রকাশিত হয় এবং এখন পর্যন্ত পরবর্তী কোন সংস্করণ আসে নি ।
HTML 5 (এইচটিএমএল ৫) এ নতুন কিছু বৈশিষ্ট্যঃ
০১. মিডিয়া প্লেব্যাকের জন্য
০৩. স্থানীয় সংগ্রহস্থলের জন্য সমর্থন ।
০৪. নতুন ফর্ম নিয়ন্ত্রণ, যেমন ক্যালেন্ডার, তারিখ, সময়, ই-মেইল, অনুসন্ধান, ইউআরএল ইত্যাদি ।
০৫. নতুন নির্দিষ্ট বিষয়বস্তুর উপাদান, যেমনঃ
,
HTML 5 (এইচটিএমএল ৫) এর কিছু নিয়মঃ
০১. উন্নত ত্রুটি পরিচালনার ব্যবস্থা থাকতে হবে ।
০২. নতুন বৈশিষ্ট গুলো এইচটিএমএল, সিএসএস, DOM এবং জাভাস্ক্রিপ্টের উপর ভিত্তি করে তৈরি করা।
০৩. একাধিক স্ক্রিপ্টিং প্রতিস্থাপন করার সুবিধা যুক্ত করা ।
০৪. আলাদা প্লাগিনের ব্যবহার কমাতে হবে (যেমন: ফ্ল্যাশ) ।
০৫. HTML 5 (এইচটিএমএল ৫) এর স্বাধীন ডিভাইস হতে হবে ।
০৬. উন্নয়ন প্রক্রিয়ায় জনগণের কাছে দৃশ্যমান হবে ।
HTML 5 (এইচটিএমএল ৫) এর জন্য ব্রাউজার সাপোর্টঃ
HTML 5 (এইচটিএমএল ৫) এখনও অফিসিয়ালি প্রকাশিত হয় নি, তাছাড়া কোন ব্রাউজারে HTML 5 (এইচটিএমএল ৫) এর পূর্ণ সমর্থন আসে নাই । তবে প্রতিনিয়ত ব্রাউজারগুলোতে নতুন নতুন উপাদান যুক্ত করা হচ্ছে ।
HTML হল ওয়েব ডিজাইনের মূলভিত্তি যা দিয়ে ওয়েব পেজ তৈরি করা হয়।একজন দক্ষ ওয়েব ডিজাইনার বা ওয়েব ডেভলপার হতে গেলে অবশ্যই HTML সম্পর্কে ভালো জ্ঞান থাকতে হবে।এখন প্রশ্ন হতে পারে HTML ছাড়াই তো Microsoft Frontpage, Adobe Dreamweaver, Webpage Maker,Wordpress, Joomla ব্যবহার করে সুন্দর ওয়েব পেজ তৈরি করা যায়,HTML এর প্রয়োজন কি তাহলে? প্রয়োজনটা হল এটাই যে HTML জানা বাদে একজন নিজের মতো পুরোপুরি ওয়েব পেজ কাস্টমাইজেশন করতে পারে না।তাছাড়া সার্চ ইন্জিন অপটিমাইজেশন (SEO) এর জন্যও HTML জানা অতীব গুরুত্বপূর্ণ।
HTML এ সাধারনত তিন প্রকার ট্যাগ থাকে।
যথা- HEAD ট্যাগ,HTML ট্যাগ এবং BODY ট্যাগ।
HTML এর সর্বশেষ সংস্করন হল HTML 5।পরিবর্তন হিসেবে HTML 5 এ কিছু নতুন ট্যাগ সংযোজন করা হয়েছে।নিম্নে সেগুলো দেয়া হল:
Author- MD.HABIBUR RAHMAN
ওয়েব ডিজাইন বা ওয়েব ডেভেলপমেন্ট করার জন্য HTML ভাষা জানা অত্যন্ত গুরুত্বপূর্ণ। HTML ভাষা না জেনে কোন ভাবেই ওয়েব ডিজাইন বা ওয়েব ডেভেলপমেন্ট করা যায় না। আবার HTML5 হচ্ছে HTML এর নতুন সংস্করণ। এজন্য আজ আমি HTML5 সম্পর্কে কিছু উদাহরণসহ ধারণা দেব।
HTML5 সাধারণত কিছু কোড এর mgš^q| যেমনঃ-
<!DOCTYPE HTML>
<html>
<body>
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
</body>
</html>
এখানে <!DOCTYPE html> দ্বারা ডকুমেন্টের প্রকারকে বোঝানো হয়েছে। আবার,এখানে html দ্বারা শুরু হয়েছে এবং html দ্বারা শেষ হবে এভাবে body দ্বারা শুরু হলে body দ্বারা শেষ হবে। অর্থ্যা কোড যেটি দ্বারা শুরু হবে সেটার দ্বারাই শেষ করতে হবে।
Input Type: date
Birthday: <input type="date" name="bday">
HTML Audio - Using <object>
<object height="50" width="100" data="horse.mp3"></object>
Playing Videos in HTML
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
<source src="movie.webm" type="video/webm">
<object data="movie.mp4" width="320" height="240">
<embed src="movie.swf" width="320" height="240">
</object>
</video>
HTML5 Compliant
<!--...--> Defines a comment
<!DOCTYPE> Defines the document type
<a> Defines a hyperlink
<area> Defines an area inside an image-map
<body> Defines the document's body
<center> Defines centered text
<font> Defines font, color, and size for text
<footer> Defines a footer for a document or section
<head> Defines information about the document
<html> Defines the root of an HTML document
<input> Defines an input control
<li> Defines a list item
<p> Defines a paragraph
<span> Defines a section in a document
<td> Defines a cell in a table
<textarea> Defines a multiline input control (text area)
এখানে, লিঙ্ক এড্রেস গুলো কি রকম হবে তা নির্ভর করে “href” attribute এর উপর। আর অ্যাট্রিবিউট গুলো এইচ টি এম এল এর উপাদানগুলো সম্পর্কে বিস্তারিত বিবরণ প্রদান করে।
এইচ টি এম এল ইমেজ
এইচ টি এম এল ইমেজগুলোকে <img> ট্যাগের মাধ্যমে লিখা হয়। আর এখানে src, alt,height এবং width গুলো অ্যাট্রিবিউট হিসাবে ব্যবহার করা হয়।
