HTML এর ২০ টি প্রয়োজনীয় টিপস

এক এক জন এক একভাবে ওয়েবসাইট বানায়। নতুনদের জন্য কমন কিছু ভুল থাকে, সেগুলো আলোচনা করা হয়েছে, সেইসাথে সাইটের সুবিধাজনক কোড লেখার ব্যাপরেও কিছু আলোচনা আছে।

০১. সবসময় ট্যাগ বন্ধ করুন।

কিছু ট্যাগ বন্ধ না করলেও কাজ হয় তবে সবসময় ট্যাগ বন্ধ করুন। কিছু কিছু ক্ষেত্র সমস্যা হতে পারে।

  1. <li>Some text here.
  2. <li>Some new text here.
  3. <li>You get the idea.

উত্তম

  1. <ul>
  2. <li>Some text here. </li>
  3. <li>Some new text here. </li>
  4. <li>You get the idea. </li>
  5. </ul>

০২.সঠিক DocType ডিক্লার করুন

CSS ফাইল চেক করুন এবং সঠিক DocType ডিক্লার করুন

০৩. লাইনে লাইনে style প্রকাশ করবেন না

লাইনে লাইনে style প্রকাশে ভুলের পরিমান বৃদ্ধি পেতে পারে। আবার স্টাইল পরিবর্তনে আপনাকে অনেক কোড পরিবর্তন করতে হব।

<p style=”color: red;”>I’m going to make this text red so that it really

এর চেয়ে ভাল css এ একটি স্টাইল তৈরীকরে নেয়া । উপরউল্লেখিত দুটি সুবিধা পাবেন।

  1. #someElement > p {
  2. color: red;
  3. }

০৪. Head ট্যাগের মধ্যে সকল CSS ফাইলকে ডাকুন

সাইট দ্রুত লোডিঙের জন্য Head ট্যাগের মধ্যে সকল CSS ফাইলকে ডাকুন

  1. <head>
  2. <title>My Favorites Kinds of Corn</title>
  3. <link rel=”stylesheet” type=”text/css” media=”screen” href=”path/to/file.css” />
  4. <link rel=”stylesheet” type=”text/css” media=”screen” href=”path/to/anotherFile.css” />
  5. </head>

০৫. সবার শেষে ডাকুন জাভাস্ক্রিপ্টের ফাইল।

সাইট দ্রুত লোডিঙের জন্য সবার শেষে ডাকুন জাভাস্ক্রিপ্টের ফাইল।

  1. <p>And now you know my favorite kinds of corn. </p>
  2. <script type=”text/javascript” src=”path/to/file.js”></script>
  3. <script type=”text/javascript” src=”path/to/anotherFile.js”></script>
  4. </body>
  5. </html>

০৬. লাইনে লাইনে জাভাস্ক্রিপ্ট কোড লেখার অভ্যাসটা বদলে ফেলুন

জাভাস্ক্রিপ্ট ফাইল তৈরীকরে সেখানথেকে কল করুন। আপনার সাইটের গতি ও ব্যান্ডউইথ দুটোই বাচবে।

০৭. আপনার HTML কোড যাচাই করে নিন।

ফায়ারবাগ এরমতো HTML ভেলিডেটর ডাউনলোড করে নিন। HTML কোড যাচাই করে নিন।

০৮.আপনার ট্যাগের নাম ছোট হাতের অক্ষরে দিন।

  1. <DIV>
  2. <P>Here’s an interesting fact about corn. </P>
  3. </DIV>
    এর চেয়ে উত্তম
  1. <div>
  2. <p>Here’s an interesting fact about corn. </p>
  3. </div>

০৯. H1 থেকে H6 ট্যাগ ব্যবহার করুন।

<p> ট্যাগকে H6 এ পরিবর্তন করে নিতে পারেন। SEO এর সুবিধা পাওয়া যাবে।

  1. <h1>This is a really important corn fact! </h1>
  2. <h6>Small, but still significant corn fact goes here. </h6>

১০. yshow ডাউনলোড করে নিন।

এটি ইয়াহুর দারুন একটি কোনএকটি ওয়েবসাইটের কিকি পরিবর্তন করা উচিত তার রিপোর্ট দেয়।

১১. Internet Explorer চিনতে শিখুন

ie.css ফাইল তৈরী করুন। নিচের কোডের মাধ্যমে আপনার সাইট Internet Explorer চিনতে পরবে

  1. <!–[if lt IE 7]>
  2. <link rel=”stylesheet” type=”text/css” media=”screen” href=”path/to/ie.css” />
  3. <![endif]–>

১২. ভাল মানের কোডইডিটর ব্যবহার করুন।

নিচে কয়েকটির লিংক দেয়া হলো:

১৩. ওয়েব সাইটের কাজ শেষ হলে একে কম্প্রেশ করে নিন।

Javascript Compression Services

CSS Compression Services

১৪.কাজ শেষে কেটে ছেটে ছোট করুন।

সাইটের কাজ শেষ হলে অনেক বাড়তি কোড থাকতে পারে আপনার সাইটে। সেগুলো খুজে খুজে মুছে ফেলুন।

১৫. সকল ছবিতে “Alt” ব্যবহার করুন

মন্দ

  1. <IMG src=”cornImage.jpg” />
<IMG src="cornImage.jpg" />

ভাল

  1. <img src=”cornImage.jpg” alt=”A corn field I visited.” />

১৬. বিভিন্ন সাইটের source দেখুন

বিভিন্ন সাইটের source দেখুন। আপনি অনেককিছুই শিখতে পারবেন।

১৭. প্রায় সকল উপাদানেই স্টাইল ব্যবহার করুন

সাইটের সৌন্দর্যের জন্যস্টাইল ব্যবহার করা খুবই প্রয়োজনিয় ।

১৮. ফটোশপ শিখুন।

১৯. HTML এর নতুন নতুন ট্যাগের ব্যবহার শিখুন।

২০. বিভিন্ন ফোরাম ও ব্লগে যোগদিন ।

অনেক সমস্যার সমাধান আপনি ফোরাম ও ব্লগে পাবেন।বি

০১. সবসময় ট্যাগ বন্ধ করুন।

কিছু ট্যাগ বন্ধ না করলেও কাজ হয় তবে সবসময় ট্যাগ বন্ধ করুন। কিছু কিছু ক্ষেত্র সমস্যা হতে পারে।

  1. <li>Some text here.
  2. <li>Some new text here.
  3. <li>You get the idea.

উত্তম

  1. <ul>
  2. <li>Some text here. </li>
  3. <li>Some new text here. </li>
  4. <li>You get the idea. </li>
  5. </ul>

০২.সঠিক DocType ডিক্লার করুন

CSS ফাইল চেক করুন এবং সঠিক DocType ডিক্লার করুন

০৩. লাইনে লাইনে style প্রকাশ করবেন না

লাইনে লাইনে style প্রকাশে ভুলের পরিমান বৃদ্ধি পেতে পারে। আবার স্টাইল পরিবর্তনে আপনাকে অনেক কোড পরিবর্তন করতে হব।

<p style=”color: red;”>I’m going to make this text red so that it really

এর চেয়ে ভাল css এ একটি স্টাইল তৈরীকরে নেয়া । উপরউল্লেখিত দুটি সুবিধা পাবেন।

  1. #someElement > p {
  2. color: red;
  3. }

০৪. Head ট্যাগের মধ্যে সকল CSS ফাইলকে ডাকুন

সাইট দ্রুত লোডিঙের জন্য Head ট্যাগের মধ্যে সকল CSS ফাইলকে ডাকুন

  1. <head>
  2. <title>My Favorites Kinds of Corn</title>
  3. <link rel=”stylesheet” type=”text/css” media=”screen” href=”path/to/file.css” />
  4. <link rel=”stylesheet” type=”text/css” media=”screen” href=”path/to/anotherFile.css” />
  5. </head>

০৫. সবার শেষে ডাকুন জাভাস্ক্রিপ্টের ফাইল।

সাইট দ্রুত লোডিঙের জন্য সবার শেষে ডাকুন জাভাস্ক্রিপ্টের ফাইল।

  1. <p>And now you know my favorite kinds of corn. </p>
  2. <script type=”text/javascript” src=”path/to/file.js”></script>
  3. <script type=”text/javascript” src=”path/to/anotherFile.js”></script>
  4. </body>
  5. </html>

০৬. লাইনে লাইনে জাভাস্ক্রিপ্ট কোড লেখার অভ্যাসটা বদলে ফেলুন

জাভাস্ক্রিপ্ট ফাইল তৈরীকরে সেখানথেকে কল করুন। আপনার সাইটের গতি ও ব্যান্ডউইথ দুটোই বাচবে।

০৭. আপনার HTML কোড যাচাই করে নিন।

ফায়ারবাগ এরমতো HTML ভেলিডেটর ডাউনলোড করে নিন। HTML কোড যাচাই করে নিন।

০৮.আপনার ট্যাগের নাম ছোট হাতের অক্ষরে দিন।

  1. <DIV>
  2. <P>Here’s an interesting fact about corn. </P>
  3. </DIV>
    এর চেয়ে উত্তম
  1. <div>
  2. <p>Here’s an interesting fact about corn. </p>
  3. </div>

০৯. H1 থেকে H6 ট্যাগ ব্যবহার করুন।

<p> ট্যাগকে H6 এ পরিবর্তন করে নিতে পারেন। SEO এর সুবিধা পাওয়া যাবে।

  1. <h1>This is a really important corn fact! </h1>
  2. <h6>Small, but still significant corn fact goes here. </h6>

১০. yshow ডাউনলোড করে নিন।

এটি ইয়াহুর দারুন একটি কোনএকটি ওয়েবসাইটের কিকি পরিবর্তন করা উচিত তার রিপোর্ট দেয়।

১১. Internet Explorer চিনতে শিখুন

ie.css ফাইল তৈরী করুন। নিচের কোডের মাধ্যমে আপনার সাইট Internet Explorer চিনতে পরবে

  1. <!–[if lt IE 7]>
  2. <link rel=”stylesheet” type=”text/css” media=”screen” href=”path/to/ie.css” />
  3. <![endif]–>

১২. ভাল মানের কোডইডিটর ব্যবহার করুন।

নিচে কয়েকটির লিংক দেয়া হলো:

১৩. ওয়েব সাইটের কাজ শেষ হলে একে কম্প্রেশ করে নিন।

Javascript Compression Services

CSS Compression Services

১৪.কাজ শেষে কেটে ছেটে ছোট করুন।

সাইটের কাজ শেষ হলে অনেক বাড়তি কোড থাকতে পারে আপনার সাইটে। সেগুলো খুজে খুজে মুছে ফেলুন।

১৫. সকল ছবিতে “Alt” ব্যবহার করুন

মন্দ

  1. <IMG src=”cornImage.jpg” />
<IMG src="cornImage.jpg" />

ভাল

  1. <img src=”cornImage.jpg” alt=”A corn field I visited.” />

১৬. বিভিন্ন সাইটের source দেখুন

বিভিন্ন সাইটের source দেখুন। আপনি অনেককিছুই শিখতে পারবেন।

১৭. প্রায় সকল উপাদানেই স্টাইল ব্যবহার করুন

সাইটের সৌন্দর্যের জন্যস্টাইল ব্যবহার করা খুবই প্রয়োজনিয় ।

১৮. ফটোশপ শিখুন।

ছবি সম্পর্কে ভাল ধারনা না থাকলে ভাল সাইট বানাণো কঠিন। তাই ফটোশপ শেখা জরুরী।

১৯. HTML এর নতুন নতুন ট্যাগের ব্যবহার শিখুন।

আপনার মেধা বিকশিত হতে নতুন নতুন ট্যাগের ব্যবহার শেখা জরুরী

২০. বিভিন্ন ফোরাম ও ব্লগে যোগদিন ।

অনেক সমস্যার সমাধান আপনি ফোরাম ও ব্লগে পাবেন।

8 thoughts on “HTML এর ২০ টি প্রয়োজনীয় টিপস”

Leave a Comment