Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/hail2u/html-best-practices

For writing maintainable and scalable HTML documents
https://github.com/hail2u/html-best-practices

Last synced: 3 months ago
JSON representation

For writing maintainable and scalable HTML documents

Awesome Lists containing this project

README

        

Translations: [English](README.md) · [বাংলা](README.bn.md) · [Dansk](README.da.md) · [Deutsch](README.de.md) · [Español](README.es.md) · [فارسی](README.fa-IR.md) · [Français](README.fr.md) · [Indonesia](README.id.md) · [日本語](README.ja.md) · [한국어](README.ko.md) · [Português (BR)](README.pt-BR.md) · [Română](README.ro.md) · [Русский](README.ru.md) · [Türkçe](README.tr.md) · [Українська](README.uk.md) · [Tiếng Việt](README.vi.md) · [简体中文](README.zh-CN.md) · [正體中文](README.zh-TW.md)

# HTML Best Practices

সহজে ম্যানেজ এবং স্কেল HTML ডকুমেন্ট লেখার জন্য

## সাধারন

### DOCTYPE দিয়ে শুরু করুন

`No-quirks` মোড সক্রিয় করার জন্য DOCTYPE প্রয়োজন৷

ভালো না:


...

ভালো:



...

### অনেক পুরাতন অথবা উত্তরাধিকার DOCTYPE ব্যবহার করবেন না।

DOCTYPE এখন আর DTD-এর জন্য ব্যবহার হয় না, সহজ হোন।

ভালো না:

ভালো:

### XML ঘোষণা ব্যবহার করবেন না

আপনি কি XHTML লিখতে চান?

ভালো না:


ভালো:

### অক্ষর রেফারেন্স যতটা সম্ভব ব্যবহার করবেন না

আপনি যদি UTF-8 দিয়ে একটি HTML ডকুমেন্ট লেখেন, প্রায় সব অক্ষর (ইমোজি সহ) সরাসরি লেখা যাবে।

ভালো না:

Copyright © 2014 W3C®

ভালো:

Copyright © 2014 W3C®

### নামযুক্ত অক্ষর এর সাথে `&`, `<`, `>`, `"`, এবং `'` মুক্ত রাখুন

একটি বাগ-মুক্ত HTML নথির জন্য এই অক্ষরগুলি সর্বদা পালানো উচিত।

ভালো না:

The "&" character

ভালো:

The "&" character

### নিয়ন্ত্রণ বা অদৃশ্য অক্ষরের জন্য সংখ্যাসূচক অক্ষর রেফারেন্স ব্যবহার করুন

এই অক্ষরগুলি সহজেই অন্য চরিত্রের জন্য ভুল হয়। এবং বিশেষত্ব এই অক্ষরগুলির জন্য একটি মানুষের পাঠযোগ্য নাম সংজ্ঞায়িত করার গ্যারান্টি দেয় না।

ভালো না:

This book can read in 1 hour.

ভালো:

This book can read in 1 hour.

### মন্তব্য বিষয়বস্তু চারপাশে সাদা স্থান রাখুন

কিছু অক্ষর কমেন্ট খোলার সাথে সাথে বা মন্তব্য বন্ধ করার আগে ব্যবহার করা যাবে না।

ভালো না:

ভালো:

### ক্লোজিং ট্যাগ বাদ দেবেন না

আমি মনে করি আপনি ক্লোজিং ট্যাগ বাদ দেওয়ার নিয়ম বুঝতে পারছেন না।

ভালো না:



...

ভালো:



...

### খালি এলিমেন্টে বিন্যাস মিশ্রিত করবেন না

সুসংগত তা পঠনযোগ্যতার জন্য একটি চাবিকাঠি।

ভালো না:

HTML Best Practices


ভালো:

HTML Best Practices


### ট্যাগ এবং অ্যাট্রিবিউট মানের চারপাশে সাদা স্পেস রাখবেন না

এটা করার কোন কারণ নেই।

ভালো না:

HTML Best Practices

ভালো:

HTML Best Practices

### ক্যাকেটার কেস মিশ্রিত করবেন না

এটি একটি ধারাবাহিকতাও দেয়।

ভালো না:

General

ভালো:

General

এটাও ভালো:

General

### উদ্ধৃতি চিহ্ন মিশ্রিত করবেন না

উপরের মতই ।

ভালো না:

HTML Best Practices

ভালো:

HTML Best Practices

### দুই বা তার বেশি সাদা স্পেস দিয়ে অ্যাট্রিবিউট আলাদা করবেন না

আপনার অদ্ভুত ফর্ম্যাটিং নিয়ম কাউকে বিভ্রান্ত করে।

ভালো না:

ভালো:

### বুলিয়ান অ্যাট্রিবিউট মান বাদ দিন

এটা লেখা সহজ, তাই না?

ভালো না:

ভালো:

### নেমস্পেস বাদ দিন

SVG এবং MathML সরাসরি একটি HTML নথিতে ব্যবহার করা যেতে পারে।

ভালো না:


...

ভালো:


...

### XML অ্যাট্রিবিউট ব্যবহার করবেন না

আমরা একটি HTML নথি লিখি।

ভালো না:

...

ভালো:

...

### `data-*` বৈশিষ্ট্যগুলির সাথে , মাইক্রোডেটা এবং RDFa Lite বৈশিষ্ট্যগুলিকে মিশ্রিত করবেন না ৷

একটি ট্যাগ স্ট্রিং খুব জটিল হতে পারে। এই সহজ নিয়ম এই ধরনের ট্যাগ স্ট্রিং পড়তে সাহায্য করে।

ভালো না:

HTML Best Practices

ভালো:

HTML Best Practices

### ডিফল্ট অন্তর্নিহিত ARIA পছন্দ করুন

কিছু এলিমেন্টে একটি ARIA `role` অন্তর্নিহিতভাবে HTML নথিতে থাকে, সেগুলি নির্দিষ্ট করবেন না ৷

ভালো না:


...


ভালো:


...


## মূল উপাদান

### `lang` অ্যাট্রিবিউট যোগ করুন

`lang` অ্যাট্রিবিউট একটি HTML নথি অনুবাদ করতে সাহায্য করবে।

ভালো না:

ভালো:

### `lang` অ্যাট্রিবিউট মান যতটা সম্ভব ছোট রাখুন

জাপানি শুধুমাত্র জাপানে ব্যবহৃত হয়। তাই দেশের কোডের প্রয়োজন নেই।

ভালো না:

ভালো:

### `data-*` যতটা সম্ভব এড়িয়ে চলুন

একটি উপযুক্ত বৈশিষ্ট্য ব্রাউজার দ্বারা সঠিকভাবে পরিচালনা করা যেতে পারে।

ভালো না:

chemises
...
Do not wash!

ভালো:

chemises
...
Do not wash!

## ডকুমেন্ট মেটাডেটা

### `title` এলিমেন্টে যোগ করুন

`title` এলিমেন্টে এর ভ্যালু শুধুমাত্র একটি ব্রাউজার নয় বিভিন্ন অ্যাপ্লিকেশন দ্বারাও ব্যবহৃত হয়।

ভালো না:



ভালো:



HTML Best Practices

### `base` এলিমেন্টে ব্যবহার করবেন না

একটি নিখুঁত পথ বা URL ডেভেলপার এবং ব্যবহারকারী উভয়ের জন্যই নিরাপদ।

ভালো না:


...


...

ভালো:


...

...

### MIME ধরনের ক্ষুদ্র লিঙ্কযুক্ত সংস্থানগুলি নির্দিষ্ট করুন৷

এটি একটি ইঙ্গিত কিভাবে অ্যাপ্লিকেশন এই সম্পদ পরিচালনা করে।

ভালো না:



ভালো:



### `favicon.ico` এ লিঙ্ক করবেন না

প্রায় সব ব্যাউজার `/favicon.ico`স্বয়ংক্রিয়ভাবে এবং অ্যাসিঙ্ক্রোনাসভাবে নিয়ে আসে।

ভালো না:

ভালো:

### `apple-touch-icon` লিংক যোগ করুন

টাচ আইকনের জন্য একটি ডিফল্ট অনুরোধের পথ হঠাৎ পরিবর্তন করা হয়েছে৷

ভালো না:

ভালো:

### `title` অ্যাট্রিবিউট এর বিকল্প স্টাইলশীটে যোগ করুন

একটি মানুষের পাঠযোগ্য লেবেল সঠিক স্টাইলশীট নির্বাচন করতে সাহায্য করে।

ভালো না:


ভালো:


### URL এর জন্য, `link` অ্যাট্রিবিউট ব্যবহার করুন

`href` অ্যাট্রিবিউট এর ভ্যালু URL হিসাবে সমাধান করা যেতে পারে।

ভালো না:



...

ভালো:



...

### ডকুমেন্টের অক্ষর এনকোডিং নির্দিষ্ট করুন

UTF-8 এখনও সব ব্রাউজারে ডিফল্ট নয়।

ভালো না:


HTML Best Practices

ভালো:



HTML Best Practices

### এনকোডিং ফরম্যাট এ লিগ্যাসি অক্ষর ব্যবহার করবেন না

HTTP হেডার একটি সার্ভার দ্বারা নির্দিষ্ট করা উচিত, সহজ হতে হবে ।

ভালো না:

ভালো:

### প্রথমে অক্ষর এনকোডিং নির্দিষ্ট করুন

স্পেকের জন্য নথির প্রথম 1024 বাইটের মধ্যে অক্ষর এনকোডিং নির্দিষ্ট করা প্রয়োজন।

ভালো না:




...

ভালো:




...

### UTF-8 ব্যবহার করুন

UTF-8 এর সাথে, আপনি ইমোজি ব্যবহার করতে পারবেন।

ভালো না:

ভালো:

### CSS-এর জন্য `type` অ্যাট্রিবিউট বাদ দিন

HTML এ, `style` এর ডিফল্ট `type` অ্যাট্রিবিউট ভ্যালু হলো `text/css` ।

ভালো না:


...

ভালো:


...

### `style` এলিমেন্টে বিষয়বস্তু উপর মন্তব্য করবেন না

এইটা পুরাতন ব্যাউজারের জন্য ।

ভালো না:


<!--
...
-->

ভালো:


...

### CSS এবং JavaScript এর ট্যাগ এক সাথে মিশাবেন না

কখনও কখনও `script` এলিমেন্টে DOM তৈরি ব্লক করে।

ভালো না:



ভালো:



এটাও ভালো:



## বিভাগসমূহ

### `body` এলিমেন্টে যোগ করুন

কখনও কখনও `body` এলিমেন্টে একটি ব্রাউজার দ্বারা অপ্রত্যাশিত অবস্থানে পরিপূরক হয়।

ভালো না:



...

...

ভালো:



...


...

### `hgroup` এলিমেন্টে সম্পর্কে ভুলে যান

এই এলিমেন্টে খুব বেশি ব্যবহার করা হয় না।

ভালো না:


HTML Best Practices


For writing maintainable and scalable HTML documents.


ভালো:

HTML Best Practices


For writing maintainable and scalable HTML documents.

### `address` এলিমেন্টে শুধুমাত্র যোগাযোগের তথ্যের জন্য উপাদান ব্যবহার করুন

`address` এলিমেন্টে হল ইমেল ঠিকানা, সামাজিক নেটওয়ার্ক অ্যাকাউন্ট, রাস্তার ঠিকানা, টেলিফোন নম্বর বা এমন কিছুর জন্য যার সাথে আপনি যোগাযোগ করতে পারেন।

ভালো না:

No rights reserved.

ভালো:

Contact: Kyo Nagashima

## গ্রুপিং বিষয়বস্তু

### `pre` এলিমেন্টে নতুন লাইন দিয়ে শুরু করবেন না

ব্রাউজারগুলিতে একটি প্রথম নতুন লাইন উপেক্ষা করা হবে, তবে দ্বিতীয় এবং পরে রেন্ডার করা হবে।

ভালো না:


<!DOCTYPE html>

ভালো:

<!DOCTYPE html>

### `blockquote` এলিমেন্টের উপযুক্ত এলিমেন্টের ব্যবহার করুন

`blockquote` এলিমেন্টের বিষয়বস্তু একটি উদ্ধৃতি, অক্ষরের একটি অংশ নয়।

ভালো না:

For writing maintainable and scalable HTML documents.

ভালো:


For writing maintainable and scalable HTML documents.


### `blockquote` এলিমেন্টের রে ভিতরে সরাসরি অ্যাট্রিবিউশন অন্তর্ভুক্ত করবেন না

`blockquote` এলিমেন্টের এর এর বিষয়বস্তু একটি উদ্ধৃতি ।

ভালো না:


For writing maintainable and scalable HTML documents.

— HTML Best Practices


ভালো:


For writing maintainable and scalable HTML documents.


— HTML Best Practices

এটাও ভালো:



For writing maintainable and scalable HTML documents.


— HTML Best Practices

### প্রতি লাইনে একটি তালিকা আইটেম লিখুন

লম্বাঅঅঅঅঅঅঅঅঅঅঅঅঅঅঅঅঅঅঅঅঅঅঅঅঅঅঅঅঅঅঅঅঅঅঅঅঅঅঅঅঅঅঅঅ
লাইন পড়ার জনননননননননননননননননননননন্য কঠিন ।

ভালো না:


  • General

  • The root Element

  • Sections
  • ...

ভালো:


  • General

  • The root Element

  • Sections

  • ...

### `ol` এলিমেন্টের এর সাথে `type` অ্যাট্রিবিউট ব্যবহার করুন

আপনি যদি `type` অ্যাট্রিবিউট এর সাথে মার্কার পরিবর্তন করেন, তাহলে আপনি আপনি রেফারেন্সে নিরাপদ থাকবেন।

ভালো না:



.toc {
list-style-type: upper-roman;
}




  1. General

  2. The root Element

  3. Sections

  4. ...

ভালো:



  1. General

  2. The root Element

  3. Sections

  4. ...

### সংলাপের জন্য `dl` এলিমেন্টের ব্যবহার করবেন না

`dl` এলিমেন্টের এইচটিএমএল-এ একটি অ্যাসোসিয়েশন তালিকায় সীমাবদ্ধ ।

ভালো না:


Costello

Look, you gotta first baseman?

Abbott

Certainly.

Costello

Who’s playing first?

Abbott

That’s right.

Costello becomes exasperated.
Costello


When you pay off the first baseman every month, who gets the money?

Abbott

Every dollar of it.

ভালো:

Costello: Look, you gotta first baseman?


Abbott: Certainly.


Costello: Who’s playing first?


Abbott: That’s right.


Costello becomes exasperated.


Costello: When you pay off the first baseman every month, who gets the money?


Abbott: Every dollar of it.

### `figcaption` এলিমেন্টের প্রথম বা শেষ চাইল্ড হিসাবে `figure` এলিমেন্ট রাখুন

স্পেক `figure` এলিমেন্টের মাঝখানে `figcaption` এলিমেন্টকে অনুমতি দেয় না।

ভালো না:


Front cover of the “HTML Best Practices” book
“HTML Best Practices” Cover Art
Back cover of the “HTML Best Practices” book

ভালো:


Front cover of the “HTML Best Practices” book
Back cover of the “HTML Best Practices” book
“HTML Best Practices” Cover Art

### `main` ইলিমেন্টে ব্যবহার করুন

`main` ইলিমেন্টে অন্য কনটেন্ট মোড়ানোর কাজে ব্যবহার করা যেতে পারে ।

ভালো না:


...

ভালো:


...

### যত বেশী সম্ভব `div` ইলিমেন্টে এড়িয়ে চলুন

`div` ইলিমেন্টে শেষ অবলম্বন একটি উপাদান ।

ভালো না:


...

ভালো:


...

## টেক্সট-লেভেল সিমানটিক

### একই লিঙ্ক বিভক্ত করবেন না যা গ্রুপ করা যেতে পারে

`a` ইলিমেন্টে প্রায় সব অন্য ইলিমেন্টে কে মোড়ায়ি রাখতে যারে ( ফর্ম নিয়ন্ত্রণ এবং ইলিমেন্টে মতো ইন্টারেক্টিভ উপাদানগুলি ছাড়া এবং `a` ইলিমেন্টে নিজেকে).

ভালো না:

WHATWG

A community maintaining and evolving HTML since 2004.

ভালো:


WHATWG

A community maintaining and evolving HTML since 2004.


### কোন রিসোর্স ডাউনলোড দিতে `download` অ্যাট্রিবিউট ব্যবহার করুন

এটা ব্যাউজারকে লিংক রিসোর্স মেমরীতে ডাওনলোড হতে বাধ্য করবে ।

ভালো না:

offline version

ভালো:

offline version

### প্রয়োজন হলে `rel`, `hreflang`, এবং `type` অ্যাট্রিবিউট ব্যবহার করুন

অ্যাপ্লিকেশনে কিভাবে লিংক রিসোর্স কিভাবে ম্যানেজ করতেেএটা তার হিন্ট দিতে সাহায্য করে ।

ভালো না:

Japanese PDF version

ভালো:

Japanese PDF version

### লিঙ্ক এর টেক্সট পরিষ্কার রাখুন

লিঙ্ক টেক্সট এর লিঙ্ক করা সম্পদের লেবেল হওয়া উচিত।

ভালো না:

Click here to view PDF version.

ভালো:

PDF version is also available.

### সতর্কতা বা সতর্কতার জন্য `em` ইলিমেন্টে ব্যবহার করবেন না

এগুলো সিরিয়াসনেস। সুতরাং, `strong` ইলিমেন্টে আরো বেশী উপযুক্ত.

ভালো না:

Caution!

ভালো:

Caution!

### `s`, `i`, `b`, এবং `u` ইলিমেন্টে যতটা সম্ভব এড়িয়ে চলুন

এই ইলিমেন্টে গুলার শব্দার্থবিদ্যা মানুষের পক্ষে খুব কঠিন।

ভালো না:

ভালো:

### `q` ইলিমেন্টে এর ভিতরে উদ্ধৃতি রাখবেন না

উদ্ধৃতি ব্রাউজার দ্বারা প্রদান করা হয় ।

ভালো না:

“For writing maintainable and scalable HTML documents”

ভালো:

For writing maintainable and scalable HTML documents

এটাও ভালো:

“For writing maintainable and scalable HTML documents”

### `abbr` ইলিমেন্টে এর `title` অ্যাট্রিবিউট যোগ করুন

এর সম্প্রসারণ প্রতিনিধিত্ব করার অন্য কোন উপায় নেই।

ভালো না:

HBP

ভালো:

HBP

### `ruby` মার্কআপ ইলিমেন্টে কম ব্যবহার করুন

`ruby` ইলিমেন্টে আধুনিক সব ব্যাউজার এখনো সাপোর্ট করে না ।

ভালো না:

HTMLえいちてぃーえむえる

ভালো:

HTML (えいちてぃーえむえる)

### মেশিন পাঠ অযোগ্য `time` ইলিমেন্টে এ `datetime` অ্যাট্রিবিউট যোগ করুন

যখন datetime অ্যাট্রিবিউট বৈশিষ্ট্য উপস্থিত হয় না, তখন `time` ইলিমেন্টে এর বিষয়বস্তুর বিন্যাস সীমাবদ্ধ।

ভালো না:

ভালো:

### কোড ল্যাংগুয়েজ লেখার সময় `class` অ্যাট্রিবিউট এর নাম এর আগে `language-` রাখুন

এটি একটি আনুষ্ঠানিক উপায় নয়, তবে স্পেক এটি উল্লেখ করে।

ভালো না:

<!DOCTYPE html>

ভালো:

<!DOCTYPE html>

### `kbd` ইলিমেন্টে যতটা সম্ভব সাধারন রাখুন

নেস্টিং `kbd` ইলিমেন্টে মানুষের জন্য খুব কঠিন ।

ভালো না:

Ctrl+F5

ভালো:

Ctrl+F5

### `span` ইলিমেন্টে যতটা সম্ভব এড়িয়ে চলুন

`span` ইলিমেন্টে হলো একটি উপাদান এর শেষ অবলম্বন ।

ভালো না:

HTML Best Practices

ভালো:

HTML Best Practices

### `br` ইলিমেন্টে এর পরে বিরতি

`br` ইলিমেন্টে যেখানে ব্যবহার করা হয় সেখানে লাইন বিরতি প্রয়োজন ।

ভালো না:

HTML
Best
Practices

ভালো:

HTML

Best

Practices

### শুধুমাত্র উপস্থাপনামূলক উদ্দেশ্যে `br` উপাদান ইলিমেন্টে করবেন না

`br` ইলিমেন্টে লাইন ব্রেকিং এর জন্য নয়, এটি বিষয়বস্তু লাইন বিরতি জন্য ।

ভালো না:

Rule name:

Rule description:

ভালো:

Rule name:


Rule description:

## সম্পাদনা

### `ins` এবং `del` ইলিমেন্টে এর ভিতরে অন্য ইলিমেন্টে ব্যবহার করবেন না

ইলিমেন্টে অন্য ইলিমেন্টে এর উপরে ওভারফ্লো হতে পারে না।

ভালো না:

For writing maintainable and scalable HTML documents. And for mental stability.

Don’t trust!

ভালো:

For writing maintainable and scalable HTML documents. And for mental stability.

Don’t trust!

## এম্বেড করা বিষয়বস্তু

### `img` ইলিমেন্টে এর জন্য ফলব্যাক `picture` ইলিমেন্টে প্রদান করুন

ব্যাউজারে `picture` ইলিমেন্টে এর সাপোর্ট এখনো ভালো না ।

ভালো না:






ভালো:






### যদি দরকার হয় তাহলে `img` ইলিমেন্টে `alt` অ্যাট্রিবিউট যোগ করুন

`alt` অ্যাট্রিবিউট তাদের সাহায্য করে যারা ছবি প্রসেস করতে পারে না বা ইমেজ লোডিং অক্ষম আছে।

ভালো না:

ভালো:

HTML Best Practices

### সম্ভব হলে খালি `alt` বৈশিষ্ট্য

যদি চিত্রটি সম্পূরক হয়, তাহলে কাছাকাছি কোথাও সমতুল্য সামগ্রী রয়েছে।

ভালো না:

Question mark icon Help

ভালো:

Help

### সম্বব হলে `alt` অ্যাট্রিবিউট বাদ দিন

কখনও কখনও আপনি জানেন না কোন টেক্সট `alt` অ্যাট্রিবিউটের জন্য উপযুক্ত।

ভালো না:

CAPTCHA

ভালো:


(If you cannot see the image, you can use an audio test instead.)

### খালি `iframe` ইলিমেন্ট

এর বিষয়বস্তুতে কিছু সীমাবদ্ধতা রয়েছে। খালি থাকা সবসময় নিরাপদ।

ভালো না:


If your browser support inline frame, ads are displayed here.


ভালো:

### মার্কআপ `map` ইলিমেন্ট এর কনটেন্ট

এই বিষয়বস্তু একটি স্ক্রিন রিডারকে উপস্থাপন করে।

ভালো না:


General
|
The root element
|
Sections

ভালো:



General
|
The root element
|
Sections


### `audio` অথবা `video` উপাদানের জন্য ফলব্যাক সামগ্রী প্রদান করুন

এইচটিএমএলে নতুন প্রবর্তিত উপাদানগুলির জন্য ফলব্যাক সামগ্রী প্রয়োজন ৷

ভালো না:




...

ভালো:




...

## ট্যাবুলার ডেটা

### প্রতি লাইনে একটি সেল লিখুন

লম্বা লাইন স্ক্যান করা কঠিন।

ভালো না:


GeneralThe root ElementSections

ভালো:


General
The root Element
Sections

### হেডার সেল এর জন্য `th` ইলিমেন্ট ব্যবহার করুন

এটা এড়িয়ে যাওয়ার কোনো কারণ নেই।

ভালো না:




Element
Empty
Tag omission




pre
No
Neither tag is omissible


img
Yes
No end tag


ভালো:




Element
Empty
Tag omission




pre
No
Neither tag is omissible


img
Yes
No end tag


## Forms

### `label` ইলিমেন্ট দিয়ে ফর্ম কন্ট্রোলকে ঘিরে রাখুন

`label` ইলিমেন্ট ফর্ম ইলিমেন্ট এ ফোকাস করতে সাহায্য করে।

ভালো না:

Query:

ভালো:

Query:

### সম্বব হলে `for` অ্যাট্রিবিউট বাদ দিন

`label` ইলিমেন্ট এর সাথে কিছু form ইলিমেন্ট থাকতে পারে ।

ভালো না:

Query:

ভালো:

Query:

### `input` ইলিমেন্ট এর জন্য সঠিক `type` অ্যাট্রিবিউট ব্যবহার করুন

উপযুক্ত `type` এর জন্য , একটি ব্যাউজার `input` ইলিমেন্ট কে ক্ষুদ্র বৈশিষ্ট্য দেয় ।

ভালো না:

Search keyword:

ভালো:

Search keyword:

### `input type="submit"` তে `value` অ্যাট্রিবিউট যোগ করুন

সাবমিট বটিনের জন্য ডিফল্ট লেবেল , ব্রাউজার এবং ভাষা জুড়ে মানসম্মত নয়।

ভালো না:

ভালো:

### `title` অ্যাট্রিবিউট `input` ইলিমেন্ট এ যোগ করুন যেখানে `pattern` অ্যাট্রিবিউট আছে

যদি ইনপুট টেক্সট এর সাথে `pattern` অ্যাট্রিবিউট না মিলে, তাহলে `title` অ্যাট্রিবিউট ইঙ্গিত হিসাবে প্রদর্শিত হবে।

ভালো না:

ভালো:

### `placeholder` লেবেল করার জন্য অ্যাট্রিবিউট ব্যবহার করবেন না

`label` ইলিমেন্ট লেভেল এর জন্য, `placeholder` এট্রিবিউট ছোট হিন্ট দেয়ার জন্য।

ভালো না:

ভালো:

Email:

### প্রতি লাইনে `option` ইলিমেন্ট লিখুন

লম্বা লাইন স্ক্যান করা কঠিন।

ভালো না:



ভালো:





### `progress` ইলিমেন্টের ভিতরে `max` এট্রিবিউট যোগ করুন।

`max`এট্রিবিউটের সাথে `value` এট্রিবিউটের খুব সহজ ফরম্যাটে লেখা যেতে পারে।

ভালো না:

50%

ভালো:

50%

### `meter` ইলিমেন্টের এট্রিবিউটে `min` এবং `max` যোগ করুন

`min` এবং `max`এট্রিবিউটের সাথে `value` এট্রিবিউটের খুব সহজ ফরম্যাটে লেখা যেতে পারে।

ভালো না:

512GB used (1024GB total)

ভালো:

512GB used (1024GB total)

### `fieldset` ইলিমেন্ট এর প্রথম চাইল্ড হিসাবে `legend` রাখুন।

এই Spec এর প্রয়োজনে।

ভালো না:


Is this section useful?:


...
About "General"

ভালো:


About "General"

Is this section useful?:


...

## স্ক্রিপ্টিং

### জাভাস্ক্রিপ্টের এর জন্য `type` অ্যাট্রিবিউট বাদ দিন

HTML এর ভিতরে, ডিফল্ট `type` এট্রিবিউট ভ্যালু এর `script` ইলিমেন্ট হলো
`text/javascript`.

ভালো না:


...

ভালো:


...

### `script` ইলিমেন্ট এর কনটেন্ট এর উপর মন্তব্য করবেন না

এই ব্যবহারটি সুধু পুরানো ব্রাউজারের জন্য।

ভালো না:


/*<![CDATA[*/
...
/*]]>*/

এটাও ভালো না:


<!--
...
// -->

ভালো:


...

### script-injected `script` ইলিমেন্ট ব্যবহার করবেন না।

সিম্পল রাখা এবং ভালো পারফরমেন্স দুইটার জন্যই `async` এট্রিবিউট সব থেকে ভালো।

ভালো না:


var script = document.createElement("script");
script.async = true;
script.src = "//example.com/widget.js";
document.getElementsByTagName("head")[0].appendChild(script);

ভালো:

## অন্যান্য

### ধারাবাহিকভাবে ইন্ডেন্ট করুন

রিডেবিলিটি বাড়ানোর জন্য ইন্ডেন্টেশন গুরুত্বপূর্ণ।

ভালো না:



...


...

ভালো:



...


...

### অভ্যন্তরীণ লিঙ্কের জন্য এবসুলেট পাথ ব্যবহার করুন

একটি এবসুলেট পাথ আপনার লোকালহোস্টে আরও ভাল কাজ করে ইন্টারনেট সংযোগ ছাড়াই ।

ভালো না:


...

You can find more at contact page.

ভালো:


...

You can find more at contact page.

### বাহ্যিক রিসোর্স এর জন্য প্রোটোকল-সম্পর্কিত URL ব্যবহার করবেন না

প্রোটোকলের সাহায্যে, আপনি নিরাপদে এবং নির্ভরযোগ্যভাবে বাহ্যিক সংস্থানগুলি লোড করতে পারেন৷

ভালো না:

ভালো:

<script src="https://example.com/js/library.js">

## অবদানকারী

- [@hail2u_](https://github.com/hail2u)
- [@momdo](https://github.com/momdo)

## অনুবাদক

- [@costinlotreanu](https://github.com/costinlotreanu)
- [@edgar-avila](https://github.com/edgar-avila)
- [@kobyborali](https://github.com/kobyborali)
- [@m1nhnv](https://github.com/m1nhnv)
- [@mrcaidev](https://github.com/mrcaidev)
- [@naufalk25](https://github.com/naufalk25)
- [@oebelus](https://github.com/oebelus)
- [@sahilmaniyar](https://github.com/sahilmaniyar)
- [@shayanthenerd](https://github.com/shayanthenerd)
- [@sliderkh](https://github.com/sliderkh)
- [@stenbaek](https://github.com/stenbaek)
- [@techhtml](https://github.com/techhtml)
- [@umutphp](https://github.com/umutphp)
- [@victorchao996](https://github.com/victorchao996)
- [@wesleynepo](https://github.com/wesleynepo)
- [@zulkar29](https://github.com/zulkar29)

## লাইসেন্স

[CC0](http://creativecommons.org/publicdomain/zero/1.0/)