HTML এনটিটি এনকোডার ও ডিকোডার
HTML যেসব অক্ষরকে মার্কআপ হিসেবে ধরে সেগুলো এস্কেপ করুন, চাইলে সব নন-ASCII অক্ষরও, অথবা é ও —-এর মতো এনটিটিকে আবার সাধারণ লেখায় ফেরান। দুই দিকের কাজই আপনার ব্রাউজারে হয়, আর ডিকোড করা ইনপুট কখনো সক্রিয় HTML হিসেবে রেন্ডার হয় না।
০টি অক্ষর · ০টি শব্দ · ০টি লাইন
০টি অক্ষর · ০টি শব্দ · ০টি লাইন
সম্পূর্ণভাবে এই ব্রাউজার ট্যাবেই চলে। আপনার টেক্সট কখনও আপলোড বা সংরক্ষণ করা হয় না।
প্রচলিত অক্ষর ও তাদের এনটিটি
নামযুক্ত, দশমিক ও হেক্সাডেসিমাল রূপ সবই একই অক্ষরে ডিকোড হয়। এনকোডার 216টি প্রচলিত নামযুক্ত এনটিটি জানে; ডিকোডার HTML স্ট্যান্ডার্ডের প্রতিটি নামযুক্ত রেফারেন্স বোঝে।
| অক্ষর | নামযুক্ত | দশমিক | হেক্স |
|---|---|---|---|
& | & | & | & |
< | < | < | < |
> | > | > | > |
" | " | " | " |
' | ' | ' | ' |
(নো-ব্রেক স্পেস) | |   |   |
© | © | © | © |
® | ® | ® | ® |
™ | ™ | ™ | ™ |
€ | € | € | € |
£ | £ | £ | £ |
¥ | ¥ | ¥ | ¥ |
— | — | — | — |
– | – | – | – |
… | … | … | … |
« | « | « | « |
» | » | » | » |
° | ° | ° | ° |
× | × | × | × |
÷ | ÷ | ÷ | ÷ |
é | é | é | é |
π | π | π | π |
→ | → | → | → |
😀 | — | 😀 | 😀 |
HTML 4-এর 252টি এনটিটি থেকে HTML5-এর 2,231টি
ক্যারেক্টার রেফারেন্স হলো শুধু ASCII ব্যবহার করে একটি অক্ষর লেখার পদ্ধতি। নিউমেরিক রেফারেন্স যেকোনো Unicode কোড পয়েন্টের জন্য কাজ করে, দশমিকে (é) বা হেক্সাডেসিমালে (é)। নামযুক্ত রেফারেন্স মনে রাখা সহজ: HTML 4-এ এমন ২৫২টি নাম ছিল, যার মধ্যে আছে é-এর মতো Latin-1 অক্ষর, গ্রিক অক্ষর, গাণিতিক চিহ্ন এবং — ও …-এর মতো টাইপোগ্রাফিক চিহ্ন। মজার ব্যাপার, ' সেগুলোর মধ্যে ছিল না; এটি এসেছে XML থেকে এবং HTML5 থেকে তবেই HTML-এ বৈধ হয়েছে।
HTML5 তালিকাটি বাড়িয়ে ২,২৩১টি নামযুক্ত ক্যারেক্টার রেফারেন্সে নিয়ে গেছে এবং MathML এন্টিটি সেটও যুক্ত করেছে, ফলে ✓, ★ ও ≂̸-এর মতো নাম এখন সব আধুনিক ব্রাউজারে কাজ করে। এই সংখ্যায় শেষে সেমিকোলন ছাড়া পুরোনো বানানও আছে, যেমন & ও © সামঞ্জস্যের জন্য পার্সার এগুলো এখনও মেনে নেয়, কিন্তু আপনার এগুলো লেখা উচিত নয়। এখানকার এনকোডার বহুল সমর্থিত HTML 4 নামের সঙ্গে ' তৈরি করে এবং বাকি সবকিছুর জন্য নিউমেরিক রেফারেন্সে ফিরে যায়; ডিকোডার টেক্সট ব্রাউজারের নিজস্ব পার্সারে দেয়, তাই ২,২৩১টি নামের সবগুলোই বোঝে।
কী এস্কেপ করবেন, আর কোথায় শুধু এস্কেপ করা যথেষ্ট নয়
Only & < > " ' দৈনন্দিন কাজের সেটিং: এটি পাঁচটি অক্ষর এস্কেপ করে, যেগুলো টেক্সট নোড বা কোটেড অ্যাট্রিবিউট শেষ করে দিতে পারে; পেজে কোডের নমুনা দেখাতে বা ব্যবহারকারীর টেক্সট নিরাপদে HTML-এ বসাতে এটুকুই যথেষ্ট। Also every non-ASCII character é, € ও ইমোজিকেও রেফারেন্সে বদলে দেয়, যেসব বিরল চ্যানেল UTF-8 বহন করতে পারে না তার জন্য, যেমন কিছু পুরোনো ইমেইল টেমপ্লেট বা এনকোডিং বিগড়ে দেওয়া সিস্টেম। Named, Decimal ও Hex শুধু রেফারেন্সের বানান বদলায়; তিনটিই একই অক্ষরে ডিকোড হয়। UTF-8-এ সেভ করা পেজে অ্যাকসেন্টযুক্ত অক্ষরের জন্য এন্টিটি লাগে না।
এস্কেপিং শুধু HTML প্রসঙ্গকে সুরক্ষা দেয়, আর কিছু নয়। script ব্লক, onclick-এর মতো ইনলাইন ইভেন্ট হ্যান্ডলার, style অ্যাট্রিবিউট বা javascript: দিয়ে শুরু হতে পারে এমন href-এ বসানো টেক্সটের জন্য আলাদা ব্যবস্থা দরকার, আর সেখানে শুধু এন্টিটি এনকোডিং ক্রস-সাইট স্ক্রিপ্টিং ঠেকায় না। React-এর মতো ফ্রেমওয়ার্ক ডিফল্টভাবে টেক্সট এস্কেপ করে, তাই আধুনিক অ্যাপে ডাবল-এস্কেপিংই বেশি দেখা যাওয়া বাগ: যেখানে অ্যাম্পারস্যান্ড থাকার কথা সেখানে ব্যবহারকারী & দেখেন। ট্যাগ পুরোপুরি সরাতে মার্কআপটি HTML থেকে TXT-এ কনভার্ট করুন; URL-এর ভেতরে এস্কেপিংয়ের জন্য URL এনকোড ও ডিকোড ব্যবহার করুন।
সচরাচর জিজ্ঞাসা
- HTML-এ কোন কোন অক্ষর এস্কেপ করা বাধ্যতামূলক?
- টেক্সটে & ও < অপরিহার্য, আর > প্রচলন অনুযায়ী এস্কেপ করা হয়। অ্যাট্রিবিউট মানের ভেতরে সেটিকে ঘিরে থাকা কোট অক্ষরটিও এস্কেপ করতে হয়। পাঁচটিই এস্কেপ করলে দুই ক্ষেত্রই সামলানো যায়।
- আর সাধারণ স্পেসের মধ্যে পার্থক্য কী?
হলো নো-ব্রেক স্পেস, U+00A0। এটি দেখতে স্পেসের মতো, কিন্তু ওই জায়গায় লাইন ভাঙতে দেয় না, আর HTML-এর সাধারণ স্পেসের মতো একসঙ্গে কয়েকটি থাকলে একটিতে মিলে যায় না।- আমার পেজে অ্যাম্পারস্যান্ডের বদলে & দেখাচ্ছে কেন?
- টেক্সট দুইবার এস্কেপ হয়েছে: একবার আপনার ডেটায়, আরেকবার টেমপ্লেট বা ফ্রেমওয়ার্কে। কাঁচা টেক্সট সংরক্ষণ করুন এবং আউটপুটের সময় একটি স্তরকে, সাধারণত টেমপ্লেটকে, এস্কেপ করতে দিন।
- অবিশ্বস্ত উৎসের HTML এখানে ডিকোড করা কি নিরাপদ?
- হ্যাঁ। ডিকোডার ইনপুটকে সাধারণ টেক্সট কনটেন্ট হিসেবে পার্স করে, তাই ট্যাগ তৈরি হয় না, স্ক্রিপ্ট চলে না এবং ছবি লোড হয় না। শুধু এন্টিটি রেফারেন্সগুলো অক্ষরে বদলায়।
- নেমড না নিউমেরিক এনটিটি, কোনটি ভালো?
- নামযুক্তগুলো পড়তে সহজ, আর নিউমেরিকগুলো প্রতিটি অক্ষরের জন্য এবং সব XML পার্সারে কাজ করে। DTD ছাড়া XML-এ শুধু
&,<,>,"ও'আগে থেকে সংজ্ঞায়িত।