HTML5 হাতেখড়ি, পর্ব-২ (Doctype, Character Encoding) | পিসি হেল্পলাইন বিডি (PC Helpline BD)
বিজ্ঞাপন
Homeওয়েব ডিজাইনHTML5 হাতেখড়ি, পর্ব-২ (Doctype, Character Encoding)

6 মাস আগে (জুন ১৬, ২০১৬) 101 বার দেখা হয়েছে

HTML5 হাতেখড়ি, পর্ব-২ (Doctype, Character Encoding)

Category: ওয়েব ডিজাইন | Tags: , , , by

বিজ্ঞাপন
Domain Hosting Offer

পর্ব-১ এ আমরা দেখেছি কিভাবে HTML কোডিং এনভারনমেন্ট সেটাপ করতে হয়, কি কি টুলস প্রয়োজন হয়। এই পর্বে আমরা শিখবো প্রত্যেক HTML ফাইলের জন্য অত্যাবশ্যকীয় ২ টি কোড, Doctype ও Character Encoding.
DOCTYPE কি ও কেনো ব্যাবহার করা প্রয়োজন?

<!DOCTYPE html>
এই কোড লাইন টি প্রত্যেক HTML5 ডকুমেন্ট এর প্রথমে থাকা জরুরী HTML ফাইলটি HTML এর কোন স্ট্যান্ডার্ড অনুযায়ী লেখা হয়েছে তা ব্রাউজার কে জানানোর জন্য। HTML5 এর ডকটাইপ সহজ ও সাধারন হলেও HTML এর আগের ভার্সন গুলোতে DOCTYPE ডিক্লারেশন এত সহজ ছিলো না, এমন কি অভিজ্ঞ ওয়েব ডেভেলপার রা ও ডকটাইপ কোড এক ফাইল থেকে আরেক ফাইলে কপি পেষ্ট করতেন। xHTML 1.0 তে ডকটাইপ নিচের মত করে ডিক্লেয়ার করা হতোঃ
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN”
“http://www.w3.org/TR/xhtml1/DTD/xht…”>
এখন প্রশ্ন হলো কেনো আমাদের HTML ডকুমেন্ট এ DOCTYPE ডিক্লেয়ার করা প্রয়োজন? DOCTYPE ডিক্লেয়ার না করলে প্রায় সব ব্রাউজার (ইন্টারনেট এক্সপ্লোরার, ফায়ারফক্স সহ অন্যান্য ব্রাউজার) “quirks mode” এ HTML কে পার্স করবে। “quirks mode” এ প্রত্যেক ব্রাউজার নিজেদের আলাদা আলাদা নিয়ম অনুযায়ী HTML কে পার্স করবে যার ফলে এক এক ব্রাউজারে এক এক রকম ফন্ট সাইজ, অনিয়মিত লে-আউট, এলিমেন্ট অনিয়ন্ত্রিত ফ্লোট করতে থাকবে।
কিন্তু যখন DOCTYPE ব্যাবহার করা হয় তখন ব্রাউজার বুঝতে পারে HTML এর কোন ভার্সন অনুযায়ী HTML ফাইলটিকে পার্স করতে হবে, ফলে প্রায় সব নতুন ব্রাউজারেই লেয়াউট, ফন্ট সাইজ, ফ্লোট প্রায় একই থাকে। শুধুমাত্র ব্রাউজার ই না, HTML5 ভ্যালিডেটর, সার্চ ইঞ্জিন ও DOCTYPE চেক করে তাই সব সময় HTML ফাইলে DOCTYPE ব্যাবহার করা জরুরী।
Character Encoding কি ও কেনো ব্যাবহার করা হয়?

ক্যারেক্টার এনকোডিং কম্পিউটার কে নির্দেশনা প্রদান করে কিভাবে টেক্সট কে বাইট অনুযায়ী ফাইলে সংরক্ষন করবে, এবং যখন আবার ফাইল ওপেন করা হবে তখন কিভাবে তা ডিকোড করবে। পৃথিবীতে অনেক প্রকার ক্যারেক্টার এনকোডিং ব্যবস্থা চালু আছে, তবে এর মধ্য UTF-8 খুব জনপ্রিয় কারন এই ক্যারেক্টার এনকোডিং কম্প্যাক্ট, ফাস্ট এবং ইংলিশ বাদেও অন্য ভাষার ক্যারেক্টার কে ও সাপোর্ট করে। যেখানে ওয়েবসাইট হোষ্ট করা থাকে সেই সার্ভার সাধারনত ব্রাউজার কে নির্দেশনা প্রদান করে নির্দিষ্ট পেজে কোন এনকোডিং ব্যাবহার করা হয়েছে। তবে কখনো কখনো কিছু সার্ভার এই নির্দেশনা প্রদান করে না, যদি সার্ভার ক্যারেক্টার এনকোডিং এর তথ্য প্রদান না করে তা হলে ব্রাউজার এনকোডিং ফরম্যাট গেজ করতে থাকবে যা নিরাপদ নয়। তাই HTML ফাইলে ক্যারেক্টার এনকোডিং ঠিক করে দেয়া নিরাপদ। HTML5 এ ক্যরেক্টার এনকোডিং ঠিক করে দেয়া খুব সহজ <head> </head> এর মাঝে <meta> ট্যাগ ব্যবহার করে নিচের কোড এর মত ক্যারেক্টার এনকোডিং ঠিক করা হয়ঃ
<head>
<meta charset=”utf-8″>
<title>The New Testing Document</title>
</head>
অ্যাডোবি ড্রিমওয়েভার ব্যাবহার করলে নতুন HTML ফাইলের উপরে এই কোড গুলো অটোম্যাটিক যোগ হয়ে যায়, তবে সাধারন টেক্সট এডিটর যেমন Notepad++ অথবা Sublime Text ব্যাবহার করলে ক্যারেক্টার এনকোডিং মেটা ট্যাগ নিজেকে টাইপ করে নিতে হবে।
পর্ব-৩ এ দেখুন কিভাবে এক্সটার্নাল CSS ফাইল ও JavaScript ফাইল যোগ করবেন।
বিঃদ্রঃ বন্ধুদের সাথে শেয়ার করুন, হয়ত কারো উপকারে আসবে।

ফেসবুকে যুক্ত হতে এখানে ক্লিক করুন

About 3

author

88th Zend Certified PHP Engineer in Bangladesh. Programmer, UI/UX Designer & Entrepreneur.

Related Posts

৩ responses to “HTML5 হাতেখড়ি, পর্ব-২ (Doctype, Character Encoding)”

  1. […] ডকুমেন্ট সফলভাবে তৈরি করতে পেরেছেন। পর্ব-২ এ Doctype ও Character Encoding নিয়ে আলোচনা করা হয়… বিঃদ্রঃ বন্ধুদের সাথে শেয়ার করুন, হয়ত […]

  2. […] পর্ব ২ এ আমরা Doctype ও Character Encoding নিয়ে আলোচনা করেছি, না পড়ে থাকলে পর্ব-২ পড়ে নিন। এই পর্বে আমরা দেখবো কিভাবে এক্সটার্নাল CSS ফাইল ও JS ফাইল যোগ করা হয়। […]

  3. Shafiqul Alam বলেছেন:

    খুবি মানসম্মত পোষ্ট। অসংখ্য ধন্যবাদ। সহজ উদাহরনের মাধ্যমে HTML শিখতে হলে যে কেউ ঘুরে আসতে পারেন-goo.gl/Aqbqys

PC Helpline BD Facebook