ব্লগারকে হার্ডকোর প্রোগ্রামার বা কোডার হবার দরকার নেই । কিন্তু আবার একদম না জানলেই নয় । ছোটখাটো থিম এডিংটিং, পোষ্ট কনফিগারেশন, সাইডবার এডিংটিং ইত্যাদির জন্য কিছুটা হলেও বেসিক ল্যাঙ্গুয়েজ বা কোডিংটুল গুলো যেমন html, javascript, css জানা থাকার দরকার ।
আজকে থাকছে মাদার অফ অল ওয়েবডিজাইনিং ল্যাঙ্গুয়েজ HTML এর বেসিক টিউটোরিয়াল ।
HTML স্ট্রাকচার
<html>
<head>
</head>
<body>
<h1>শিরোনাম</h1>
<p>মূল বক্তব্য</p>
</body>
</html>
এটি হচ্ছে কোন HTML পাতার বেসিক কাঠামো । HTML পাতা শুরু হয় <html> এবং শেষ হয় </html> ট্যাগ দিয়ে । বাকি সব কোড এর ভিতরে থাকে । <html> এর পরই থাকে <head> ট্যাগ । এতে পাতার বেসিক কিছু উপাদান যেমন, ফেবিকন আইকন, মেটা ট্যাগ, ডিস্ক্রিপশন থাকে । এটি শেষ হয় </head> দিয়ে, এরপরই থাকে <body> ট্যাগ । এটিই মূলত পাতার বডি, এখানেই পাঠকের জন্য সব কোড লেখা হয় । HTML পাতার এক্সটেশন থাকে সাধারণত .htm বা .html । ওয়েব সার্ভারের কোন এক ডাইরেক্টরী খুলে কোন HTML পেজ দেখতে চাইলে সেই ডাইরেকটরীতে index.htm বা index.html নামের ফাইল রেখে দিতে হবে ।
টেক্সট এডিটিং
শিরোনাম দেয়া
HTML এ <h1> , <h2., <h3> ব্যবহার করে লেখার শিরোনাম দেয়া যায় । এগুলো লিখে তারপর শিোনাম লিখে তারপর </h1> বা </h2> বা </h3> লিখে শেষ করতে হয় । এখানে h1 বলতে header 1 বুঝানো হয় । h1 এর ফন্ট সাইজ সবচেয়ে বড় হয়ে থাকে, তারপর <h2>, <h3> ইত্যাদি । এই সাইজগুলো HTML সাথে থাকা CSS ফাইল দ্বারা নির্ণয় করা যায় ।
প্যারাগ্রাফ লেখা
শিরোনামের অধীনে পারাগ্রাফ শুরু করা হয় <p> ট্যাগ দিয়ে । এটি শেষ হয় </p> দিয়ে । প্যারাগ্রাফের মাঝে নানা এডিটিয়ের জন্য এই <p> ট্যাগের সাথেই লেখা যোগ করতে হয় । যেমন প্যারাগ্রাফটি পাতার মাঝে সাজাতে <p style=”text-align: center;”> দিয়ে শুরু করে </p> দিয়ে শেষ করতে হয় । বাম বা ডান পাশে সাজাতে center এর স্থলে left বা right লেখতে হয় ।
উদাহরণ: এই লাইনটি সেন্টার এলাইনমেন্ট দেয়া ।
লেখার সাইজ
লেখার সাইজ ও রং ঠিক করতে ব্যবহৃত হয় <p style=”color:black;font-size:20px;”>কাঙ্খিত লেখা বা প্যারাগ্রাফ </p> । এছাড়াও কোন শব্দ বা শব্দগুচ্ছকে বোল্ড করতে <strong> ও শেষে </strong> লেখতে হয় ।
উদাহরণ: এই লাইনটি নীল রংয়ের এবং সাইজ ১১px ।
বিবিধ
নতুন লাইন
কোন লেখার পরের নতুন লেখা নতুন লাইন থেকে শুরু করতে <br /> ব্যবহৃত হয় । এটি একবার লিখলেই হয়, শেষ করার জন্য আলাদা ট্যাগের দরকার নেই ।
লিংকযুক্ত করা
HTML এ কোন লেখা বা কিছুর সাথে লিংকযুকত করতে হয় এভাবে, <a href=”লিংকের ঠিকানা”> টেক্সট লেখা </a> । এখানে লিংকের ঠিকানা কথার স্থানে লিংক এবং টেক্সট লেখার স্থানে লেখা যোগ করে দিন । ” এবং ” কিন্তু দিতেই হবে । লিংক আলাদা ট্যাবে খুলতে চাইলে ব্যবহার করুন <a href=”লিংকের ঠিকানা” target=”_blank> টেক্সট লেখা </a> ।
ছবিযুক্ত করা
ছবিযুক্ত করতে চাইলে <img src=”ছবির ঠিকানা” /> লেখতে হবে । ছবিতে লিংকযুক্ত করতে লিখতে হবে, <a href=”লিংকের ঠিকানা”><img src=”ছবির ঠিকানা” /></a> ।
ফেবিকনযুক্ত করা
ব্রাউজারের সাইটের নামের পাশে ছোট আইকনটি ফেবিকন নামে পরিচিত । এটি দেখতে <head> এরপর ও </head>এর আগে <link rel=”shortcut icon” href=”ফেবিকনের ঠিকানা” /> লিখতে হয় । ফেবিকন তৈরী করতে পারেন এখান থেকে ।
এগুলোই হচ্ছে বেসিক HTML কোডিং যা ব্লগারদের দরকার হয় । এগুলো ওয়ার্ডপ্রেস, ব্লগার সহ সব জায়গাতেই কাজ করবে ।
%20copy.jpg)
