HTML ও CSS শব্দকোষ — ১০১৩টি শব্দের সহজ বাংলা মানে
HTML & CSS Glossary in Bangla — every technical term from the course, with pronunciation and a plain Bangla explanation.
কোর্সের প্রতিটি পর্বে যে ইংরেজি শব্দগুলো এসেছে — pointer, struct — সবগুলো এখানে এক জায়গায়। প্রতিটির পাশে বাংলা উচ্চারণ, সহজ মানে আর কোন পর্বে বিস্তারিত শিখবেন, তার লিংক।
মোট ১০১৩টি শব্দ
#
- !importantইমপর্ট্যান্ট
- declaration-এর শেষে লেখা একটি চিহ্ন, যা সেটিকে সাধারণ declaration-এর ওপরের শ্রেণিতে তোলে। important শ্রেণিতে উৎসের ক্রম উল্টে যায় — পাঠক লেখককে হারায়।যেখানে শিখবেন: পর্ব ১৮পর্ব ৫৭
- <base>বেস এলিমেন্ট
- head-এ বসানো একটি ট্যাগ, যা পুরো পাতার সব relative ঠিকানার ভিত্তি (এমনকি #id লিংকেরও) বদলে দেয়; পাতায় একটিই থাকে।যেখানে শিখবেন: পর্ব ০৫
- <canvas>ক্যানভাস
- পাতার ভেতরে একটি আঁকার বোর্ড, যেখানে JavaScript সরাসরি পিক্সেলে ছবি আঁকে। আঁকা জিনিসগুলো আলাদা element নয়, তাই গেম বা বিশাল চার্টে দ্রুত, কিন্তু অ্যাক্সেসিবিলিটি আর ঘটনা সামলানো হাতে করতে হয়যেখানে শিখবেন: পর্ব ৫৭
- <g> (group)গ্রুপ
- কয়েকটি SVG আকারকে এক দলে রাখার element. দলে দেওয়া fill, stroke বা transform ভেতরের সবার ওপর খাটে — ঠিক যেন এক থালায় কয়েকটি পিঠা একসাথে সরানোযেখানে শিখবেন: পর্ব ৪৪
- <marquee>মার্কি
- লেখা এক পাশ থেকে আরেক পাশে সরানোর পুরোনো HTML ট্যাগ। HTML Living Standard-এ এটি obsolete — ব্রাউজার এখনো দেখায়, কিন্তু নতুন কোডে লেখা উচিত নয়; বিকল্প CSS animationযেখানে শিখবেন: পর্ব ৩৯
- <path> (SVG path)পাথ
- SVG-র সবচেয়ে শক্তিশালী আকার। d attribute-এ M, L, C, A, Z-এর মতো ছোট কমান্ড লিখে কলম কোথায় যাবে, কোথায় রেখা বা বাঁক টানবে তা বলা হয়। প্রায় সব আইকনই আসলে pathযেখানে শিখবেন: পর্ব ৪৪
- <picture> elementপিকচার এলিমেন্ট
- কয়েকটি <source> আর একটি <img>-এর মোড়ক। ব্রাউজার প্রথম মেলা source-এর ফাইল নেয় (media বা type দেখে), কিন্তু পর্দায় আঁকে ভেতরের <img>; তাই alt সেখানেই থাকে।যেখানে শিখবেন: পর্ব ৩২পর্ব ৩৬পর্ব ৫৭
- <slot>স্লট
- Shadow DOM-এর ভেতরের ফাঁকা ঘর, যেখানে host-এর light DOM-এর সন্তানেরা পর্দায় দেখা যায়। name দিলে শুধু মিলে যাওয়া slot="নাম" element বসে; ভেতরের লেখা fallback হিসেবে কাজ করেযেখানে শিখবেন: পর্ব ৫২পর্ব ৫৭
- <symbol>সিম্বল
- নিজের viewBox সহ একটি আঁকা টেমপ্লেট, যা নিজে পর্দায় দেখা যায় না — শুধু <use> দিয়ে ডাকলে দেখা যায়। আইকন sprite-এর মূল উপাদানযেখানে শিখবেন: পর্ব ৪৪
- <template>টেমপ্লেট
- HTML-এর ছাঁচ-element: ভেতরের HTML পার্স হয় কিন্তু পাতায় দেখা যায় না, ছবি লোড হয় না, স্ক্রিপ্ট চলে না। JavaScript template.content কপি করে পাতায় বসালে তবেই তা জীবন্ত হয়যেখানে শিখবেন: পর্ব ৫২পর্ব ৫৭
- <use>ইউজ
- আগে আঁকা কোনো আকার বা symbol-কে href দিয়ে ডেকে এনে আবার দেখানোর element. একবার এঁকে বহুবার ব্যবহার — কপি না করেযেখানে শিখবেন: পর্ব ৪৪
- 301 redirectথ্রি-ও-ওয়ান রিডাইরেক্ট
- HTTP-র স্থায়ী redirect: পুরোনো ঠিকানা চাইলে সার্ভার জানিয়ে দেয় জিনিসটি স্থায়ীভাবে নতুন ঠিকানায় সরে গেছে, আর ব্রাউজার সেখানে চলে যায়।যেখানে শিখবেন: পর্ব ০৫
- 404 Not Foundফোর-ও-ফোর
- HTTP-র একটি status code: সার্ভার কাজ করছে, কিন্তু চাওয়া ঠিকানায় কোনো পাতা বা ফাইল নেই।যেখানে শিখবেন: পর্ব ০৫পর্ব ১৫পর্ব ৪৭
- ::file-selector-buttonফাইল সিলেক্টর বাটন
- <input type="file">-এর ভেতরের “ফাইল বাছুন” বোতামটি সাজানোর মানসম্মত pseudo-element. এর আগে বোতামটি সাজাতে ঘর লুকিয়ে নকল বোতাম বানাতে হতো; এখন Baseline Widely availableযেখানে শিখবেন: পর্ব ৪৩
- ::part()পার্ট সিউডো-এলিমেন্ট
- বাইরের পাতা থেকে Shadow DOM-এর ভেতরের সেই অংশকে সাজানোর selector, যাতে component-নির্মাতা part="নাম" attribute দিয়ে রেখেছেন, যেমন price-card::part(price)যেখানে শিখবেন: পর্ব ৫২
- ::slotted()স্লটেড সিউডো-এলিমেন্ট
- Shadow DOM-এর ভেতরের CSS থেকে slot-এ সরাসরি বসা element-কে সাজানোর selector; তাদের ভেতরের গভীর element-এ পৌঁছায় না, আর টানাটানিতে পাতার CSS জেতেযেখানে শিখবেন: পর্ব ৫২
- :definedডিফাইনড সিউডো-ক্লাস
- যে pseudo-class ব্রাউজারের নিজস্ব element আর define হয়ে যাওয়া custom element-কে ধরে। :not(:defined) দিয়ে স্ক্রিপ্ট আসার আগের অগোছালো অবস্থা লুকানো বা সাজানো যায়যেখানে শিখবেন: পর্ব ৫২
- :focus-visibleফোকাস-ভিজিবল
- এমন pseudo-class যা সত্য হয় কেবল তখন, যখন element focus পেয়েছে আর ব্রাউজার মনে করে দাগ দেখানো দরকার — যেমন কি-বোর্ড দিয়ে আসা focus বা লেখার ঘর। মাউসে বোতাম চাপলে সাধারণত সত্য হয় নাযেখানে শিখবেন: পর্ব ৩৪পর্ব ৪৩পর্ব ৪৫
- :focus-withinফোকাস-উইদিন
- element নিজে বা তার ভেতরের যেকোনো বংশধর focus পেলে সত্য হওয়া pseudo-class; পুরো ফর্ম বা কার্ডকে সক্রিয় দেখাতে কাজে লাগেযেখানে শিখবেন: পর্ব ৩৪
- :has()হ্যাজ
- এমন pseudo-class যা element-কে বাছে তার ভেতরের বা পরের element দেখে — যেমন .card:has(img) মানে যে কার্ডের ভেতরে ছবি আছে। একে প্রায়ই parent selector বলা হয়; ২০২৩ সালের শেষ থেকে Baselineযেখানে শিখবেন: পর্ব ৩৪পর্ব ৪৮পর্ব ৫৪
- :hostহোস্ট সিউডো-ক্লাস
- Shadow DOM-এর ভেতরের CSS থেকে host element-কে ধরার selector; :host(.compact) লিখলে শুধু সেই class থাকলে খাটে। বাইরের পাতার স্টাইল এর চেয়ে জোরালোযেখানে শিখবেন: পর্ব ৫২
- :hoverহোভার
- মাউসের তীর যখন কোনো element-এর ওপর থাকে, তখন সত্য হওয়া pseudo-class. ফোন-ট্যাবের মতো ছোঁয়ার পর্দায় এর আচরণ নির্ভরযোগ্য নয়, তাই জরুরি তথ্য শুধু hover-এ লুকানো ঠিক নয়যেখানে শিখবেন: পর্ব ৩৪পর্ব ৩৮
- :rootরুট সিউডো-ক্লাস
- যে pseudo-class ডকুমেন্টের সবচেয়ে বাইরের element-কে ধরে — HTML পাতায় <html>. specificity (0,1,0), তাই html selector-এর চেয়ে একটু ভারী; সারা পাতার CSS variable সাধারণত এখানেই রাখা হয়যেখানে শিখবেন: পর্ব ৩৩
- :targetটার্গেট সিউডো-ক্লাস
- CSS-এর একটি pseudo-class, যা সেই element-কে ধরে যার id এখন URL-এর fragment-এর সাথে মেলে — পাতার ভেতরে লাফ দেওয়া অংশ রাঙাতে কাজে লাগে।যেখানে শিখবেন: পর্ব ০৫পর্ব ৩৪
- :user-invalid / :user-validইউজার-ইনভ্যালিড
- যাচাইয়ের অবস্থা ধরার CSS pseudo-class, যা কাজ করে কেবল ব্যবহারকারী ঘরটি নিয়ে কিছু করার পর বা জমা দিতে চাইলে — তাই পাতা খুলতেই ফাঁকা ঘর লাল হয় না।যেখানে শিখবেন: পর্ব ০৯পর্ব ৪৩পর্ব ৫৪
- @extendঅ্যাট এক্সটেন্ড
- Sass-এর নিয়ম, যা একটি selector-কে অন্য selector-এর সব নিয়মের তালিকায় জুড়ে দেয়। ফল প্রায়ই অপ্রত্যাশিত selector জোড়া তৈরি করে, তাই এখন সাধারণত mixin পছন্দ করা হয়যেখানে শিখবেন: পর্ব ৫০
- @font-faceঅ্যাট ফন্ট-ফেস
- CSS-এর নিয়ম, যা একটি ফন্ট ফাইলকে একটি নাম দেয় আর বলে ফাইলটি কোথায় — তারপর সেই নাম font-family-তে ব্যবহার করা যায়যেখানে শিখবেন: পর্ব ২১পর্ব ৫৭
- @forwardঅ্যাট ফরওয়ার্ড
- Sass-এর নিয়ম, যা একটি ফাইলের সদস্যদের (variable, mixin, function) নিজের হয়ে পরের ফাইলের কাছে পাঠিয়ে দেয় — কয়েকটি ফাইলকে এক প্রবেশপথে জড়ো করতে কাজে লাগেযেখানে শিখবেন: পর্ব ৫০
- @keyframesকি-ফ্রেমস
- যে at-rule-এ animation-এর চিত্রনাট্য লেখা হয়: মোট সময়ের কোন শতাংশে (from = 0%, to = 100%) element কেমন দেখাবেযেখানে শিখবেন: পর্ব ৩৯পর্ব ৫৭
- @propertyঅ্যাট প্রপার্টি
- যে CSS at-rule একটি custom property-কে নিবন্ধন করে — তার ধরন (syntax), উত্তরাধিকার (inherits) আর প্রাথমিক মান (initial-value) জানিয়ে। এতে variable animate করা যায় আর ভুল মান যাচাই হয়যেখানে শিখবেন: পর্ব ৩৩পর্ব ৩৯পর্ব ৫৭
- @property (registered custom property)অ্যাট প্রপার্টি
- যে custom property-র ধরন (syntax), উত্তরাধিকার (inherits) আর প্রাথমিক মান (initial-value) ব্রাউজারকে আগে থেকে জানিয়ে দেওয়া হয়েছে। ধরন জানা থাকায় ব্রাউজার এর মান মসৃণভাবে animate করতে পারে আর ভুল মান বাতিল করেযেখানে শিখবেন: পর্ব ৩৭
- @scopeস্কোপ
- নতুন একটি CSS at-rule, যা নিয়মগুলোকে DOM-এর একটি নির্দিষ্ট অংশের ভেতরে সীমিত রাখে। specificity সমান হলে যে scope-এর মূল element সবচেয়ে কাছে, সে জেতে।যেখানে শিখবেন: পর্ব ১৮পর্ব ৩৭পর্ব ৪৬
- @starting-styleঅ্যাট স্টার্টিং স্টাইল
- যে at-rule-এ লেখা মানকে ব্রাউজার element-এর প্রথম আঁকার আগের মান ধরে নেয়। এতে display: none থেকে আসা বা নতুন যোগ হওয়া element-ও (যেমন popover) opacity: 0 থেকে ফুটে উঠতে পারে। Baseline Newly available (২০২৪)যেখানে শিখবেন: পর্ব ৩৮
- @supports (feature query)অ্যাট সাপোর্টস
- CSS-এর একটি at-rule, যা ব্রাউজারকে জিজ্ঞেস করে সে একটি property-মান জোড়া চেনে কি না। চিনলে ভেতরের নিয়ম খাটে। fallback নিরাপদে লেখা হয় @supports-এর বাইরে সাধারণ CSS হিসেবে; @supports not শুধু তখন, যখন সব লক্ষ্য-ব্রাউজার @supports চেনেযেখানে শিখবেন: পর্ব ৩৭পর্ব ৪১পর্ব ৪৮
- @useঅ্যাট ইউজ
- Sass-এর module system-এর মূল নিয়ম; অন্য Sass ফাইল একবারই লোড করে আর তার variable, mixin আর function একটি namespace-এর ভেতরে দেয়, যেমন tokens.$brandযেখানে শিখবেন: পর্ব ৫০
- যুক্তাক্ষর (Conjunct)যুক্তাক্ষর
- দুই বা তার বেশি ব্যঞ্জন মিলে তৈরি একটি আকার, যেমন ক্ষ, ঙ্গ, স্ত্র। Unicode-এ এর আলাদা নম্বর নেই — ব্যঞ্জন আর হসন্ত মিলিয়ে ফন্ট আকারটি আঁকেযেখানে শিখবেন: পর্ব ১৪পর্ব ৩৪পর্ব ৩৯
- হসন্ত (Virama)হসন্ত
- ব্যঞ্জনের অন্তর্নিহিত অ-ধ্বনি বাদ দেওয়ার চিহ্ন ্ (U+09CD) — দুই ব্যঞ্জনের মাঝে থাকলে ফন্ট সাধারণত যুক্তাক্ষর বানায়যেখানে শিখবেন: পর্ব ১৪
A
- Absolute length (অ্যাবসোলিউট একক)অ্যাবসোলিউট লেংথ
- যে মাপের একক অন্য কিছুর ওপর নির্ভর করে না, যেমন px, pt, cm, in. CSS-এ এদের সম্পর্ক স্থির: 1in = 96pxযেখানে শিখবেন: পর্ব ২০পর্ব ৫৭
- Absolute URLঅ্যাবসোলিউট ইউআরএল
- scheme আর host-সহ পূর্ণ ঠিকানা, যেমন https://abcltech.com/about.html; কোন পাতা থেকে লিংক দেওয়া হলো তাতে ফল বদলায় না।যেখানে শিখবেন: পর্ব ০৫পর্ব ১৩পর্ব ১৫
- accent-colorঅ্যাকসেন্ট কালার
- Checkbox, radio, range slider আর progress-এর মতো ব্রাউজারের নিজের ফর্ম কন্ট্রোলে ব্র্যান্ডের রং বসানোর CSS property — কন্ট্রোলের আচরণ বা accessibility না বদলেই।যেখানে শিখবেন: পর্ব ৩৫পর্ব ৪৩
- Acceptance criteriaঅ্যাকসেপ্ট্যান্স ক্রাইটেরিয়া
- কাজটি কখন “শেষ” আর গ্রহণযোগ্য বলা যাবে, তার যাচাইযোগ্য শর্তের তালিকা — যেমন “শুধু কি-বোর্ডে চলে”, “৩২০ পিক্সেলে পাশে স্ক্রল নেই”।যেখানে শিখবেন: পর্ব ৫৯
- Accessibility (অ্যাক্সেসিবিলিটি)অ্যাক্সেসিবিলিটি
- এমনভাবে ওয়েব পেজ বানানো যাতে প্রতিবন্ধী মানুষসহ সবাই — screen reader, কীবোর্ড বা বড় লেখা ব্যবহার করে — পাতা পড়তে ও ব্যবহার করতে পারেন। সংক্ষেপে a11yযেখানে শিখবেন: পর্ব ০১পর্ব ০৪পর্ব ১১
- Accessibility APIঅ্যাক্সেসিবিলিটি এপিআই
- অপারেটিং সিস্টেমের যে ব্যবস্থা দিয়ে অ্যাপ ও ব্রাউজার তাদের বোতাম, লেখা ইত্যাদির তথ্য সহায়ক প্রযুক্তিকে দেয় — যেমন Windows-এ UI Automation, Android-এ AccessibilityNodeInfoযেখানে শিখবেন: পর্ব ১২
- Accessibility paneঅ্যাক্সেসিবিলিটি প্যান
- DevTools-এর Elements প্যানেলের একটি ট্যাব, যা বেছে নেওয়া element-এর accessible name, role আর ARIA attribute দেখায় — অর্থাৎ screen reader-এর মতো সহায়ক প্রযুক্তি element-টিকে কীভাবে পায়যেখানে শিখবেন: পর্ব ৪৭
- Accessibility treeঅ্যাক্সেসিবিলিটি ট্রি
- DOM থেকে ব্রাউজার যে আলাদা গাছ বানিয়ে screen reader-এর মতো সহায়ক প্রযুক্তিকে দেয় — প্রতিটি অংশের role (যেমন heading), নাম ও অবস্থা সেখানে থাকেযেখানে শিখবেন: পর্ব ০৪পর্ব ০৭পর্ব ০৮
- Accessible descriptionঅ্যাক্সেসিবল ডিসক্রিপশন
- একটি কন্ট্রোলের নামের বাইরে বাড়তি ব্যাখ্যা, যা screen reader নামের পরে পড়ে। সাধারণত aria-describedby বা title থেকে আসেযেখানে শিখবেন: পর্ব ১২
- Accessible nameঅ্যাক্সেসিবল নেম
- লিংক, বোতাম বা ফর্মের ঘরের মতো যেকোনো কন্ট্রোলের যে নাম screen reader পড়ে শোনায় — ভেতরের লেখা, label, ছবির alt বা aria-label থেকে আসে।যেখানে শিখবেন: পর্ব ০৫পর্ব ০৮পর্ব ১০
- Accordion (অ্যাকর্ডিয়ন)অ্যাকর্ডিয়ন
- পরপর সাজানো কয়েকটি খোলা-বন্ধ হওয়া অংশ — হারমোনিয়ামের ভাঁজের মতো। FAQ পাতায় সবচেয়ে বেশি দেখা যায়যেখানে শিখবেন: পর্ব ১১
- action attributeঅ্যাকশন অ্যাট্রিবিউট
- <form>-এর যে attribute বলে জমা দেওয়া তথ্য কোন URL-এ যাবে। না লিখলে ফর্মটি যে পাতায় আছে, সেই পাতার ঠিকানাতেই যায়।যেখানে শিখবেন: পর্ব ০৮পর্ব ৫৭
- align-contentঅ্যালাইন-কনটেন্ট
- multi-line (flex-wrap: wrap) flex container-এ লাইনগুলোকে cross axis বরাবর সাজায় — item নয়, পুরো লাইন। nowrap container-এ এর কোনো প্রভাব নেই।যেখানে শিখবেন: পর্ব ২৫
- align-itemsঅ্যালাইন-আইটেমস
- flex container-এর property, যা প্রতিটি item-কে তার লাইনের ভেতরে cross axis বরাবর বসায়: stretch-এর মতো ডিফল্ট আচরণ, flex-start, center, flex-end বা baseline.যেখানে শিখবেন: পর্ব ২৫পর্ব ৫৭
- align-selfঅ্যালাইন-সেলফ
- একটি flex item-এর নিজের property, যা শুধু তার জন্য container-এর align-items-কে বাতিল করে cross axis-এ আলাদা অবস্থান দেয়।যেখানে শিখবেন: পর্ব ২৫
- Alpha (আলফা)আলফা
- রঙের স্বচ্ছতার মাত্রা — ০ মানে পুরো স্বচ্ছ, ১ বা ১০০% মানে পুরো অস্বচ্ছ। রঙের ভেতরে দিলে শুধু সেই রংটিই স্বচ্ছ হয়যেখানে শিখবেন: পর্ব ২০পর্ব ৪১
- alt text (বিকল্প লেখা)অল্ট টেক্সট
- <img>-এর alt attribute-এ লেখা ছবির অর্থ — screen reader এটি পড়ে, ছবি লোড না হলে এটি দেখা যায়। শুধু সাজসজ্জার ছবিতে alt="" (ফাঁকা) দিতে হয়যেখানে শিখবেন: পর্ব ১২পর্ব ১৫পর্ব ২২
- an+b সূত্রএ-এন প্লাস বি
- :nth-child()-এর ভেতরের সূত্র: n-এর জায়গায় ০, ১, ২… বসিয়ে যে সংখ্যাগুলো আসে (১ বা তার বেশি), সেই নম্বরের সন্তানেরা মেলে। যেমন 2n+1 মানে ১, ৩, ৫…যেখানে শিখবেন: পর্ব ৩৪
- Ancestorঅ্যানসেস্টর
- কোনো element-এর parent, parent-এর parent, এভাবে root পর্যন্ত সবাই — তার পূর্বপুরুষযেখানে শিখবেন: পর্ব ০৩পর্ব ১৭
- Anchor element (<a>)অ্যাঙ্কর এলিমেন্ট
- লিংক তৈরির HTML element. href attribute-এ ঠিকানা থাকে, আর ভেতরের লেখা বা ছবিতে ক্লিক করে সেখানে যাওয়া যায়; href না থাকলে এটি লিংক হিসেবে কাজ করে না।যেখানে শিখবেন: পর্ব ০৫
- Anchor positioningঅ্যাঙ্কর পজিশনিং
- নতুন CSS ব্যবস্থা, যাতে একটি absolute বা fixed element-কে অন্য একটি element-এর (নোঙরের) পাশে বসানো যায়, আর জায়গা না থাকলে ব্রাউজার নিজেই অন্য দিকে সরিয়ে দেয়। এখনো সব ব্রাউজারে স্থিতিশীল নয়।যেখানে শিখবেন: পর্ব ২৪পর্ব ৩৭পর্ব ৫৯
- Animation eventsঅ্যানিমেশন ইভেন্ট
- CSS animation-এর পাঠানো JavaScript ঘটনা: animationstart, animationiteration, animationend আর animationcancel — এগুলো ধরে animation-এর শুরু বা শেষে কাজ করা যায়যেখানে শিখবেন: পর্ব ৩৯
- animation-compositionঅ্যানিমেশন কম্পোজিশন
- একই property-তে element-এর নিজের মান আর animation-এর মান কীভাবে মিলবে: replace (বদলে দেয়), add (জুড়ে দেয়) বা accumulate (যোগ করে)যেখানে শিখবেন: পর্ব ৩৯
- animation-directionঅ্যানিমেশন ডিরেকশন
- animation কোন দিকে চলবে: normal (সামনে), reverse (উল্টো), alternate (একবার সামনে, একবার উল্টো — দোলনার মতো) বা alternate-reverseযেখানে শিখবেন: পর্ব ৩৯
- animation-fill-modeফিল মোড
- delay-এর অপেক্ষার সময় আর animation শেষ হওয়ার পরে element কোন চেহারায় থাকবে: none, forwards (শেষটা রাখে), backwards (অপেক্ষায় শুরুটা দেখায়) বা bothযেখানে শিখবেন: পর্ব ৩৯পর্ব ৫৫পর্ব ৫৬
- animation-iteration-countইটারেশন কাউন্ট
- animation কতবার চলবে — 1, 3, 2.5 (আড়াইবার) বা infinite (অসীমবার)যেখানে শিখবেন: পর্ব ৩৯
- animation-play-stateপ্লে স্টেট
- animation চলছে (running) না থেমে আছে (paused) — paused করলে যেখানে আছে সেখানেই জমে যায়, আবার running করলে সেখান থেকেই চলেযেখানে শিখবেন: পর্ব ৩৯
- animation-rangeঅ্যানিমেশন রেঞ্জ
- scroll-driven animation timeline-এর কোন অংশে চলবে, তা বলার CSS property — যেমন entry, exit, contain বা cover পর্বের নির্দিষ্ট শতাংশের মধ্যেযেখানে শিখবেন: পর্ব ৪২
- Anonymous boxঅ্যানোনিমাস বক্স
- ব্রাউজারের নিজে থেকে বানানো নামহীন বাক্স, যার পেছনে কোনো HTML element নেই — যেমন block-এর পাশে থাকা খোলা লেখাকে মুড়িয়ে রাখা block. CSS দিয়ে একে সরাসরি বাছা যায় নাযেখানে শিখবেন: পর্ব ২৩
- Anonymous flex itemঅ্যানোনিমাস ফ্লেক্স আইটেম
- flex container-এর ভেতরে কোনো ট্যাগ ছাড়া সরাসরি লেখা থাকলে ব্রাউজার তাকে একটি অদৃশ্য বাক্সে মুড়ে item বানায়। এই বাক্সে selector দিয়ে আলাদা স্টাইল দেওয়া যায় না।যেখানে শিখবেন: পর্ব ২৫
- ANSI বাংলা ফন্টঅ্যানসি ফন্ট
- SutonnyMJ-এর মতো পুরোনো ফন্ট, যা ইংরেজি অক্ষরের জায়গায় বাংলা আকার এঁকে দেখায়। ফাইলের ভেতরে আসলে ইংরেজি অক্ষর থাকে, তাই ফন্ট না থাকলে Avwg-এর মতো লেখা দেখা যায়যেখানে শিখবেন: পর্ব ১৪
- appearance (CSS property)অ্যাপিয়ারেন্স
- ফর্ম কন্ট্রোল native চেহারায় আঁকা হবে কি না, তা ঠিক করার CSS property. ডিফল্ট auto; appearance: none দিলে ব্রাউজারের নিজের চেহারা মুছে যায় আর আপনি নিজে আঁকেন, কিন্তু element-এর আচরণ, কীবোর্ড আর accessibility অক্ষত থাকে। এখন prefix ছাড়াই Baseline Widely availableযেখানে শিখবেন: পর্ব ৪৩পর্ব ৫৬
- apple-touch-iconঅ্যাপল টাচ আইকন
- iPhone বা iPad-এ “Add to Home Screen” করলে হোম স্ক্রিনে যে আইকন বসে; সাধারণত 180×180 পিক্সেলের PNGযেখানে শিখবেন: পর্ব ১৩
- Arbitrary value (Tailwind)আরবিট্রারি ভ্যালু
- স্কেলের বাইরের একটি এককালীন মান, যা class-এর ভেতরে বর্গাকার বন্ধনীতে লেখা হয় — যেমন w-[37rem] বা bg-[#1877f2]. মানের ভেতরে ফাঁকা জায়গার বদলে _ লিখতে হয়।যেখানে শিখবেন: পর্ব ৫১
- ARIA (WAI-ARIA)এরিয়া
- W3C-র একটি নিয়মমালা, যার attribute (role, aria-label ইত্যাদি) দিয়ে accessibility tree-তে বাড়তি তথ্য দেওয়া যায়। প্রথম নিয়ম: উপযুক্ত HTML element থাকলে সেটিই ব্যবহার করুন, ARIA শেষ উপায়।যেখানে শিখবেন: পর্ব ১০পর্ব ১১পর্ব ১২
- ARIA state (অবস্থা)এরিয়া স্টেট
- কন্ট্রোলের যে তথ্য ব্যবহারকারীর কাজে বদলায় — যেমন aria-expanded, aria-checked, aria-pressed. মান বদলানোর দায়িত্ব পাতার JavaScript-এরযেখানে শিখবেন: পর্ব ১২পর্ব ৫২
- aria-describedbyএরিয়া-ডিসক্রাইবড-বাই
- অন্য element-এর id দিয়ে একটি কন্ট্রোলের সাথে বাড়তি বিবরণ জোড়ার ARIA attribute — যেমন পাসওয়ার্ডের নিয়ম বা ভুলের বার্তা; নাম ও ভূমিকার পরে পড়া হয়যেখানে শিখবেন: পর্ব ১২পর্ব ৪৩পর্ব ৫৯
- aria-expandedএরিয়া-এক্সপ্যান্ডেড
- একটি বোতাম যে অংশ খোলে-বন্ধ করে, সেটি এখন খোলা (true) না বন্ধ (false) — screen reader-কে তা জানানোর ARIA stateযেখানে শিখবেন: পর্ব ১২
- aria-invalidএরিয়া-ইনভ্যালিড
- একটি ঘরের মান ভুল, তা assistive technology-কে জানানোর ARIA attribute, যেমন aria-invalid="true" লিখে। এটি চেহারা বদলায় না; সাধারণত JavaScript ভুল ধরা পড়লে বসায় আর ঠিক হলে সরায়, সাথে ভুলের বার্তাটি aria-describedby দিয়ে জোড়া হয়যেখানে শিখবেন: পর্ব ৪৩
- aria-labelএরিয়া-লেবেল
- একটি attribute, যা কোনো অংশকে সরাসরি একটি নাম দেয় — যেমন <nav aria-label="প্রধান মেনু">. নামটি পর্দায় দেখা যায় না, কিন্তু screen reader পড়ে শোনায়। পাতার কোনো শিরোনামকে নাম বানাতে চাইলে aria-labelledby.যেখানে শিখবেন: পর্ব ১০পর্ব ১২পর্ব ৪২
- aria-labelledbyএরিয়া-লেবেলড-বাই
- পাতার অন্য এক বা একাধিক element-এর id দিয়ে বলে দেওয়া যে ওদের লেখাই এই element-এর নাম। নামের উৎসগুলোর মধ্যে এটি সবার ওপরেযেখানে শিখবেন: পর্ব ১২
- Art directionআর্ট ডিরেকশন
- পর্দাভেদে আলাদাভাবে কাটা বা আলাদা নকশার ছবি দেখানো — যেমন ডেস্কটপে চওড়া ব্যানার, ফোনে কাছ থেকে কাটা অংশ। <picture> আর <source media> দিয়ে হয়, ব্রাউজার শর্ত মানতে বাধ্য।যেখানে শিখবেন: পর্ব ৩২পর্ব ৫৭
- aspect-ratioঅ্যাসপেক্ট রেশিও
- বাক্সের চওড়া আর উচ্চতার অনুপাত ঠিক করার CSS property, যেমন aspect-ratio: 16 / 9. চওড়া বদলালে উচ্চতা নিজে থেকে অনুপাত মেনে বদলায়। Baseline Widely available.যেখানে শিখবেন: পর্ব ১৯পর্ব ২৬পর্ব ২৮
- Assistive technology (সহায়ক প্রযুক্তি)অ্যাসিস্টিভ টেকনোলজি
- যে সফটওয়্যার বা যন্ত্র প্রতিবন্ধী মানুষকে কম্পিউটার ও ওয়েব ব্যবহারে সাহায্য করে — screen reader, ম্যাগনিফায়ার, ব্রেইল ডিসপ্লে, কণ্ঠ দিয়ে নিয়ন্ত্রণ বা সুইচযেখানে শিখবেন: পর্ব ১২পর্ব ৫৭
- AST (Abstract Syntax Tree)এএসটি
- কোডকে লেখা হিসেবে না রেখে গাছের মতো কাঠামোয় সাজানো রূপ — CSS-এর ক্ষেত্রে নিয়ম, selector আর declaration আলাদা আলাদা শাখা। টুল এই গাছ বদলে আবার লেখায় ফিরিয়ে আনেযেখানে শিখবেন: পর্ব ৫০
- At-ruleঅ্যাট-রুল
- CSS-এর যে নির্দেশ @ চিহ্ন দিয়ে শুরু হয়, যেমন @media, @container, @import, @font-face. সাধারণ নিয়মের বদলে এটি ব্রাউজারকে বিশেষ কিছু করতে বলে, যেমন শর্ত মিললে ভেতরের নিয়মগুলো চালু করাযেখানে শিখবেন: পর্ব ৩১পর্ব ৩৯
- Atomic CSSঅ্যাটমিক সিএসএস
- প্রতিটি class-এ সাধারণত একটিমাত্র declaration রাখার ধারা — প্রতিটি declaration CSS-এ একবারই লেখা হয়, তাই বড় সাইটেও CSS-এর আকার প্রায় স্থির থাকে।যেখানে শিখবেন: পর্ব ৪৬
- attr()অ্যাটার ফাংশন
- CSS ফাংশন, যা element-এর কোনো attribute-এর মান পড়ে আনে। content: attr(href) লিখলে ::before বা ::after-এ লিংকের ঠিকানা লেখা হিসেবে দেখানো যায়যেখানে শিখবেন: পর্ব ৩১
- Attributeঅ্যাট্রিবিউট
- start tag-এর ভেতরে নাম="মান" রূপে লেখা বাড়তি তথ্য, যেমন href="dokan.html" বা class="price"যেখানে শিখবেন: পর্ব ০৩পর্ব ০৬পর্ব ০৮
- Attribute selectorঅ্যাট্রিবিউট সিলেক্টর
- বর্গ বন্ধনীতে লেখা selector, যা attribute থাকা বা তার মান দেখে element বাছে — যেমন [href], [type="email"], [href$=".pdf" i]যেখানে শিখবেন: পর্ব ১৭পর্ব ২৬পর্ব ৫২
- Auto dark mode (algorithmic darkening)অটো ডার্ক মোড
- ব্রাউজার বা extension নিজে হিসাব কষে ডার্ক-না-জানা পাতার রং গাঢ় করে দেওয়া। রঙের অর্থ বোঝে না, তাই ছবি, চার্ট বা ব্র্যান্ডের রং বিকৃত হতে পারেযেখানে শিখবেন: পর্ব ৩৬
- Auto margin (margin: auto)অটো মার্জিন
- margin-এর মান auto দিলে ব্রাউজার বাকি ফাঁকা জায়গা সেই দিকে দিয়ে দেয়। চওড়া নির্দিষ্ট block-এ বাঁ-ডান দুটিই auto দিলে বাক্স অনুভূমিকভাবে মাঝখানে বসে।যেখানে শিখবেন: পর্ব ১৯পর্ব ২৫পর্ব ২৬
- Auto Saveঅটো সেভ
- প্রতিবার Ctrl+S না চেপেও লেখা নিজে থেকে সেভ হয়ে যাওয়ার সুবিধা; VS Code-এ File মেনু থেকে চালু করা যায়যেখানে শিখবেন: পর্ব ০২
- auto-fill (repeat)অটো-ফিল
- repeat()-এর ভেতরের শব্দ: container-এ যতগুলো track আঁটে ততগুলো বানায়, আর item কম থাকলেও খালি track রেখে দেয়।যেখানে শিখবেন: পর্ব ২৮পর্ব ৫৭পর্ব ৫৮
- auto-fit (repeat)অটো-ফিট
- repeat()-এর ভেতরের শব্দ: auto-fill-এর মতোই যত track আঁটে তত বানায়, কিন্তু যে track-এ কোনো item নেই সেগুলো শূন্য চওড়ায় গুটিয়ে ফেলে — ফলে 1fr থাকলে item-গুলো ছড়িয়ে সারি ভরায়।যেখানে শিখবেন: পর্ব ২৮পর্ব ২৯পর্ব ৩০
- Auto-placementঅটো-প্লেসমেন্ট
- যেসব grid item-কে নির্দিষ্ট জায়গা বলা হয়নি, তাদের ব্রাউজার HTML-এর ক্রম ধরে খালি ঘরে নিজে থেকে বসিয়ে দেয় — এই প্রক্রিয়ার নামযেখানে শিখবেন: পর্ব ২৭পর্ব ৫৫
- autocomplete attributeঅটোকমপ্লিট অ্যাট্রিবিউট
- ঘরটি কোন ধরনের তথ্য চায় (name, email, tel, street-address, one-time-code…) তা ব্রাউজারকে জানানোর attribute, যাতে autofill ঠিক তথ্য বসাতে পারে।যেখানে শিখবেন: পর্ব ০৮
- Autofillঅটোফিল
- ব্রাউজার বা পাসওয়ার্ড ম্যানেজারের নিজে থেকে ফর্ম পূরণের সুবিধা — আগে সেভ করা নাম, ফোন, ঠিকানা বা পাসওয়ার্ড এক চাপে বসিয়ে দেয়।যেখানে শিখবেন: পর্ব ০৮
- Automatic minimum sizeঅটোমেটিক মিনিমাম সাইজ
- flex বা grid item-এর min-width (column-এ min-height) auto থাকলে ব্রাউজার যে ন্যূনতম মাপ ধরে — সাধারণত ভেতরের min-content. item নিজে scroll container হলে এটি 0.যেখানে শিখবেন: পর্ব ২৫পর্ব ২৬পর্ব ২৮
- Autoplay policyঅটোপ্লে পলিসি
- ব্রাউজারের নিয়ম, কোন ভিডিও বা অডিও নিজে থেকে চালু হতে পারবে। সাধারণত শব্দ বন্ধ থাকলে চলে; শব্দসহ চলতে ব্যবহারকারীর আগে পাতায় কিছু চাপা লাগে।যেখানে শিখবেন: পর্ব ০৬পর্ব ৫৭
- Autoprefixerঅটোপ্রিফিক্সার
- PostCSS-এর একটি plugin, যা Can I use-এর তথ্য আর আপনার browserslist দেখে CSS-এ শুধু যেখানে দরকার সেখানে vendor prefix বসায়, আর অপ্রয়োজনীয় পুরোনো prefix মুছে দেয়যেখানে শিখবেন: পর্ব ৪৮পর্ব ৫০পর্ব ৫৬
B
- Back-end (ব্যাক-এন্ড)ব্যাক-এন্ড
- ওয়েব অ্যাপের যে অংশ সার্ভারে চলে — ডেটাবেস, লগইন, পেমেন্ট, তথ্য প্রক্রিয়াকরণ। ব্যবহারকারী সরাসরি দেখেন নাযেখানে শিখবেন: পর্ব ০১
- backdrop-filterব্যাকড্রপ-ফিল্টার
- যে property element-এর নিজের বদলে তার পেছনে যা দেখা যায় সেটির ওপর filter বসায় — ঘষা কাচের মতো ঝাপসা পটভূমির জন্য; element-এর নিজের পটভূমি আধা-স্বচ্ছ হতে হয়যেখানে শিখবেন: পর্ব ৪১পর্ব ৫৬
- backface-visibilityব্যাকফেস ভিজিবিলিটি
- যে CSS property ঠিক করে element ঘুরে পেছন ফিরলে তার পেছনের দিক দেখা যাবে কি না। hidden দিলে পেছন ফিরলেই element অদৃশ্য হয় — ফ্লিপ কার্ডের সামনের দিক লুকাতে এটি ব্যবহার হয়।যেখানে শিখবেন: পর্ব ৪০
- Baselineবেসলাইন
- ব্রাউজার-নির্মাতাদের যৌথ লেবেল, যা বলে একটি ওয়েব ফিচার কতটা নিরাপদে ব্যবহার করা যায়: Newly available মানে সব প্রধান ব্রাউজারের সর্বশেষ সংস্করণে এসেছে, Widely available মানে তারপর ৩০ মাস পেরিয়েছে — অর্থাৎ প্রায় সবার ব্রাউজারে চলে।যেখানে শিখবেন: পর্ব ০১পর্ব ০৩পর্ব ১০
- Baseline (text)বেসলাইন
- লেখার যে কাল্পনিক রেখার ওপর অক্ষরগুলো বসে। inline element (যেমন img) ডিফল্টভাবে এই রেখায় বসে, তাই নিচে g বা y-এর লেজের জায়গা ফাঁকা থেকে যায় — ছবির নিচে সরু ফাঁকের কারণ। Web-এর Baseline সমর্থন-লেবেলের সাথে গুলাবেন নাযেখানে শিখবেন: পর্ব ৪৭
- Basic shapeবেসিক শেপ
- CSS-এর আকৃতি-ফাংশনের দল — circle(), ellipse(), inset(), polygon() ইত্যাদি; clip-path আর shape-outside-এ ব্যবহার হয়যেখানে শিখবেন: পর্ব ৪১
- BCP 47 ভাষা-ট্যাগবিসিপি ফোরটি-সেভেন
- ভাষা লেখার আন্তর্জাতিক সংক্ষিপ্ত রূপ, যেমন bn (বাংলা), bn-BD (বাংলাদেশের বাংলা), en (ইংরেজি) — lang attribute-এ এই ট্যাগই লেখা হয়যেখানে শিখবেন: পর্ব ১৪
- Behavioural interviewবিহেভিয়েরাল ইন্টারভিউ
- আচরণ আর অভিজ্ঞতা নিয়ে প্রশ্নের ধাপ: দলে কাজ, মতভেদ, সমালোচনা, সময়ের চাপ, ভুল থেকে শেখা। অতীতের সত্যি ঘটনা দিয়ে উত্তর দিতে হয়।যেখানে শিখবেন: পর্ব ৫৮
- BEMবিইএম
- Block, Element, Modifier — class-এর নাম রাখার একটি পদ্ধতি, যেমন .card, .card__price, .card--sale. সব selector এক-class-এর রাখে, তাই specificity সমান থাকে।যেখানে শিখবেন: পর্ব ১৭পর্ব ৪৬পর্ব ৫৬
- Blend modeব্লেন্ড মোড
- ওপরের স্তরের রং নিচের স্তরের রঙের সাথে কোন গাণিতিক নিয়মে মিশবে — multiply, screen, overlay, difference ইত্যাদি; CSS-এ mix-blend-mode আর background-blend-mode দিয়ে বেছে নেওয়া হয়যেখানে শিখবেন: পর্ব ৪১
- Block axisব্লক অ্যাক্সিস
- block-গুলো যে দিকে একের পর এক সাজে সেই দিক — বাংলা বা ইংরেজিতে ওপর থেকে নিচে। Grid-এ align- দিয়ে শুরু হওয়া property এই দিকে কাজ করেযেখানে শিখবেন: পর্ব ২৭
- Block formatting context (BFC)ব্লক ফরম্যাটিং কনটেক্সট
- পাতার এমন একটি আলাদা লেআউট-এলাকা, যার ভেতরের block-গুলো নিজেদের মধ্যে সাজে, আর ভেতরের margin বাইরের margin-এর সাথে মেশে না। display: flow-root দিয়ে সবচেয়ে পরিষ্কারভাবে তৈরি করা যায়।যেখানে শিখবেন: পর্ব ১৯পর্ব ২৩পর্ব ৫৫
- Block-level elementব্লক-লেভেল এলিমেন্ট
- HTML 4-এর পুরোনো ভাগ অনুযায়ী যে element নতুন লাইনে শুরু হয়ে পুরো প্রস্থ নেয় — যেমন p, h1, div; আজ এই আচরণ CSS-এর display: block ঠিক করেযেখানে শিখবেন: পর্ব ০৪পর্ব ১৯পর্ব ২৩
- Blockificationব্লকিফিকেশন
- flex বা grid item হলে inline element-এর (যেমন span, a) display নিজে থেকে block ধরনের হয়ে যাওয়া। তখন তার ওপর-নিচের margin আর মাপ কাজ করেযেখানে শিখবেন: পর্ব ২৭
- Bloom filterব্লুম ফিল্টার
- খুব কম মেমরিতে “এটি দলে আছে কি না” দ্রুত বলার একটি ডেটা কাঠামো — “নেই” বললে নিশ্চিত, “আছে” বললে সম্ভবত। ব্রাউজার একে ancestor খোঁজা দ্রুত করতে ব্যবহার করে।যেখানে শিখবেন: পর্ব ১৭পর্ব ৫৭
- Boilerplateবয়লারপ্লেট
- প্রায় প্রতিটি ফাইলের শুরুতে যে একই কাঠামো লিখতে হয় — HTML পেজের ক্ষেত্রে doctype, html, head, meta, title আর body-র কঙ্কালযেখানে শিখবেন: পর্ব ০২
- BOM (Byte Order Mark)বি-ও-এম
- ফাইলের একদম শুরুতে বসানো কয়েকটি বিশেষ বাইট, যা দেখে বোঝা যায় ফাইলটি UTF-8 বা UTF-16-এ লেখা; UTF-8-এ এটি EF BB BFযেখানে শিখবেন: পর্ব ১৪
- Boolean attributeবুলিয়ান অ্যাট্রিবিউট
- যে attribute শুধু থাকলেই চালু, না থাকলে বন্ধ — কোনো মান লিখতে হয় না। যেমন <ol reversed>-এ reversed.যেখানে শিখবেন: পর্ব ০৭পর্ব ০৮পর্ব ০৯
- Bootstrapবুটস্ট্র্যাপ
- ২০১১ সালে Twitter-এ Mark Otto ও Jacob Thornton-এর তৈরি জনপ্রিয় CSS framework. ১২ কলামের grid, তৈরি component (card, navbar, modal) আর তাদের JavaScript দেয়; v5 থেকে jQuery লাগে না।যেখানে শিখবেন: পর্ব ৫১পর্ব ৫৭পর্ব ৫৮
- borderবর্ডার
- padding-এর চারপাশের দাগ বা পাড় — পুরুত্ব, ধরন (solid, dashed…) আর রং থাকে। এর পুরুত্ব বাক্সের মাপে যোগ হয়।যেখানে শিখবেন: পর্ব ১৯
- border-boxবর্ডার-বক্স
- border-এর বাইরের কিনারা পর্যন্ত পুরো বাক্স। box-sizing: border-box দিলে width আর height এই পুরো বাক্সের মাপ হয়, আর padding ও border বাদ দিয়ে content-এর মাপ বের হয়।যেখানে শিখবেন: পর্ব ১৯পর্ব ৫৭
- Box modelবক্স মডেল
- CSS-এর যে নিয়মে পাতার প্রতিটি element-কে একটি আয়তাকার বাক্স ধরা হয় — ভেতর থেকে বাইরে content, padding, border আর margin — এবং এদের মাপ মিলিয়ে বাক্সের আকার ও চারপাশের ফাঁক হিসাব হয়।যেখানে শিখবেন: পর্ব ১৯পর্ব ২২পর্ব ৫৫
- box-sizingবক্স-সাইজিং
- যে CSS property ঠিক করে width আর height কোন অংশের মাপ বোঝাবে — content-box (শুধু content) নাকি border-box (border পর্যন্ত পুরো বাক্স). এটি উত্তরাধিকারে যায় না।যেখানে শিখবেন: পর্ব ১৯পর্ব ৪৩পর্ব ৪৭
- box-sizing: content-boxকনটেন্ট-বক্স
- CSS-এর ডিফল্ট মাপের নিয়ম: width আর height শুধু content-এর মাপ, padding আর border তার বাইরে যোগ হয়। তাই চোখে দেখা চওড়া = width + দুই পাশের padding + দুই পাশের border.যেখানে শিখবেন: পর্ব ১৯পর্ব ৫৬পর্ব ৫৭
- Branch (ব্রাঞ্চ, শাখা)ব্রাঞ্চ
- ইতিহাসের একটি আলাদা ধারা, যেখানে মূল কাজ না ভেঙে নতুন কিছু চেষ্টা করা যায়। ভেতরে এটি শুধু একটি commit-এর দিকে নির্দেশ করা একটি নামযেখানে শিখবেন: পর্ব ৫৩
- Breakpointব্রেকপয়েন্ট
- যে চওড়ায় পৌঁছালে লেআউট বদলানোর নিয়ম লেখা হয় — সাধারণত media query দিয়ে, যেমন 48rem-এর কম হলে এক কলাম।যেখানে শিখবেন: পর্ব ২৯পর্ব ৩০পর্ব ৩১
- Broken linkব্রোকেন লিংক
- যে লিংকের গন্তব্যে আর কিছু নেই — সাধারণত সার্ভার 404 দেয়। ফাইলের নাম বদলানো, বানান ভুল বা অন্য সাইট পাতা সরানোয় এমন হয়।যেখানে শিখবেন: পর্ব ০৫পর্ব ১৫
- Browser (ব্রাউজার)ব্রাউজার
- যে প্রোগ্রাম সার্ভার থেকে HTML, CSS, JavaScript এনে পড়ে এবং পাতা এঁকে দেখায় — যেমন Chrome, Edge, Firefox, Safari. ওয়েবে এটিই clientযেখানে শিখবেন: পর্ব ০১পর্ব ০২পর্ব ৫৭
- Browser fingerprintingব্রাউজার ফিঙ্গারপ্রিন্টিং
- কুকি ছাড়াই ব্রাউজার আর ডিভাইসের নানা ছোট তথ্য (পর্দার মাপ, ফন্ট, সেটিং ইত্যাদি) মিলিয়ে একজন ব্যবহারকারীকে আলাদা করে চেনার কৌশল। গোপনীয়তার জন্য ঝুঁকিযেখানে শিখবেন: পর্ব ৩১
- Browser support policyব্রাউজার সাপোর্ট পলিসি
- একটি প্রজেক্টের লিখিত সিদ্ধান্ত — কোন ব্রাউজার ও সংস্করণে পূর্ণ অভিজ্ঞতা, কোথায় শুধু মূল কাজ, আর কোথায় কোনো নিশ্চয়তা নেই। নতুন ফিচার ব্যবহার আর পরীক্ষার পরিকল্পনা এর ওপর দাঁড়ায়যেখানে শিখবেন: পর্ব ৪৮
- Browser zoom (পাতা বড় করা)ব্রাউজার জুম
- Ctrl আর + চেপে পুরো পাতা বড় করা। ব্রাউজার তখন প্রতিটি CSS px-কে বেশি ডিভাইস pixel দিয়ে আঁকে, ফলে পাতার কাছে viewport ছোট হয়ে যায় আর media query সেই অনুযায়ী সাড়া দেয় — ২০০% zoom-এ ১২৮০px জানালা হয় ৬৪০ CSS px.যেখানে শিখবেন: পর্ব ৪৫
- browser-compat-data (BCD)ব্রাউজার কমপ্যাট ডেটা
- MDN-এর রক্ষণাবেক্ষণ করা একটি উন্মুক্ত তথ্যভান্ডার, যেখানে প্রতিটি ওয়েব ফিচার কোন ব্রাউজারের কোন সংস্করণে এসেছে তা যন্ত্রে পড়ার মতো করে লেখা থাকে। MDN-এর টেবিল, Baseline আর বিভিন্ন editor ও টুল এই তথ্য ব্যবহার করেযেখানে শিখবেন: পর্ব ৪৮
- browserslistব্রাউজারস-লিস্ট
- একটি প্রজেক্ট কোন কোন ব্রাউজার সমর্থন করবে, তা ছোট কয়েকটি লাইনে লেখার প্রচলিত ব্যবস্থা — যেমন last 2 versions বা > 0.5% in BD. Autoprefixer-সহ অনেক build টুল একই তালিকা পড়েযেখানে শিখবেন: পর্ব ৪৮পর্ব ৫০পর্ব ৫৮
- Build stepবিল্ড স্টেপ
- পাতা প্রকাশের আগে নিজের কম্পিউটারে (বা সার্ভারে) টুল চালিয়ে উৎস ফাইল থেকে ব্রাউজারের উপযোগী চূড়ান্ত ফাইল তৈরির ধাপ — যেমন .scss থেকে .css বানানো বা ফাইল ছোট করাযেখানে শিখবেন: পর্ব ৫০পর্ব ৫১
- Bézier curve (বেজিয়ে বাঁক)বেজিয়ে কার্ভ
- এক বা দুটি control point দিয়ে নিয়ন্ত্রিত মসৃণ বাঁক। control point বাঁকটিকে চুম্বকের মতো নিজের দিকে টানে, কিন্তু বাঁক সাধারণত তার ওপর দিয়ে যায় না। SVG-তে Q (একটি control point) আর C (দুটি)যেখানে শিখবেন: পর্ব ৪৪
C
- Cache (ক্যাশ)ক্যাশ
- আগে আনা তথ্যের একটি কপি কাছাকাছি জমা রাখার জায়গা, যাতে পরের বার আবার দূর থেকে আনতে না হয় — ফলে দ্রুত হয়যেখানে শিখবেন: পর্ব ০১পর্ব ১৩পর্ব ১৬
- Cache bustingক্যাশ বাস্টিং
- ফাইল বদলানোর পর তার ঠিকানা একটু বদলে দেওয়া (যেমন style.css?v=2), যাতে ব্রাউজার ক্যাশের পুরোনো কপি না দেখিয়ে নতুন ফাইল আনে।যেখানে শিখবেন: পর্ব ১৬পর্ব ৪৯পর্ব ৫৩
- Cache-Controlক্যাশ-কন্ট্রোল
- সার্ভারের পাঠানো একটি HTTP header, যা ব্রাউজারকে বলে ফাইলটি কতদিন নিজের কাছে রেখে আবার না চেয়ে ব্যবহার করা যাবে — যেমন max-age=604800 মানে ৭ দিনযেখানে শিখবেন: পর্ব ৪৯
- calc()ক্যালক
- CSS-এর হিসাবের function, যা আলাদা একক মিশিয়ে যোগ-বিয়োগ-গুণ-ভাগ করে, যেমন calc(100% - 2rem). + আর − চিহ্নের দুই পাশে ফাঁকা জায়গা বাধ্যতামূলকযেখানে শিখবেন: পর্ব ২০পর্ব ৩৩
- Can I use (caniuse.com)ক্যান আই ইউজ
- একটি জনপ্রিয় ওয়েবসাইট, যেখানে কোনো HTML, CSS বা JavaScript ফিচারের নাম লিখলে প্রতিটি ব্রাউজারের প্রতিটি সংস্করণে সেটি আছে কি না, কত শতাংশ ব্যবহারকারী পান, আর পরিচিত সমস্যাগুলো কী — তা ছকে দেখায়যেখানে শিখবেন: পর্ব ৪৮পর্ব ৫৭
- Canonical URL (rel="canonical")ক্যাননিক্যাল ইউআরএল
- একই বা প্রায় একই লেখা কয়েকটি ঠিকানায় থাকলে <link rel="canonical"> দিয়ে জানানো “আসল” ঠিকানা। সার্চ ইঞ্জিন একে জোরালো ইঙ্গিত হিসেবে নেয়, আদেশ হিসেবে নয়যেখানে শিখবেন: পর্ব ১৩পর্ব ১৫পর্ব ৫৪
- Captionsক্যাপশনস
- ভিডিওর কথার লিখিত রূপ, সাথে গুরুত্বপূর্ণ শব্দের বর্ণনাও (যেমন [দরজায় টোকা]) — যাঁরা কানে শোনেন না তাঁদের জন্য। শুধু কথা বা অনুবাদ হলে তাকে বলে subtitles.যেখানে শিখবেন: পর্ব ০৬
- Carouselক্যারোসেল
- একই জায়গায় পাশাপাশি সাজানো কয়েকটি কার্ড, ছবি বা স্লাইড, যা আড়াআড়ি স্ক্রল, সোয়াইপ বা বোতাম দিয়ে একটির পর একটি দেখা যায় — অনলাইন দোকানের পণ্যের সারির মতোযেখানে শিখবেন: পর্ব ৪২
- Cascadeক্যাসকেড
- একই element-এর একই property-তে একাধিক নিয়ম পড়লে কোনটি জিতবে, তা ঠিক করার CSS-এর পদ্ধতি — উৎস, গুরুত্ব, specificity আর লেখার ক্রম মিলিয়ে। সব সমান হলে পরে লেখা নিয়ম জেতে।যেখানে শিখবেন: পর্ব ১৭পর্ব ১৮পর্ব ১৯
- Cascade layer (@layer)ক্যাসকেড লেয়ার
- CSS নিয়মকে নাম দেওয়া আলাদা তাকে রাখার উপায়। সাধারণ declaration-এ পরে ঘোষিত layer আগেরটিকে হারায়, আর layer-এর বাইরের CSS সবাইকে — specificity-র হিসাবের আগেই; !important-এ এই ক্রম উল্টে যায়।যেখানে শিখবেন: পর্ব ১৮পর্ব ৩৫পর্ব ৪৬
- Cascade originক্যাসকেড অরিজিন
- একটি CSS declaration কোথা থেকে এসেছে — ব্রাউজারের ডিফল্ট (user-agent), পাঠকের নিজের (user), নাকি সাইটের লেখকের (author). cascade-এর প্রথম বিচার এটাই।যেখানে শিখবেন: পর্ব ১৮
- Case-insensitiveকেস-ইনসেনসিটিভ
- বড় হাতের আর ছোট হাতের অক্ষরকে একই ধরা। HTML-এ tag আর attribute-এর নাম case-insensitive, কিন্তু id বা class-এর মান নয়যেখানে শিখবেন: পর্ব ০৩পর্ব ১৭
- Case-sensitiveকেস-সেনসিটিভ
- বড় হাতের আর ছোট হাতের অক্ষরকে আলাদা ধরা। Linux সার্ভারে About.html আর about.html দুটি ভিন্ন ফাইল, কিন্তু Windows-এ সাধারণত একইযেখানে শিখবেন: পর্ব ০২পর্ব ১৫পর্ব ১৭
- CDN (Content Delivery Network)সিডিএন
- সারা পৃথিবীতে ছড়ানো সার্ভারের একটি নেটওয়ার্ক, যা ব্যবহারকারীর কাছের সার্ভার থেকে ফাইল (CSS, JavaScript, ছবি) পাঠায়, ফলে দ্রুত লোড হয় — যেমন jsDelivr, cdnjs.যেখানে শিখবেন: পর্ব ৫১পর্ব ৫৩
- chসি-এইচ
- বর্তমান ফন্টে “0” অঙ্কটির চওড়ার সমান একক। লাইনের দৈর্ঘ্য সীমিত রাখতে কাজের, যেমন max-width: 65ch; বাংলা লেখায় এটি আনুমানিক মাপযেখানে শিখবেন: পর্ব ২০পর্ব ২১
- Changes panelচেঞ্জেস প্যানেল
- DevTools-এর যে প্যানেল সেশনে করা সব CSS বদল ফাইল ধরে diff আকারে দেখায় — কী মুছেছেন, কী যোগ করেছেন — আর সব বদল একসাথে কপি করতে দেয়, যাতে নিজের ফাইলে তুলে নেওয়া যায়যেখানে শিখবেন: পর্ব ৪৭
- Character classক্যারেক্টার ক্লাস
- regex-এ বর্গ বন্ধনীর অংশ, যেমন [3-9] বা [0-9] — মানে ওই জায়গায় তালিকার যেকোনো একটি অক্ষর বসতে পারে।যেখানে শিখবেন: পর্ব ০৯
- Character encodingক্যারেক্টার এনকোডিং
- অক্ষরের নম্বরগুলোকে ফাইলে বা নেটওয়ার্কে বাইট হিসেবে লেখার নিয়ম, যেমন UTF-8 বা windows-1252 — ভুল নিয়মে পড়লে লেখা ভেঙে যায়যেখানে শিখবেন: পর্ব ১৪
- Character entityক্যারেক্টার এনটিটি
- & দিয়ে শুরু আর ; দিয়ে শেষ হওয়া বিশেষ লেখা, যা একটি অক্ষর বোঝায় — যেমন < মানে < চিহ্ন, আর মানে এমন space যেখানে লাইন ভাঙে নাযেখানে শিখবেন: পর্ব ০৩
- Character reference (HTML entity)ক্যারেক্টার রেফারেন্স
- & দিয়ে শুরু ও ; দিয়ে শেষ হওয়া সংকেত, যা একটি অক্ষর বসায় — নাম দিয়ে (<, ©) বা নম্বর দিয়ে (৳, ৳); লেখায় < ও & দেখাতে লাগেযেখানে শিখবেন: পর্ব ০৪
- Checkboxচেকবক্স
- টিক দেওয়া যায় এমন চৌকো ঘর (<input type="checkbox">). প্রতিটি স্বাধীন, তাই একসাথে যত খুশি বাছা যায়; টিক না থাকলে জমার সময় কিছুই পাঠায় না।যেখানে শিখবেন: পর্ব ০৯পর্ব ৪৩
- Checkbox hackচেকবক্স হ্যাক
- লুকানো checkbox আর :checked সিলেক্টর দিয়ে JavaScript ছাড়া খোলা-বন্ধের কৌশল। চোখে কাজ করে, কিন্তু screen reader ভুল ভূমিকা (চেকবক্স) শোনায়; আজ details, popover আর dialog এর ভালো বিকল্প।যেখানে শিখবেন: পর্ব ৫৯
- Child (element)চাইল্ড
- কোনো element-এর সরাসরি ভেতরের element বা node — তার সন্তান। একটি element-এর শূন্য থেকে অনেক child থাকতে পারেযেখানে শিখবেন: পর্ব ০৩পর্ব ১৭পর্ব ১৮
- Child combinator (>)চাইল্ড কম্বিনেটর
- > চিহ্ন, যেমন ul > li — শুধু বাঁয়েরটির সরাসরি সন্তানকে ধরে, নাতি-নাতনিকে নয়।যেখানে শিখবেন: পর্ব ১৭পর্ব ৫৭
- Chrome DevTools Protocol (CDP)ক্রোম ডেভটুলস প্রোটোকল
- যে বার্তা-ব্যবস্থার মাধ্যমে DevTools-এর ইন্টারফেস ব্রাউজারের ইঞ্জিনের সাথে কথা বলে। Puppeteer, Playwright আর Lighthouse-এর মতো টুলও এই প্রোটোকল দিয়ে কোড থেকে ব্রাউজার চালায়যেখানে শিখবেন: পর্ব ৪৭
- clamp()ক্ল্যাম্প
- তিনটি মান নেওয়া CSS function — clamp(সর্বনিম্ন, পছন্দের, সর্বোচ্চ). পছন্দের মানটি নেয়, কিন্তু সর্বনিম্নের নিচে বা সর্বোচ্চের ওপরে যেতে দেয় না; max(MIN, min(VAL, MAX))-এর সমান।যেখানে শিখবেন: পর্ব ৩৫পর্ব ৫৪পর্ব ৫৬
- Class selectorক্লাস সিলেক্টর
- বিন্দু আর class-এর নাম দিয়ে লেখা selector, যেমন .sale — যে element-এর class attribute-এ ওই শব্দটি আছে, সবাইকে ধরে। একই class অনেক element-এ দেওয়া যায়।যেখানে শিখবেন: পর্ব ১৭পর্ব ৫৭
- Classless CSSক্লাসলেস সিএসএস
- এমন stylesheet যা কোনো class ছাড়াই সরাসরি HTML ট্যাগ (h1, button, input, table) সাজায়, তাই সঠিক অর্থবহ HTML লিখলেই পাতা সুন্দর দেখায় — যেমন Pico.css-এর classless সংস্করণ।যেখানে শিখবেন: পর্ব ৫১
- classListক্লাস লিস্ট
- element-এর class-গুলোর তালিকা, যার add(), remove(), contains() আর toggle() method দিয়ে JavaScript একটি class যোগ, বাদ বা উল্টে দিতে পারে — অন্য class না ছুঁয়েইযেখানে শিখবেন: পর্ব ৫২
- Clearfixক্লিয়ারফিক্স
- float দিয়ে লেআউটের যুগের পুরোনো কৌশল: parent-এর শেষে ::after দিয়ে একটি অদৃশ্য বাক্স বসিয়ে clear: both দেওয়া, যাতে parent ভেতরের float-কে ঘিরে রাখে। আজ display: flow-root এর কাজ করেযেখানে শিখবেন: পর্ব ২৩পর্ব ২৫পর্ব ৫৭
- Clickjackingক্লিকজ্যাকিং
- প্রতারণার কৌশল, যেখানে অদৃশ্য iframe-এ অন্য সাইটের পাতা বসিয়ে ব্যবহারকারীকে দিয়ে না জেনেই সেখানে চাপ দেওয়ানো হয়। X-Frame-Options বা CSP frame-ancestors দিয়ে ঠেকানো হয়।যেখানে শিখবেন: পর্ব ০৬
- Client (ক্লায়েন্ট)ক্লায়েন্ট
- যে পক্ষ সার্ভারের কাছে কিছু চায় বা request পাঠায়। ওয়েবে সাধারণত আপনার ফোন বা কম্পিউটারের ব্রাউজারযেখানে শিখবেন: পর্ব ০১
- Client Hintsক্লায়েন্ট হিন্টস
- HTTP header-এর একটি ব্যবস্থা, যাতে সার্ভার চাইলে ব্রাউজার যন্ত্রের তথ্য (যেমন DPR, viewport-এর চওড়া) জানায়, আর সার্ভার সেই অনুযায়ী ফাইল পাঠায়। শুধু Chromium-ভিত্তিক ব্রাউজারে আছে, Baseline নয়।যেখানে শিখবেন: পর্ব ৩২
- Client-server modelক্লায়েন্ট-সার্ভার মডেল
- কাজ ভাগ করার একটি নকশা: client অনুরোধ পাঠায়, server অনুরোধ শুনে উত্তর দেয়। ওয়েব, ইমেইল, অনলাইন ব্যাংকিং — সব এভাবে চলেযেখানে শিখবেন: পর্ব ০১
- Client-side validationক্লায়েন্ট-সাইড ভ্যালিডেশন
- ব্যবহারকারীর ব্রাউজারেই তথ্য যাচাই — HTML attribute বা JavaScript দিয়ে। দ্রুত ভুল ধরায়, কিন্তু ব্যবহারকারী চাইলে এড়াতে পারেন, তাই এটি নিরাপত্তা নয়।যেখানে শিখবেন: পর্ব ০৯পর্ব ১৫পর্ব ৫৭
- clip-pathক্লিপ-পাথ
- element-কে একটি আকৃতির রেখা ধরে কেটে ফেলার property — রেখার ভেতরটা দেখা যায়, বাইরেটা পুরো অদৃশ্য; circle(), ellipse(), inset(), polygon() দিয়ে আকৃতি দেওয়া হয়যেখানে শিখবেন: পর্ব ৪১পর্ব ৫৬
- Clone (ক্লোন)ক্লোন
- একটি remote repository-র পুরো ইতিহাসসহ সম্পূর্ণ কপি নিজের কম্পিউটারে নামানোযেখানে শিখবেন: পর্ব ৫৩
- CLS (Cumulative Layout Shift)সি-এল-এস
- পুরো পাতায় অপ্রত্যাশিত layout shift-এর মোট মাপ। Core Web Vitals-এর একটি; ০.১ বা কম হলে ভালো ধরা হয়।যেখানে শিখবেন: পর্ব ০৬পর্ব ২১পর্ব ৩২
- Code editorকোড এডিটর
- কোড লেখার জন্য বানানো প্রোগ্রাম। সাধারণ লেখার সফটওয়্যারের মতো, কিন্তু কোড রঙিন করে দেখায়, ভুল ধরিয়ে দেয় আর অনেক কাজ দ্রুত করে দেয়। যেমন VS Codeযেখানে শিখবেন: পর্ব ০২
- Code pointকোড পয়েন্ট
- Unicode-এ একটি অক্ষরের নির্দিষ্ট নম্বর, সাধারণত U+ দিয়ে hex-এ লেখা হয় — যেমন ক মানে U+0995যেখানে শিখবেন: পর্ব ১৪
- Codecকোডেক
- ভিডিও বা শব্দকে সংকোচন (encode) আর আবার খোলার (decode) পদ্ধতি — যেমন H.264, VP9, AV1, AAC, Opus. ফাইলের ধরন (MP4, WebM) হলো মোড়ক, ভেতরে থাকে codec-এ সংকুচিত ডেটা।যেখানে শিখবেন: পর্ব ০৬
- colgroup / colকলগ্রুপ / কল
- <colgroup>-এর ভেতরের প্রতিটি <col> টেবিলের একটি (বা span দিয়ে কয়েকটি) কলামের প্রতিনিধি। এতে পুরো কলামে background, border, width বা visibility দেওয়া যায়।যেখানে শিখবেন: পর্ব ০৭
- Collationকোলেশন
- কোনো ভাষার নিয়ম মেনে শব্দ সাজানো আর তুলনা করার পদ্ধতি — শুধু code point-এর নম্বর ধরে নয়। JavaScript-এ Intl.Collator এ কাজ করেযেখানে শিখবেন: পর্ব ১৪
- Color interpolationকালার ইন্টারপোলেশন
- দুটি রঙের মাঝের রংগুলো হিসাব করার পদ্ধতি; কোন রঙ-জগতে (sRGB, oklch ইত্যাদি) মেশানো হচ্ছে তার ওপর ফল বদলায়যেখানে শিখবেন: পর্ব ২২
- Color spaceকালার স্পেস
- রংকে সংখ্যায় প্রকাশ করার একটি নির্দিষ্ট পদ্ধতি ও তার সীমা, যেমন sRGB, Display P3, Oklab. একই রং আলাদা color space-এ আলাদা সংখ্যায় লেখা হয়যেখানে শিখবেন: পর্ব ২০
- Color stopকালার স্টপ
- gradient-এর ভেতরে একটি রং আর তার অবস্থান, যেমন red 40% — দুই stop-এর মাঝের জায়গায় ব্রাউজার রং মেশায়যেখানে শিখবেন: পর্ব ২২
- color-mix()কালার-মিক্স
- দুটি রং নির্দিষ্ট অনুপাতে মিশিয়ে নতুন রং বানানোর CSS function, যেমন color-mix(in oklch, #006A4E 60%, white). কোন color space-এ মেশানো হবে তাও বলে দিতে হয়যেখানে শিখবেন: পর্ব ২০পর্ব ৫০
- color-schemeকালার স্কিম
- কোনো অংশ হালকা না অন্ধকার নকশার, তা ব্রাউজারকে জানানোর CSS property (light, dark বা light dark). ব্রাউজার সেই অনুযায়ী ফর্ম কন্ট্রোল, scrollbar আর system color আঁকে।যেখানে শিখবেন: পর্ব ৩৫পর্ব ৩৬পর্ব ৪৩
- colspanকলস্প্যান
- টেবিলের ঘরের attribute — ঘরটি ডান দিকে কয়টি কলাম জুড়ে থাকবে। যেমন colspan="2" মানে দুই কলাম চওড়া ঘর।যেখানে শিখবেন: পর্ব ০৭পর্ব ৫৭
- Combinatorকম্বিনেটর
- দুটি selector-এর মাঝের সম্পর্ক-চিহ্ন — ফাঁকা জায়গা (ভেতরে যেকোনো গভীরতায়), > (সরাসরি সন্তান), + (ঠিক পরের ভাই-বোন), ~ (পরের সব ভাই-বোন). ফল সবসময় ডান দিকের element.যেখানে শিখবেন: পর্ব ১৭পর্ব ১৮পর্ব ৫৬
- Comment (CSS)কমেন্ট
- /* আর */-এর মাঝে লেখা নোট, যা ব্রাউজার উপেক্ষা করে। CSS-এ এটিই comment-এর একমাত্র রূপ — // বা <!-- --> এখানে comment নয়।যেখানে শিখবেন: পর্ব ১৬
- Comment (HTML)কমেন্ট
- <!-- --> দিয়ে ঘেরা নোট, যা পাতায় দেখা যায় না কিন্তু view source-এ সবাই পড়তে পারে। তাই গোপন তথ্য রাখা যাবে নাযেখানে শিখবেন: পর্ব ০৩
- Commit (কমিট)কমিট
- প্রজেক্টের একটি সংরক্ষিত মুহূর্তের ছবি (snapshot), সাথে একটি বার্তা, লেখকের নাম, সময় আর একটি অনন্য hash নম্বরযেখানে শিখবেন: পর্ব ৫৩
- Commit hash (কমিট হ্যাশ)কমিট হ্যাশ
- প্রতিটি commit-এর অনন্য পরিচয় নম্বর — commit-এর ভেতরের সবকিছু থেকে হিসাব করা ৪০ অক্ষরের একটি hex সংখ্যা, যেমন 3f2a1b7… সাধারণত প্রথম ৭টি অক্ষরই যথেষ্টযেখানে শিখবেন: পর্ব ৫৩
- Commit message (কমিট বার্তা)কমিট মেসেজ
- প্রতিটি commit-এর সাথে লেখা ছোট বিবরণ — এই পরিবর্তন কী করে আর কেন। ভবিষ্যতের আপনি বা সহকর্মী ইতিহাস পড়বেন এটা দিয়েইযেখানে শিখবেন: পর্ব ৫৩
- Component (UI component)কম্পোনেন্ট
- পাতার একটি স্বয়ংসম্পূর্ণ, বারবার ব্যবহারযোগ্য অংশ, যেমন পণ্যের কার্ড, বোতাম বা নোটিশ বক্স। একই component পাতার নানা জায়গায় বসানো হয়যেখানে শিখবেন: পর্ব ৩১পর্ব ৫১
- Component libraryকম্পোনেন্ট লাইব্রেরি
- বোতাম, modal, dropdown, tab-এর মতো তৈরি UI component-এর সংগ্রহ, যা একটি CSS framework বা JavaScript framework-এর ওপর বানানো — যেমন Tailwind-এর ওপর daisyUI বা shadcn/ui.যেখানে শিখবেন: পর্ব ৫১
- Component variantকম্পোনেন্ট ভ্যারিয়েন্ট
- একই component-এর একটু ভিন্ন রূপ — যেমন সাধারণ, বিপদের আর হালকা বাটন। custom property দিয়ে variant বানালে শুধু component-এর নিজের variable বদলাতে হয়, পুরো CSS আবার লিখতে হয় নাযেখানে শিখবেন: পর্ব ৩৩
- Compositing (কম্পোজিটিং)কম্পোজিটিং
- rendering-এর শেষ ধাপ — আলাদা আলাদা স্তরে (layer) আঁকা অংশগুলো GPU একসাথে জুড়ে চূড়ান্ত ছবি পর্দায় দেখায়। স্ক্রল ও অ্যানিমেশন মসৃণ রাখতে সাহায্য করেযেখানে শিখবেন: পর্ব ০১পর্ব ২২পর্ব ২৪
- Compositionকম্পোজিশন
- ছোট ছোট স্বাধীন অংশ (layout-এর class, component, utility) জুড়ে বড় নকশা বানানোর পদ্ধতি — নতুন নকশা মানে প্রায়ই পুরোনো অংশের নতুন জোড়া।যেখানে শিখবেন: পর্ব ৪৬
- Compositor layerকম্পোজিটর লেয়ার
- পাতার যে অংশ ব্রাউজার আলাদা একটি ছবি (স্তর) হিসেবে আঁকে, যাতে GPU সেটিকে আবার না এঁকেই সরাতে, বড়-ছোট করতে বা স্বচ্ছ করতে পারে। transform আর opacity-র অ্যানিমেশন এ কারণেই সস্তা; তবে প্রতিটি স্তর মেমরি খরচ করেযেখানে শিখবেন: পর্ব ৩৮পর্ব ৩৯
- Compositor threadকম্পোজিটর থ্রেড
- main thread থেকে আলাদা একটি কাজের ধারা, যা আগে আঁকা স্তরগুলো জুড়ে পর্দায় পাঠায়। transform আর opacity-র animation এখানে চলতে পারে, তাই JavaScript ব্যস্ত থাকলেও মসৃণ থাকেযেখানে শিখবেন: পর্ব ৩৯পর্ব ৫৭
- Compound selectorকম্পাউন্ড সিলেক্টর
- মাঝে কোনো ফাঁকা বা combinator ছাড়া পাশাপাশি লেখা কয়েকটি শর্ত, যেমন li.card.sale — একই element-কে সবগুলো শর্ত মানতে হয়।যেখানে শিখবেন: পর্ব ১৭
- Computed tabকম্পিউটেড ট্যাব
- DevTools-এর যে ট্যাব একটি element-এর প্রতিটি CSS property-র শেষ পর্যন্ত বসা মান দেখায়, আর property খুললে জানায় কোন নিয়ম সেটি বসিয়েছে ও কোন নিয়মগুলো হেরেছে; সাথে box model-এর ছবিযেখানে শিখবেন: পর্ব ৪৭
- Computed valueকম্পিউটেড ভ্যালু
- cascade-এর পর ব্রাউজার যে মান হিসাব করে, আপেক্ষিক মাপ যতটা সম্ভব পরম করে — যেমন 1.25em থেকে 20px. উত্তরাধিকারে child এই মানটাই পায়।যেখানে শিখবেন: পর্ব ১৮পর্ব ২০পর্ব ৩৩
- Conformance level (A, AA, AAA)কনফরম্যান্স লেভেল
- WCAG মানার স্তর: A ন্যূনতম, AA সাধারণ লক্ষ্য (আইন ও চুক্তিতে সাধারণত এটিই চাওয়া হয়), AAA সর্বোচ্চযেখানে শিখবেন: পর্ব ১২
- Console (কনসোল)কনসোল
- DevTools-এর যে প্যানেলে error, সতর্কবার্তা আর console.log-এর লেখা দেখা যায়; এখানে ছোট JavaScript লিখে সাথে সাথে চালানোও যায়যেখানে শিখবেন: পর্ব ০২
- Constraint validationকনস্ট্রেইন্ট ভ্যালিডেশন
- ব্রাউজারের নিজের ফর্ম-যাচাই ব্যবস্থা: required, pattern, min-এর মতো শর্ত দেখে জমার আগে প্রতিটি ঘর মেলায়, ভুল পেলে জমা আটকায় আর বার্তা দেখায়।যেখানে শিখবেন: পর্ব ০৯পর্ব ৫৪পর্ব ৫৬
- contain-intrinsic-sizeকনটেইন-ইনট্রিনসিক-সাইজ
- ভেতরের জিনিস আঁকা না হলে element-টি কত বড় ধরে নেওয়া হবে, তার আন্দাজি মাপ। content-visibility: auto-র সাথে লাগে, নইলে না-আঁকা অংশের উচ্চতা শূন্য হয়ে scrollbar লাফায়; auto লিখলে ব্রাউজার শেষবারের আসল মাপ মনে রাখেযেখানে শিখবেন: পর্ব ৪৯
- Container query (@container)কনটেইনার কোয়েরি
- media query-র মতো শর্ত, তবে পুরো পর্দার বদলে একটি নির্দিষ্ট container element-এর মাপ দেখে। ফলে একই component সরু বা চওড়া জায়গায় বসে নিজের চেহারা বদলাতে পারে। এর জন্য container-এ container-type দিতে হয়।যেখানে শিখবেন: পর্ব ২৮পর্ব ২৯পর্ব ৩১
- Container query unitsকন্টেইনার কোয়েরি ইউনিটস
- cqw, cqh, cqi, cqb ইত্যাদি একক, যা পুরো জানালার বদলে কাছের container-এর মাপের শতাংশ দেয়। container query-র অংশযেখানে শিখবেন: পর্ব ২০পর্ব ৩১পর্ব ৫৭
- container-nameকনটেইনার নেম
- container-কে একটি নাম দেওয়ার property, যাতে @container নাম (শর্ত) লিখে নির্দিষ্ট পাত্রকেই জিজ্ঞেস করা যায়, সবচেয়ে কাছের পাত্রকে নয়। shorthand: container: নাম / inline-sizeযেখানে শিখবেন: পর্ব ৩১
- container-typeকনটেইনার টাইপ
- যে property একটি element-কে container query-র পাত্র বানায়। inline-size দিলে তার চওড়া দেখে, size দিলে চওড়া আর উচ্চতা দুটোই দেখে ভেতরের element-এর নিয়ম ঠিক করা যায়যেখানে শিখবেন: পর্ব ৩১পর্ব ৫৪
- Containing blockকনটেইনিং ব্লক
- যে আয়তক্ষেত্রের সাপেক্ষে একটি বাক্সের মাপ ও অবস্থান হিসাব হয় — সাধারণ লেআউটে parent-এর content অংশ, আর absolute বাক্সের বেলায় নিকটতম positioned পূর্বপুরুষের padding-এর কিনারা। শতাংশ (%) দিলে এর মাপ থেকেই হিসাব হয়।যেখানে শিখবেন: পর্ব ১৯পর্ব ২০পর্ব ২৩
- Content area (content box)কনটেন্ট এরিয়া
- বাক্সের একেবারে ভেতরের অংশ, যেখানে লেখা, ছবি বা ভেতরের element বসে। ডিফল্ট নিয়মে width আর height এই অংশেরই মাপ।যেখানে শিখবেন: পর্ব ১৯
- Content categoryকনটেন্ট ক্যাটাগরি
- HTML Living Standard-এ element-গুলোর ভাগ — flow, phrasing, heading, sectioning, embedded, interactive, metadata — যা ঠিক করে কোন element কার ভেতরে বসতে পারেযেখানে শিখবেন: পর্ব ০৪
- Content inventoryকনটেন্ট ইনভেন্টরি
- সাইটে যা যা থাকবে — লেখা, ছবি, লিংক, ফর্ম — তার পূর্ণ তালিকা, নকশা বা কোড শুরুর আগেই বানানো। কিছু বাদ পড়া বা দুবার আসা ঠেকায়।যেখানে শিখবেন: পর্ব ৫৪পর্ব ৫৭
- Content negotiationকনটেন্ট নেগোসিয়েশন
- একই ঠিকানা থেকে ব্রাউজারের পাঠানো header (যেমন Accept) দেখে সার্ভারের আলাদা রূপ পাঠানো — যেমন যে ব্রাউজার AVIF চেনে তাকে AVIF, বাকিদের JPEG.যেখানে শিখবেন: পর্ব ৩২
- Content on Hover or Focus (WCAG 1.4.13)কনটেন্ট অন হোভার অর ফোকাস
- WCAG-এর AA শর্ত: hover বা focus-এ যে tooltip বা পপআপ আসে, তা মাউস না সরিয়েই বন্ধ করা যাবে (যেমন Esc), তার ওপর মাউস নিলে হারাবে না, আর ব্যবহারকারী সরিয়ে না দেওয়া পর্যন্ত থাকবে।যেখানে শিখবেন: পর্ব ৪৫পর্ব ৫৯
- Content-Type headerকনটেন্ট-টাইপ হেডার
- সার্ভারের উত্তরের সাথে আসা একটি HTTP তথ্য, যা বলে ফাইলটি কী ধরনের আর কোন encoding-এ — যেমন text/html; charset=utf-8যেখানে শিখবেন: পর্ব ১৪
- content-visibilityকনটেন্ট-ভিজিবিলিটি
- যে CSS property দিয়ে ব্রাউজারকে বলা যায়, পর্দার বাইরে থাকা অংশের layout আর paint আপাতত বাদ রাখো (auto). অংশটি পর্দার কাছে এলে তবেই আঁকা হয়, তবে লেখা খোঁজা ও অ্যাক্সেসিবিলিটিতে থেকে যায়যেখানে শিখবেন: পর্ব ৪৯পর্ব ৫৮
- content-এর alt textঅল্ট টেক্সট
- content property-তে স্ল্যাশের পরে দেওয়া বিকল্প লেখা, যেমন content: "★" / "" — স্ল্যাশের আগেরটি চোখে দেখা যায়, পরেরটি screen reader পড়ে; খালি রাখলে চিহ্নটি উপেক্ষা করা হয়যেখানে শিখবেন: পর্ব ৩৪পর্ব ৫৯
- Continuous deployment (অটো-ডিপ্লয়)কন্টিনিউয়াস ডিপ্লয়মেন্ট
- repository-তে push করলেই হোস্টিং সেবা নিজে থেকে নতুন সংস্করণ বানিয়ে প্রকাশ করে — হাতে ফাইল তুলতে হয় নাযেখানে শিখবেন: পর্ব ৫৩
- Contrast ratioকনট্রাস্ট রেশিও
- লেখা আর পেছনের রঙের আপেক্ষিক উজ্জ্বলতার অনুপাত, ১:১ থেকে ২১:১. WCAG AA-তে সাধারণ লেখার জন্য অন্তত ৪.৫:১, বড় লেখা আর UI অংশের জন্য ৩:১যেখানে শিখবেন: পর্ব ২০পর্ব ২২পর্ব ২৭
- Control directiveকন্ট্রোল ডিরেক্টিভ
- Sass-এর @if, @else, @each, @for আর @while — শর্ত আর loop দিয়ে compile-এর সময় কোন CSS তৈরি হবে তা ঠিক করার নিয়মযেখানে শিখবেন: পর্ব ৫০
- Cookieকুকি
- কোনো ওয়েবসাইট ব্রাউজারে যে ছোট তথ্য জমা রাখে, আর পরের প্রতিটি অনুরোধে ফেরত পায় — লগইন মনে রাখা বা ব্যবহারকারীকে ট্র্যাক করার কাজে লাগে।যেখানে শিখবেন: পর্ব ০৬পর্ব ৩৬পর্ব ৫৭
- Core Web Vitalsকোর ওয়েব ভাইটালস
- Google-এর ঠিক করা তিনটি মাপকাঠি, যা দিয়ে বোঝা হয় পাতাটি ব্যবহারকারীর কাছে কত দ্রুত ও স্থির — LCP (লোডের গতি), INP (সাড়া দেওয়ার গতি) আর CLS (স্থিরতা).যেখানে শিখবেন: পর্ব ০৬পর্ব ১৩পর্ব ৪৯
- CORS (Cross-Origin Resource Sharing)কর্স
- অন্য ডোমেইনের ফাইল ব্যবহারের অনুমতির নিয়ম — সেই সার্ভার বিশেষ HTTP header পাঠিয়ে জানায় কোন সাইট তার ফাইল পড়তে পারবেযেখানে শিখবেন: পর্ব ৪১পর্ব ৪৭
- Counter styleকাউন্টার স্টাইল
- তালিকার নম্বর কোন চিহ্নে লেখা হবে তার নিয়ম, যেমন decimal, lower-alpha বা bengali; CSS-এর list-style-type দিয়ে বেছে নেওয়া হয়যেখানে শিখবেন: পর্ব ১৪পর্ব ৩৪
- Coverage panelকভারেজ প্যানেল
- DevTools-এর যে প্যানেল প্রতিটি CSS ও JavaScript ফাইলের কতটা অংশ এই পাতায় এখন পর্যন্ত ব্যবহার হয়েছে আর কতটা হয়নি, তা মাপে; লাল মানে এখনো লাগেনি — কখনো লাগবে না, এমন নয়যেখানে শিখবেন: পর্ব ৪৭
- cPanelসি-প্যানেল
- shared hosting-এর জনপ্রিয় নিয়ন্ত্রণ প্যানেল — ব্রাউজার থেকেই File Manager, ইমেইল, ডেটাবেস, SSL আর domain সামলানো যায়যেখানে শিখবেন: পর্ব ৫৩পর্ব ৫৭
- Crawler (bot, spider)ক্রলার
- যে প্রোগ্রাম নিজে নিজে লিংক ধরে ধরে ওয়েবপাতা ডাউনলোড করে পড়ে — যেমন Google-এর Googlebot, বা শেয়ার-কার্ড বানাতে Facebook-এর crawlerযেখানে শিখবেন: পর্ব ১৩
- Critical CSSক্রিটিক্যাল সিএসএস
- পাতার প্রথম পর্দা আঁকতে যতটুকু CSS লাগে, শুধু সেটুকু head-এ inline রেখে বাকি CSS পরে আনার কৌশল — প্রথম পাতা দ্রুত দেখানোর জন্য।যেখানে শিখবেন: পর্ব ১৬পর্ব ৪৭পর্ব ৪৯
- Critical rendering pathক্রিটিক্যাল রেন্ডারিং পাথ
- HTML, CSS আর JavaScript পেয়ে প্রথম ছবিটি পর্দায় আঁকা পর্যন্ত ব্রাউজারকে যে ধাপগুলো পার হতে হয় — DOM, CSSOM, render tree, layout, paint. এই পথের যেকোনো দেরি প্রথম পর্দাকে দেরি করায়যেখানে শিখবেন: পর্ব ৪৯পর্ব ৫৮
- Cross axisক্রস অ্যাক্সিস
- main axis-এর সমকোণে আড়াআড়ি দিক — row-তে ওপর-নিচ, column-এ বাঁ-ডান। align-items, align-self আর align-content এই অক্ষে কাজ করে।যেখানে শিখবেন: পর্ব ২৫পর্ব ২৬পর্ব ৫৭
- Cross-browser testingক্রস-ব্রাউজার টেস্টিং
- একটি সাইটের মূল কাজ আর চেহারা বিভিন্ন ইঞ্জিন, ব্রাউজার, সংস্করণ আর ডিভাইসে ঠিকমতো চলে কি না যাচাই করা — আসল ফোন, একাধিক ব্রাউজার আর দরকারে ক্লাউড ডিভাইস ল্যাব দিয়েযেখানে শিখবেন: পর্ব ৪৮
- Cross-document view transitionক্রস-ডকুমেন্ট ভিউ ট্রানজিশন
- একই origin-এর এক পাতা থেকে আরেক পাতায় যাওয়ার সময় ব্রাউজার যে অ্যানিমেশন চালায়। দুই পাতাতেই @view-transition { navigation: auto; } লিখলে JavaScript ছাড়াই চালু হয়যেখানে শিখবেন: পর্ব ৩৭পর্ব ৫৪
- CrUX (Chrome User Experience Report)ক্রাক্স
- যেসব Chrome ব্যবহারকারী তথ্য পাঠাতে রাজি, তাঁদের আসল ভিজিট থেকে Google-এর সংগ্রহ করা জনপ্রিয় সাইটগুলোর পারফরম্যান্সের সর্বজনীন ডেটা। PageSpeed Insights-এর “আসল ব্যবহারকারী” অংশ এখান থেকেই আসেযেখানে শিখবেন: পর্ব ৪৯পর্ব ৫৮
- CSSসিএসএস
- Cascading Style Sheets — ওয়েব পেজের চেহারার ভাষা: রং, ফন্ট, ফাঁকা জায়গা, লেআউট, ফোন ও বড় পর্দায় কেমন দেখাবেযেখানে শিখবেন: পর্ব ০১পর্ব ০৪পর্ব ১৬
- CSS animationসিএসএস অ্যানিমেশন
- @keyframes-এ লেখা ধাপ ধরে element-এর চেহারা সময়ের সাথে বদলানোর ব্যবস্থা — কোনো ক্লিক বা hover ছাড়াই নিজে শুরু হয়, বারবার চলতে পারেযেখানে শিখবেন: পর্ব ৩৯পর্ব ৫৬পর্ব ৫৭
- CSS architectureসিএসএস আর্কিটেকচার
- বড় প্রজেক্টে CSS লেখার পরিকল্পিত পদ্ধতি — class-এর নাম রাখার নিয়ম, ফাইল ও ফোল্ডার সাজানো আর কোন নিয়ম কোথায় বসবে তার সিদ্ধান্ত, যাতে কোড বাড়লেও বোঝা, বদলানো আর মোছা সহজ থাকে।যেখানে শিখবেন: পর্ব ৪৬
- CSS Box Alignmentসিএসএস বক্স অ্যালাইনমেন্ট
- justify-items, align-content, justify-self, gap-এর মতো সারিবদ্ধ করার property-গুলোর CSS স্পেসিফিকেশন, যা Flexbox আর Grid দুটোতেই একইভাবে কাজ করেযেখানে শিখবেন: পর্ব ২৭
- CSS containment (contain)কনটেইনমেন্ট
- contain property দিয়ে ব্রাউজারকে দেওয়া প্রতিশ্রুতি যে একটি element-এর ভেতরের পরিবর্তন বাইরের layout বা paint-কে প্রভাবিত করবে না (layout, paint, size, style). এতে ব্রাউজার হিসাবের কাজ ছোট এলাকায় সীমিত রাখতে পারেযেখানে শিখবেন: পর্ব ৪৯
- CSS frameworkসিএসএস ফ্রেমওয়ার্ক
- আগে থেকে লেখা ও পরীক্ষা করা CSS-এর (কখনো সাথে JavaScript) একটি সংগ্রহ, যা grid, তৈরি component বা utility class দেয় — যেমন Bootstrap, Tailwind CSS. ব্রাউজার শেষ পর্যন্ত সাধারণ CSS-ই পায়।যেখানে শিখবেন: পর্ব ৫১পর্ব ৫৭
- CSS Gridসিএসএস গ্রিড
- display: grid দিয়ে চালু হওয়া দুই দিকের লেআউট পদ্ধতি — আগে সারি আর কলামের জাল আঁকা হয়, তারপর item সেই ঘরে বসে। পণ্যের জাল, গ্যালারি আর পুরো পাতার কাঠামোর জন্য উপযুক্ত।যেখানে শিখবেন: পর্ব ২৬পর্ব ২৭পর্ব ২৮
- CSS Houdiniহুডিনি
- কয়েকটি নিম্নস্তরের API-র সমষ্টি, যা ডেভেলপারদের ব্রাউজারের CSS ইঞ্জিনের ভেতরের ধাপে ঢোকার সুযোগ দেয়। @property (Properties and Values API) এর সবচেয়ে সফল অংশ, যা সব প্রধান ব্রাউজারে এসেছেযেখানে শিখবেন: পর্ব ৩৭পর্ব ৪৮
- CSS math functionসিএসএস ম্যাথ ফাংশন
- CSS-এর ভেতরে হিসাব করার function — calc(), min(), max(), clamp(), round() ইত্যাদি। ব্রাউজার পাতা সাজানোর সময় এদের মান বের করে, তাই % বা vw-এর মতো একক মেশানো যায়।যেখানে শিখবেন: পর্ব ৩৫
- CSS module (স্পেসিফিকেশনের মডিউল)সিএসএস মডিউল
- CSS3 থেকে CSS-এর স্পেসিফিকেশন একটি বড় দলিল নয়, অনেকগুলো আলাদা অংশ — যেমন Selectors, Color, Grid. প্রতিটি নিজের Level নম্বরে এগোয় (Selectors Level 4); তাই CSS4 নামে কিছু নেই।যেখানে শিখবেন: পর্ব ১৬
- CSS Modulesসিএসএস মডিউলস
- একটি build-এর কৌশল (ব্রাউজারের feature নয়), যা প্রতিটি CSS ফাইলের class-এর নাম অনন্য করে দেয় — যেমন .title হয়ে যায় .Card_title__x7Gq2 — ফলে নাম-সংঘাত হয় না।যেখানে শিখবেন: পর্ব ৪৬পর্ব ৫৭
- CSS nestingসিএসএস নেস্টিং
- একটি CSS নিয়মের ভেতরে আরেকটি নিয়ম লেখার সুবিধা, যেমন .card { h3 { … } } মানে .card h3. ২০২৩ সালের শেষ থেকে সব প্রধান ব্রাউজারে কোনো টুল ছাড়াই চলে।যেখানে শিখবেন: পর্ব ৩৫পর্ব ৫০পর্ব ৫৭
- CSS pixel (px)সিএসএস পিক্সেল
- CSS-এর মাপের মূল একক — পর্দার একটি বিন্দু নয়, বরং চোখে দেখা একটি নির্দিষ্ট আকারের মাপ। ঘন পর্দায় একটি CSS পিক্সেল আঁকতে কয়েকটি ডিভাইস পিক্সেল লাগেযেখানে শিখবেন: পর্ব ২০পর্ব ৩০পর্ব ৩২
- CSS postprocessorসিএসএস পোস্টপ্রসেসর
- যে টুল সাধারণ CSS ফাইল হাতে নিয়ে তাকে বদলায় — prefix যোগ করা, নতুন নিয়মকে পুরোনো ব্রাউজারের উপযোগী করা বা ফাইল ছোট করা। PostCSS এর সবচেয়ে পরিচিত উদাহরণযেখানে শিখবেন: পর্ব ৫০
- CSS preprocessorসিএসএস প্রিপ্রসেসর
- যে টুল নিজের বাড়তি নিয়মে (variable, nesting, loop, mixin) লেখা স্টাইল ফাইলকে প্রকাশের আগে সাধারণ CSS-এ রূপান্তর করে — যেমন Sass আর Less. ব্রাউজার শুধু রূপান্তরের ফলটাই দেখেযেখানে শিখবেন: পর্ব ৩৩পর্ব ৩৫পর্ব ৫০
- CSS resetসিএসএস রিসেট
- নিজের CSS-এর শুরুতে রাখা কয়েকটি নিয়ম, যা ব্রাউজারের ডিফল্ট margin, ফন্টের মাপ ইত্যাদি মুছে বা সমান করে দেয়, যাতে সব ব্রাউজারে একই জায়গা থেকে নকশা শুরু হয়।যেখানে শিখবেন: পর্ব ১৬
- CSS rule (ruleset)সিএসএস রুল
- CSS-এর একটি পূর্ণ নির্দেশ: selector আর তার পরের { } declaration block মিলে। যেমন h1 { color: crimson; } — কাকে সাজাব আর কীভাবে।যেখানে শিখবেন: পর্ব ১৬পর্ব ১৭পর্ব ৫৬
- CSS transitionসিএসএস ট্রানজিশন
- কোনো property-র মান বদলালে (যেমন hover-এ) এক ঝটকায় না বদলে নির্দিষ্ট সময় ধরে মসৃণভাবে বদলানোর CSS ব্যবস্থা। চারটি অংশ: transition-property, transition-duration, transition-timing-function আর transition-delayযেখানে শিখবেন: পর্ব ৩৮পর্ব ৩৯পর্ব ৫৬
- CSS-wide keywordসিএসএস-ওয়াইড কিওয়ার্ড
- যে বিশেষ মান যেকোনো property-তে লেখা যায় — inherit, initial, unset, revert, revert-layer. এরা বলে মানটা কোথা থেকে আনতে হবে।যেখানে শিখবেন: পর্ব ১৮পর্ব ৩৩
- cssnanoসিএসএস ন্যানো
- PostCSS-এর উপর বানানো CSS minifier; ফাঁকা জায়গা, মন্তব্য আর অপ্রয়োজনীয় অংশ বাদ দিয়ে ফাইল ছোট করে, অর্থ না বদলেযেখানে শিখবেন: পর্ব ৫০
- CSSOMসিএসএসওএম
- CSS Object Model — পাতার সব CSS নিয়ম (ব্রাউজারের নিজস্ব default নিয়মসহ) নিয়ে ব্রাউজারের ভেতরে তৈরি কাঠামোযেখানে শিখবেন: পর্ব ০১পর্ব ১৬পর্ব ৪৯
- CSSWG (CSS Working Group)সিএসএস ওয়ার্কিং গ্রুপ
- W3C-র যে দলে ব্রাউজার-নির্মাতা, বিভিন্ন কোম্পানি আর বিশেষজ্ঞরা মিলে CSS-এর নিয়ম (spec) লেখেন ও আলোচনা করেন। নতুন CSS ফিচারের প্রস্তাব এখানেই আকার পায়যেখানে শিখবেন: পর্ব ৩৭
- CUBE CSSকিউব সিএসএস
- Andy Bell-এর পদ্ধতি — Composition, Utility, Block, Exception. আগে cascade-কে কাজ করতে দেওয়া, তারপর layout, utility, component আর data- attribute দিয়ে ব্যতিক্রম।যেখানে শিখবেন: পর্ব ৪৬
- cubic-bezier()কিউবিক বেজিয়ে
- চারটি সংখ্যা (x1, y1, x2, y2) দিয়ে দুটি টানার বিন্দু বসিয়ে নিজের মাপের easing বক্ররেখা বানানোর CSS ফাংশন। x-এর মান 0 থেকে 1-এর মধ্যে থাকতে হয়; y এর বাইরে গেলে মান লক্ষ্য পেরিয়ে ফিরে আসে (overshoot)যেখানে শিখবেন: পর্ব ৩৮
- Curb-cut effect (ঢাল-প্রভাব)কার্ব-কাট এফেক্ট
- প্রতিবন্ধী মানুষের জন্য বানানো সমাধান যখন সবার কাজে লাগে — নামটি এসেছে হুইলচেয়ারের জন্য কাটা ফুটপাতের ঢাল থেকে, যা স্ট্রলার, ট্রলি আর সাইকেলেরও কাজে লাগেযেখানে শিখবেন: পর্ব ১২পর্ব ৫৪পর্ব ৫৭
- currentColorকারেন্ট কালার
- একটি বিশেষ রঙের শব্দ, যার মানে এই element-এর বর্তমান লেখার রং (color property). বর্ডার বা আইকনের রং লেখার সাথে মিলিয়ে রাখতে কাজেরযেখানে শিখবেন: পর্ব ২০পর্ব ৩৬পর্ব ৪৪
- currentSrcকারেন্ট-সোর্স
- JavaScript-এ <img>-এর property, যা বলে srcset বা <picture> থেকে ব্রাউজার আসলে কোন ফাইলের ঠিকানা বেছে নিয়েছে। img.src শুধু src attribute-এর লেখা দেয়।যেখানে শিখবেন: পর্ব ৩২
- Custom domainকাস্টম ডোমেইন
- হোস্টিং সেবার দেওয়া ঠিকানার (যেমন name.github.io) বদলে নিজের কেনা domain, যেমন rumana.com.bd
- Custom elementকাস্টম এলিমেন্ট
- ডেভেলপারের বানানো নতুন HTML element, যেমন <user-card>. নামে অবশ্যই হাইফেন থাকে, আর customElements.define() দিয়ে নামটির সাথে একটি JavaScript class জোড়া হয়যেখানে শিখবেন: পর্ব ৫২পর্ব ৫৭পর্ব ৫৮
D
- Dark mode (ডার্ক মোড)ডার্ক মোড
- গাঢ় পটভূমিতে হালকা লেখার থিম। অপারেটিং সিস্টেম আর ব্রাউজারে এটি ব্যবহারকারীর একটি পছন্দ, আর ওয়েবপেজ prefers-color-scheme দিয়ে সেই পছন্দ জানতে পারেযেখানে শিখবেন: পর্ব ৩৬
- Dart Sassডার্ট স্যাস
- Sass-এর বর্তমান ও একমাত্র সক্রিয়ভাবে উন্নয়ন হওয়া সংস্করণ, Dart ভাষায় লেখা। npm-এ sass নামে পাওয়া যায়; পুরোনো Ruby Sass আর LibSass/node-sass বাতিল হয়ে গেছেযেখানে শিখবেন: পর্ব ৫০
- Dashboardড্যাশবোর্ড
- এক পাতায় গুরুত্বপূর্ণ সংখ্যা, চার্ট আর তালিকা একসাথে দেখানোর অ্যাডমিন-ধরনের পাতা — গাড়ির সামনের মিটার-বোর্ডের মতো এক নজরে অবস্থা বোঝায়।যেখানে শিখবেন: পর্ব ২৯
- Data tableডেটা টেবিল
- সারি আর কলামে সাজানো তথ্য, যেখানে প্রতিটি মানের অর্থ বুঝতে তার সারি আর কলাম দুটোই জানতে হয় — যেমন পরীক্ষার ফল বা ট্রেনের সময়সূচি। HTML-এ লেখা হয় <table> দিয়ে।যেখানে শিখবেন: পর্ব ০৭পর্ব ১৫পর্ব ৫৭
- data-* attributeডেটা অ্যাট্রিবিউট
- data- দিয়ে শুরু নিজের বানানো HTML attribute, যেমন data-theme="dark". CSS-এ [data-theme="dark"] দিয়ে ধরা যায়, আর JavaScript-এ element.dataset.theme দিয়ে পড়া-লেখা যায়যেখানে শিখবেন: পর্ব ৩৬পর্ব ৫২
- data: URLডেটা ইউআরএল
- ফাইলের পুরো বিষয়বস্তু সরাসরি ঠিকানার ভেতরে লিখে দেওয়া, যেমন data:image/svg+xml,…। আলাদা ডাউনলোড লাগে না, তবে আলাদাভাবে cache-ও হয় নাযেখানে শিখবেন: পর্ব ৪৪
- datalistডেটালিস্ট
- একটি input-এর জন্য পরামর্শের তালিকা; input-এর list attribute-এ datalist-এর id দিতে হয়। পরামর্শ দেখায়, কিন্তু তালিকার বাইরের লেখাও গ্রহণ করে।যেখানে শিখবেন: পর্ব ০৯
- Dead codeডেড কোড
- যে কোড আর কোথাও ব্যবহার হয় না, তবু ফাইলে রয়ে গেছে — যেমন মুছে ফেলা ব্যানারের CSS. ফাইল ভারী করে আর পড়ার সময় বিভ্রান্ত করে।যেখানে শিখবেন: পর্ব ৪৬
- Debuggingডিবাগিং
- কোডের ভুল (বাগ) কেন ঘটছে তার আসল কারণ খুঁজে বের করে সারানোর কাজ। ভালো debugging একটি পদ্ধতি মেনে চলে — বাগ আবার ঘটানো, আলাদা করা, দেখা, অনুমান, একটি বদল আর যাচাইযেখানে শিখবেন: পর্ব ৪৭
- Declaration (CSS)ডিক্লারেশন
- CSS-এর একটি একক নির্দেশ: property, কোলন, value আর শেষে সেমিকোলন — যেমন color: crimson; ভুল হলে শুধু এই declaration-টিই বাদ পড়ে।যেখানে শিখবেন: পর্ব ১৬পর্ব ১৭পর্ব ১৮
- Declaration blockডিক্লারেশন ব্লক
- selector-এর পরে কোঁকড়া বন্ধনী { } দিয়ে ঘেরা অংশ, যার ভেতরে এক বা একাধিক declaration থাকে।যেখানে শিখবেন: পর্ব ১৬পর্ব ৫৭
- Declarative languageডিক্লারেটিভ ল্যাঙ্গুয়েজ
- যে ভাষায় আপনি বলেন কী ফল চান, কীভাবে করতে হবে তা নয় — যন্ত্র নিজে পথ ঠিক করে। CSS, HTML আর SQL এমন ভাষা; C বা JavaScript-এ ধাপগুলো নিজে লিখতে হয়, এদের বলে imperative ভাষা।যেখানে শিখবেন: পর্ব ১৬
- Declarative shadow DOMডিক্লারেটিভ শ্যাডো ডম
- HTML-এ <template shadowrootmode="open"> লিখে JavaScript ছাড়াই shadow root বানানোর উপায়; parser পাতা পড়ার সময়ই এটি তৈরি করে, তাই সার্ভারে বানানো পাতায় component প্রথম ঝলকেই ঠিক দেখায়যেখানে শিখবেন: পর্ব ৫২
- decoding attributeডিকোডিং
- ছবির ফাইল খুলে পিক্সেলে রূপান্তর (decode) পাতার বাকি কাজ আটকে রাখবে কি না, তার ইঙ্গিত: async মানে আলাদা করে করো, sync মানে একসাথে, auto মানে ব্রাউজার ঠিক করবে।যেখানে শিখবেন: পর্ব ৩২
- dense (packing)ডেন্স প্যাকিং
- grid-auto-flow-এর একটি মান, যা প্রতিটি item-এর জন্য শুরু থেকে খালি ঘর খুঁজে ফাঁক ভরায়। এতে চোখের ক্রম আর HTML-এর ক্রম আলাদা হয়ে যেতে পারেযেখানে শিখবেন: পর্ব ২৭পর্ব ২৯পর্ব ৫৯
- Deploy (ডিপ্লয়, প্রকাশ)ডিপ্লয়
- নিজের কম্পিউটারের সাইট বা প্রোগ্রাম এমন সার্ভারে তোলা, যেখান থেকে সবাই ইন্টারনেটে দেখতে পায়যেখানে শিখবেন: পর্ব ৫৩
- Deploy previewডিপ্লয় প্রিভিউ
- মূল সাইট না ছুঁয়ে একটি branch বা pull request-এর জন্য আলাদা পরীক্ষামূলক ঠিকানায় প্রকাশ করা সংস্করণযেখানে শিখবেন: পর্ব ৫৩
- Deprecationডেপ্রিকেশন
- কোনো feature বা নিয়মকে আনুষ্ঠানিকভাবে বাতিলের পথে বলে ঘোষণা করা; এখনো চলে, কিন্তু সতর্কবার্তা দেখায় এবং ভবিষ্যতের কোনো সংস্করণে সরিয়ে ফেলা হবেযেখানে শিখবেন: পর্ব ৫০পর্ব ৫৬
- Descendantডিসেন্ড্যান্ট
- কোনো element-এর ভেতরে যেকোনো গভীরতায় থাকা সব element ও node — child, child-এর child ইত্যাদিযেখানে শিখবেন: পর্ব ০৩
- Descendant combinator (space)ডিসেনড্যান্ট কম্বিনেটর
- দুটি selector-এর মাঝের ফাঁকা জায়গা, যেমন article p — বাঁয়েরটির ভেতরে যেকোনো গভীরতায় থাকা ডানেরটিকে ধরে।যেখানে শিখবেন: পর্ব ১৭পর্ব ৫৭
- Description list (dl)ডেসক্রিপশন লিস্ট
- নাম আর তার বিবরণের জোড়ার তালিকা — <dl>-এর ভেতরে নাম <dt> আর বিবরণ <dd>. শব্দকোষ, প্রশ্ন-উত্তর বা পণ্যের বিবরণে কাজে লাগে। পুরোনো নাম definition list.যেখানে শিখবেন: পর্ব ০৭পর্ব ৫৭
- Design systemডিজাইন সিস্টেম
- একটি সাইট বা পণ্যের নকশার নিয়মের পুরো সংগ্রহ: design token (রং, লেখার মাপ, ফাঁক), বারবার ব্যবহারযোগ্য component আর সেগুলো ব্যবহারের নির্দেশনা। পুরো সাইটের চেহারা সুসংগত রাখে।যেখানে শিখবেন: পর্ব ৫৪পর্ব ৫৮
- Design tokenডিজাইন টোকেন
- নকশার একটি নামকরা সিদ্ধান্ত — একটি রং, ফাঁকা জায়গার মাপ, কোণার গোলাকার মাপ বা লেখার আকার — যা এক জায়গায় রেখে সব জায়গায় নাম ধরে ব্যবহার হয়। ওয়েবে সাধারণত CSS custom property হিসেবে প্রকাশ পায়যেখানে শিখবেন: পর্ব ৩৩পর্ব ৩৬পর্ব ৪৬
- Desktop-firstডেস্কটপ-ফার্স্ট
- বড় পর্দার নিয়ম ভিত্তিতে রেখে max-width media query দিয়ে ছোট পর্দায় সেগুলো বাতিল বা বদলানোর পদ্ধতি। বেশি নিয়ম উল্টাতে হয় বলে এখন কম ব্যবহৃত।যেখানে শিখবেন: পর্ব ৩০
- Device pixel ratioডিভাইস পিক্সেল রেশিও
- একটি CSS পিক্সেলের চওড়ায় পর্দার কয়টি আসল বিন্দু আছে তার অনুপাত; JavaScript-এ window.devicePixelRatio. অনেক ফোনে ২ বা ৩, আর Zoom বাড়ালে এটি বাড়েযেখানে শিখবেন: পর্ব ২০পর্ব ৩০পর্ব ৩১
- Device toolbarডিভাইস টুলবার
- DevTools-এর যে সুবিধায় কম্পিউটারের ব্রাউজারেই মোবাইল বা ট্যাবলেটের মাপের স্ক্রিনে পেজটি কেমন দেখায় তা পরীক্ষা করা যায়। Firefox-এ এর নাম Responsive Design Modeযেখানে শিখবেন: পর্ব ০২পর্ব ২০পর্ব ২৯
- DevTools (ডেভেলপার টুলস)ডেভটুলস
- ব্রাউজারের ভেতরের ডেভেলপারদের যন্ত্রপাতি (F12 চাপলে খোলে): Elements-এ DOM ও CSS, Console-এ বার্তা ও error, Network-এ সব request দেখা যায়যেখানে শিখবেন: পর্ব ০১পর্ব ০২পর্ব ১০
- Diff (ডিফ)ডিফ
- দুটি অবস্থার মধ্যে লাইন ধরে ধরে পার্থক্য। মুছে ফেলা লাইনের আগে - আর যোগ হওয়া লাইনের আগে + দেখায়যেখানে শিখবেন: পর্ব ৫৩
- dir attributeডির অ্যাট্রিবিউট
- লেখা কোন দিক থেকে চলে তা জানানোর attribute: ltr (বাঁ থেকে ডানে), rtl (ডান থেকে বাঁয়ে, যেমন আরবি-উর্দু) বা autoযেখানে শিখবেন: পর্ব ১৪পর্ব ২৫পর্ব ৩৫
- disabledডিজেবলড
- কন্ট্রোলটি পুরো নিষ্ক্রিয় — বদলানো যায় না, focus পায় না, জমার সাথে মানও যায় না। <fieldset disabled> দিলে ভেতরের সব ঘর একসাথে নিষ্ক্রিয় হয়।যেখানে শিখবেন: পর্ব ০৯পর্ব ৪৩
- Disclosure widgetডিসক্লোজার উইজেট
- একটি শিরোনাম আর তার নিচে লুকানো অংশ, যা শিরোনামে চাপলে খোলে-বন্ধ হয়। HTML-এ এটি <details> আর <summary> দিয়ে বানানো হয়যেখানে শিখবেন: পর্ব ১১পর্ব ৫৪পর্ব ৫৭
- Discrete animationডিসক্রিট অ্যানিমেশন
- যে মানের মাঝামাঝি অবস্থা ব্রাউজার হিসাব করতে পারে না, সেটি ধীরে বদলায় না — অ্যানিমেশনের অর্ধেক সময়ে এক লাফে পুরোনো মান থেকে নতুন মানে চলে যায়যেখানে শিখবেন: পর্ব ৩৭পর্ব ৩৮পর্ব ৩৯
- displayডিসপ্লে
- একটি element কোন ধরনের বাক্স তৈরি করবে, তা ঠিক করার CSS property — বাইরে সে block না inline, আর ভেতরে child-দের normal flow, Flexbox না Grid-এ সাজাবে; none দিলে কোনো বাক্সই হয় নাযেখানে শিখবেন: পর্ব ২৩পর্ব ৫৭
- display: contentsডিসপ্লে কনটেন্টস
- element-এর নিজের বাক্স তৈরি না করে শুধু তার child-দের বাক্স রাখার মান, যেন child-রা সরাসরি parent-এর জায়গায় বসে; কিছু ব্রাউজারে এটি অ্যাক্সেসিবিলিটির তথ্য নষ্ট করার ইতিহাস আছেযেখানে শিখবেন: পর্ব ২৩পর্ব ৫৭
- display: flow-rootফ্লো-রুট
- একটি block বাক্স যা নিজের ভেতরে নতুন block formatting context খোলে — ভেতরের float উচ্চতাসহ ধরে রাখে আর child-এর margin বাইরে মিশতে দেয় না; পুরোনো clearfix-এর আধুনিক বিকল্পযেখানে শিখবেন: পর্ব ২৩পর্ব ৫৭পর্ব ৫৮
- display: inline-blockইনলাইন-ব্লক
- এমন বাক্স, যা লেখার লাইনের ভেতরে বসে কিন্তু width, height আর চারদিকের margin-padding পুরোপুরি মানে, আর দুই লাইনে ভাঙে না; দুই-শব্দের রূপে inline flow-rootযেখানে শিখবেন: পর্ব ২৩পর্ব ২৫পর্ব ৫৭
- display: inline-flexইনলাইন-ফ্লেক্স
- ভেতরে পুরো Flexbox চালায়, কিন্তু বাইরে container নিজে লেখার লাইনের ভেতরে একটি শব্দের মতো বসে এবং শুধু নিজের জিনিসের সমান চওড়া হয়। display: flex হলে container পুরো লাইন নেয়।যেখানে শিখবেন: পর্ব ২৫
- Distractorডিসট্র্যাক্টর
- MCQ-এর ইচ্ছাকৃত বিভ্রান্তিকর ভুল অপশন, যা কোনো প্রচলিত ভুল ধারণা থেকে বানানো হয় আর দেখতে সঠিক উত্তরের মতো মনে হয় — যেমন “পরে লেখা নিয়ম সবসময় জেতে”।যেখানে শিখবেন: পর্ব ৫৬
- Div-soupডিভ-স্যুপ
- যে পাতার প্রায় সব অংশ অর্থহীন <div> দিয়ে বানানো, পরিচয় শুধু class-এর নামে। চোখে ঠিক দেখায়, কিন্তু ব্রাউজার আর screen reader বোঝে না কোনটি মেনু, কোনটি মূল লেখা।যেখানে শিখবেন: পর্ব ১০পর্ব ১৭পর্ব ২৬
- DNSডিএনএস
- Domain Name System — ইন্টারনেটের ফোনবুক। domain name দিলে তার IP ঠিকানা জানিয়ে দেয়; উত্তর কিছুক্ষণ cache-এ রাখা হয়যেখানে শিখবেন: পর্ব ০১পর্ব ৫৩পর্ব ৫৭
- DNS record (A, CNAME)ডিএনএস রেকর্ড
- domain-এর ঠিকানা-খাতার একেকটি লাইন। A record একটি নামকে সরাসরি IP ঠিকানায় পাঠায়, CNAME একটি নামকে আরেকটি নামের দিকেযেখানে শিখবেন: পর্ব ৫৩
- Doctype (<!doctype html>)ডকটাইপ
- HTML ফাইলের প্রথম লাইন। এটি element নয়; ব্রাউজারকে আধুনিক standards mode-এ পাতা আঁকতে বলে। না থাকলে পাতা quirks mode-এ চলেযেখানে শিখবেন: পর্ব ০৩পর্ব ১৯পর্ব ৫৭
- Document outlineডকুমেন্ট আউটলাইন
- পেজের heading-গুলো তাদের লেভেল অনুযায়ী মিলে যে অদৃশ্য সূচিপত্র তৈরি করে; screen reader ব্যবহারকারী এটি ধরেই পেজে চলাফেরা করেনযেখানে শিখবেন: পর্ব ০৪
- Document root (public_html)ডকুমেন্ট রুট
- সার্ভারের যে ফোল্ডারের ফাইলগুলো ওয়েবে দেখা যায়। cPanel-এ সাধারণত public_html — এর ভেতরের index.html-ই আপনার domain-এর প্রথম পাতাযেখানে শিখবেন: পর্ব ৫৩
- DocumentFragmentডকুমেন্ট ফ্র্যাগমেন্ট
- DOM-এর একটি হালকা, আলগা টুকরো, যা কোনো পাতার অংশ নয়। পাতায় append করলে টুকরোটি নিজে যায় না, তার সন্তানেরা সরে গিয়ে বসেযেখানে শিখবেন: পর্ব ৫২
- DOMডম
- Document Object Model — HTML থেকে ব্রাউজারের মেমরিতে তৈরি গাছের মতো কাঠামো, যেখানে প্রতিটি element একটি শাখা। JavaScript এটি পড়তে ও বদলাতে পারেযেখানে শিখবেন: পর্ব ০১পর্ব ০২পর্ব ০৩
- DOM order (source order)ডম অর্ডার
- HTML-এ element-গুলো যে ক্রমে লেখা — ব্রাউজারের DOM গাছে সেই ক্রমই থাকে। কীবোর্ডের Tab, screen reader আর reader mode এই ক্রম মানে, CSS দিয়ে চোখে জায়গা বদলালেও।যেখানে শিখবেন: পর্ব ২৮পর্ব ৫৮
- Domain / hostডোমেইন / হোস্ট
- URL-এ সার্ভারের নাম, যেমন abcltech.com. ব্রাউজার DNS-এর সাহায্যে এই নাম থেকে সার্ভারের IP ঠিকানা বের করে।যেখানে শিখবেন: পর্ব ০৫
- Domain name (ডোমেইন নেম)ডোমেইন নেম
- সার্ভারের মনে রাখার মতো নাম, যেমন example.com বা abcltech.com. DNS এই নামকে IP ঠিকানায় রূপান্তর করেযেখানে শিখবেন: পর্ব ০১
- Donut scope (scoping limit)ডোনাট স্কোপ
- @scope (.a) to (.b) — .a-এর ভেতরে নিয়ম খাটবে, কিন্তু .b থেকে নিচের অংশে নয়। মাঝখানে ফুটোওয়ালা ডোনাটের মতো, তাই এই নাম; .b-কে বলে scoping limitযেখানে শিখবেন: পর্ব ৩৭
- download attributeডাউনলোড অ্যাট্রিবিউট
- <a>-এর একটি attribute, যা ফাইল খোলার বদলে ডাউনলোড করতে বলে, চাইলে নতুন ফাইলনামসহ। নিরাপত্তার জন্য শুধু একই সাইটের ফাইলে কাজ করে।যেখানে শিখবেন: পর্ব ০৫
- Drop capড্রপ ক্যাপ
- অনুচ্ছেদের প্রথম অক্ষর বড় করে কয়েক লাইন জুড়ে বসানোর ছাপার রীতি; CSS-এ ::first-letter বা initial-letter দিয়ে করা হয়যেখানে শিখবেন: পর্ব ৩৪
- drop-shadow()ড্রপ-শ্যাডো
- filter-এর একটি ফাংশন, যা element-এর আঁকা আসল আকৃতি (স্বচ্ছ অংশ বাদ দিয়ে) ধরে ছায়া ফেলে; box-shadow-এর মতো আয়তাকার বাক্স ধরে না, তবে এতে spread বা inset নেইযেখানে শিখবেন: পর্ব ৪১
- DRY (Don't Repeat Yourself)ড্রাই
- একই তথ্য বা কোড একাধিক জায়গায় না লিখে একটিমাত্র জায়গায় রাখার নীতি, যাতে বদলাতে হলে একবারই বদলাতে হয়।যেখানে শিখবেন: পর্ব ১৫পর্ব ৩৩
- Duotoneডুওটোন
- ছবিকে মাত্র দুটি রঙে দেখানোর কৌশল — অন্ধকার অংশ এক রঙে, উজ্জ্বল অংশ আরেক রঙে; CSS-এ grayscale filter আর blend mode মিলিয়ে করা যায়যেখানে শিখবেন: পর্ব ৪১
- Duplicate contentডুপ্লিকেট কনটেন্ট
- একই লেখা একাধিক ঠিকানায় পাওয়া যাওয়া — যেমন ?color=red বা ?ref=fb যোগ করা ঠিকানা। সার্চ ইঞ্জিন তখন বুঝতে পারে না কোনটি দেখাবে; canonical এর সমাধানযেখানে শিখবেন: পর্ব ১৩
- Dynamic site (ডায়নামিক সাইট)ডায়নামিক সাইট
- যে সাইটে সার্ভারের প্রোগ্রাম প্রতিটি request-এ ডেটাবেস থেকে তথ্য নিয়ে নতুন HTML বানায়, ফলে প্রত্যেক ব্যবহারকারী আলাদা পাতা পেতে পারেন — যেমন নিউজফিড বা কার্টযেখানে শিখবেন: পর্ব ০১
E
- Element (এলিমেন্ট)এলিমেন্ট
- HTML পাতার একটি একক অংশ — শুরু-ট্যাগ, ভেতরের বিষয়বস্তু আর শেষ-ট্যাগ মিলিয়ে, যেমন <h1>রহিম স্টোর</h1>. DOM-এ প্রতিটি element একটি nodeযেখানে শিখবেন: পর্ব ০১পর্ব ০৩পর্ব ০৮
- elementFromPoint()এলিমেন্ট-ফ্রম-পয়েন্ট
- document-এর একটি method, যা পর্দার একটি বিন্দুতে (x, y) সবচেয়ে ওপরে থাকা, ক্লিক ধরতে পারে এমন element ফেরত দেয়। z-index আর stacking context-এর প্রশ্নে “কোনটি ওপরে” মাপার উপায়; pointer-events: none বা visibility: hidden থাকা element এটি এড়িয়ে যায়যেখানে শিখবেন: পর্ব ৫৫
- ElementInternalsএলিমেন্ট ইন্টারনালস
- attachInternals() থেকে পাওয়া একটি বস্তু, যা দিয়ে custom element ফর্মে মান পাঠাতে, validation জানাতে আর নিজের ডিফল্ট ARIA role দিতে পারেযেখানে শিখবেন: পর্ব ৫২
- Elevation (উচ্চতা)এলিভেশন
- কোন অংশ কার ওপরে ভাসছে তা চোখে বোঝানো — লাইট থিমে সাধারণত ছায়া দিয়ে, ডার্ক থিমে ওপরের স্তরের পটভূমি একটু হালকা করেযেখানে শিখবেন: পর্ব ৩৬
- Elimination methodইলিমিনেশন মেথড
- উত্তর বাছাইয়ের কৌশল: সরাসরি সঠিকটি না খুঁজে প্রতিটি অপশনের পেছনের নিয়ম যাচাই করে ভুলগুলো একে একে বাদ দেওয়া।যেখানে শিখবেন: পর্ব ৫৬
- emএম
- বর্তমান font-size-এর গুণিতক একক। font-size-এ ব্যবহার করলে parent-এর font-size, অন্য property-তে element-এর নিজের font-size ধরে হিসাব হয়; নেস্টেড হলে গুণ জমতে থাকেযেখানে শিখবেন: পর্ব ২০পর্ব ৫৮
- Emmetএমেট
- ছোট সংক্ষিপ্ত লেখা থেকে পুরো HTML বা CSS বানিয়ে দেওয়ার টুল; VS Code-এ আগে থেকেই থাকে। যেমন ul>li*3 লিখে Tab চাপলে তিনটি li-সহ একটি ul তৈরি হয়যেখানে শিখবেন: পর্ব ০২
- Emulate vision deficiencies (দৃষ্টির অনুকরণ)ভিশন ডেফিশিয়েন্সি ইমুলেশন
- Chrome ও Edge-এর DevTools-এর Rendering প্যানেলের একটি সুবিধা, যা পাতাকে ঝাপসা দৃষ্টি, কম contrast-এর দৃষ্টি বা নানা ধরনের বর্ণান্ধতার চোখে কেমন দেখায় তা অনুকরণ করে দেখায় — শুধু রঙে অর্থ রাখা ভুল ধরতে কাজের।যেখানে শিখবেন: পর্ব ৪৫পর্ব ৪৭
- .env fileডট-এনভ ফাইল
- গোপন চাবি আর সেটিং রাখার প্রচলিত ফাইল, যেমন API_KEY=… সবসময় .gitignore-এ থাকে, কখনো commit হয় নাযেখানে শিখবেন: পর্ব ৫৩
- Error summary (ভুলের সারাংশ)এরর সামারি
- ফর্ম জমা দেওয়ার পর ভুল থাকলে ফর্মের ওপরে দেখানো একটি বাক্স, যেখানে সব ভুলের তালিকা থাকে আর প্রতিটি লিংক সংশ্লিষ্ট ঘরে নিয়ে যায়; focus সাধারণত সরাসরি বাক্সটিতে সরানো হয়, যাতে screen reader ব্যবহারকারীও সাথে সাথে জানেনযেখানে শিখবেন: পর্ব ৪৩পর্ব ৫৮
- Event (DOM event)ইভেন্ট
- ব্রাউজারের পাঠানো “কিছু একটা ঘটেছে” সংকেত — যেমন click, input, submit, keydown. JavaScript আগে থেকে বলে রাখতে পারে কোন ঘটনায় কোন কাজ হবেযেখানে শিখবেন: পর্ব ৫২
- Event listenerইভেন্ট লিসেনার
- একটি ফাংশন, যা addEventListener() দিয়ে কোনো element-এর নির্দিষ্ট event-এর সাথে জোড়া থাকে এবং সেই ঘটনা ঘটলেই চলেযেখানে শিখবেন: পর্ব ৫২
- Evergreen browserএভারগ্রিন ব্রাউজার
- যে ব্রাউজার ব্যবহারকারীকে জিজ্ঞেস না করেই নিয়মিত নতুন সংস্করণে আপডেট হয় — যেমন Chrome, Edge, Firefox. তবু পুরোনো ফোন বা বন্ধ রাখা আপডেটের কারণে অনেকের কাছে পুরোনো সংস্করণ থেকে যায়যেখানে শিখবেন: পর্ব ৪৮
- Exclusive accordionএক্সক্লুসিভ অ্যাকর্ডিয়ন
- যে accordion-এ একসাথে একটিই অংশ খোলা থাকে — নতুনটি খুললে আগেরটি নিজে বন্ধ হয়। HTML-এ একাধিক <details>-এ একই name দিলেই হয়যেখানে শিখবেন: পর্ব ১১পর্ব ৫৯
- Explicit gridএক্সপ্লিসিট গ্রিড
- grid-template-columns আর grid-template-rows (বা grid-template-areas) দিয়ে নিজে বানানো ছকের অংশ। ঋণাত্মক লাইন নম্বর এর শেষ থেকেই গোনা হয়যেখানে শিখবেন: পর্ব ২৭
- Extension (এক্সটেনশন)এক্সটেনশন
- Editor বা ব্রাউজারে নতুন সুবিধা যোগ করার ছোট বাড়তি প্রোগ্রাম। যেমন VS Code-এ Live Server বা Live Previewযেখানে শিখবেন: পর্ব ০২
F
- Fallback (ফলব্যাক)ফলব্যাক
- বিকল্প ব্যবস্থা — কোনো নতুন ফিচার পুরোনো ব্রাউজারে না থাকলে একই কাজ অন্যভাবে করার কোড, যাতে পাঠক বাদ না পড়েনযেখানে শিখবেন: পর্ব ১১পর্ব ১৬পর্ব ২০
- Faviconফ্যাভিকন
- ব্রাউজারের ট্যাব, বুকমার্ক আর মোবাইল সার্চ ফলাফলে সাইটের নামের পাশে দেখানো ছোট্ট লোগো; <link rel="icon"> দিয়ে দেওয়া হয় (ICO, PNG বা SVG)যেখানে শিখবেন: পর্ব ১৩পর্ব ১৫পর্ব ৫৩
- FCP (First Contentful Paint)এফ-সি-পি
- পাতা খোলার পর প্রথম কোনো লেখা বা ছবি পর্দায় আসার মুহূর্ত — ব্যবহারকারী প্রথম বোঝেন যে “কিছু আসছে”যেখানে শিখবেন: পর্ব ৪৯
- Feature detectionফিচার ডিটেকশন
- কোড চালানোর আগে পরীক্ষা করা যে ব্রাউজার একটি ফিচার চেনে কি না — যেমন 'popover' in HTMLElement.prototype — আর না চিনলেই কেবল fallback চালানোযেখানে শিখবেন: পর্ব ১১পর্ব ২৫পর্ব ৪৮
- Feature flag (ব্রাউজারের flag)ফিচার ফ্ল্যাগ
- ব্রাউজারের লুকানো সেটিং (যেমন chrome://flags), যা চালু করলে এখনো অসম্পূর্ণ কোনো ফিচার পরীক্ষা করা যায়। সাধারণ ব্যবহারকারীর কাছে এটি বন্ধ থাকে, তাই flag-এর ফিচারের ওপর সাইট বানানো যায় নাযেখানে শিখবেন: পর্ব ৩৭পর্ব ৪৮
- fetchpriorityফেচ-প্রায়োরিটি
- ব্রাউজারকে জানানো, অন্য ফাইলের তুলনায় এই ফাইলটি কতটা জরুরি: high, low বা auto. প্রথম পর্দার বড় ছবিতে high দিলে LCP ভালো হয়।যেখানে শিখবেন: পর্ব ৩২পর্ব ৪৯
- FID (First Input Delay)এফ-আই-ডি
- পুরোনো Core Web Vital: শুধু প্রথম ক্লিক বা ট্যাপের আগে ব্রাউজার কতক্ষণ ব্যস্ত ছিল তা মাপত। ২০২৪ সালের মার্চে INP এর জায়গা নিয়েছেযেখানে শিখবেন: পর্ব ৪৯
- Field data (RUM)ফিল্ড ডেটা
- আসল ব্যবহারকারীদের আসল ফোন আর আসল নেটওয়ার্ক থেকে সংগ্রহ করা পারফরম্যান্সের মাপ। Real User Monitoring বা RUM নামেও পরিচিত; Google-এর ক্ষেত্রে এর উৎস CrUXযেখানে শিখবেন: পর্ব ৪৯পর্ব ৫৭পর্ব ৫৮
- field-sizingফিল্ড সাইজিং
- ফর্মের input আর textarea-র জন্য নতুন property. field-sizing: content দিলে বাক্সটি লেখার পরিমাণ অনুযায়ী নিজে বড়-ছোট হয়, নির্দিষ্ট মাপে আটকে থাকে নাযেখানে শিখবেন: পর্ব ৩৭পর্ব ৪৩
- Fieldset (<fieldset>, <legend>)ফিল্ডসেট
- ফর্মের সম্পর্কিত ঘরগুলোকে একটি দলে রাখার element; প্রথম সন্তান <legend> দলের শিরোনাম, যা screen reader ঘরের নামের সাথে পড়ে।যেখানে শিখবেন: পর্ব ০৮পর্ব ০৯পর্ব ৪৩
- File extensionফাইল এক্সটেনশন
- ফাইলের নামের শেষে ডটের পরের অংশ, যা বলে ফাইলটি কী ধরনের — যেমন .html, .css, .txt. Windows ডিফল্টভাবে এটি লুকিয়ে রাখেযেখানে শিখবেন: পর্ব ০২
- File inputফাইল ইনপুট
- <input type="file"> — কম্পিউটার বা ফোন থেকে ফাইল বাছার ঘর। accept শুধু কোন ধরনের ফাইল দেখাবে তার পরামর্শ দেয়, multiple একাধিক ফাইল বাছতে দেয়।যেখানে শিখবেন: পর্ব ০৯পর্ব ৪৩
- file:// URLফাইল ইউআরএল
- ব্রাউজার যখন সার্ভার ছাড়া সরাসরি ডিস্ক থেকে ফাইল খোলে, তখনকার ঠিকানা — যেমন file:///C:/web/index.html. এ অবস্থায় কিছু নিরাপত্তা-নিয়মের কারণে fetch বা module script কাজ করে নাযেখানে শিখবেন: পর্ব ০২পর্ব ১৫
- fillফিল
- SVG আকারের ভেতরটা কোন রঙে ভরানো হবে। ডিফল্ট কালো; fill="none" দিলে ভেতর ফাঁকা থাকেযেখানে শিখবেন: পর্ব ৪৪
- filter (CSS)ফিল্টার
- আঁকা element-এর ওপর ছবির মতো প্রভাব বসানোর property — brightness(), contrast(), invert(), hue-rotate(), blur() ইত্যাদি। invert() সব রং উল্টে দেয়, তাই লোগো আর ছবিতে সাবধানে ব্যবহার করতে হয়যেখানে শিখবেন: পর্ব ৩৬
- Firebugফায়ারবাগ
- ২০০৬ সালের দিকে আসা একটি Firefox extension, যা প্রথমবার জীবন্ত DOM, প্রতিটি element-এর CSS, নেটওয়ার্ক আর console একসাথে দেয়। আজকের সব ব্রাউজারের DevTools-এর ধারণা অনেকটাই এখান থেকে এসেছেযেখানে শিখবেন: পর্ব ৪৭
- fit-content() / fit-contentফিট-কনটেন্ট
- কনটেন্ট অনুযায়ী মাপ, তবে সীমাসহ: max-content পর্যন্ত বাড়ে কিন্তু দেওয়া সীমার বেশি নয়, তারপর লেখা ভেঙে নিচে নামে। grid track-এ fit-content(300px), আর width-এ শুধু fit-content লেখা যায়।যেখানে শিখবেন: পর্ব ২৮
- Flash of wrong themeফ্ল্যাশ অফ রং থিম
- পাতা খোলার মুহূর্তে ভুল থিমে (সাধারণত সাদা) এক ঝলক আঁকা, তারপর সংরক্ষিত থিমে বদল। কারণ: পছন্দ পড়ার script প্রথম আঁকার পরে চলেযেখানে শিখবেন: পর্ব ৩৬পর্ব ৫৯
- flex (shorthand)ফ্লেক্স শর্টহ্যান্ড
- flex-grow, flex-shrink আর flex-basis একসাথে লেখার property. flex: 1 মানে 1 1 0%, flex: auto মানে 1 1 auto, flex: none মানে 0 0 auto.যেখানে শিখবেন: পর্ব ২৫পর্ব ৫৭পর্ব ৫৮
- Flex containerফ্লেক্স কন্টেইনার
- যে element-এ display: flex বা inline-flex দেওয়া হয়। সে তার সরাসরি child-দের (flex item) দিক, ফাঁক আর অবস্থান ঠিক করে।যেখানে শিখবেন: পর্ব ২৫পর্ব ২৬
- Flex itemফ্লেক্স আইটেম
- flex container-এর সরাসরি child — শুধু child, নাতি নয়। item হওয়ার পর inline element-ও block-এর মতো বাক্স হয়, আর flex-grow, flex-shrink, flex-basis, align-self, order মানে।যেখানে শিখবেন: পর্ব ২৫পর্ব ২৬
- Flex lineফ্লেক্স লাইন
- wrap করা flex container-এর প্রতিটি সারি বা কলাম। প্রতিটি লাইন আলাদাভাবে free space ভাগ করে, অন্য লাইনের সাথে কলাম মেলায় না।যেখানে শিখবেন: পর্ব ২৫পর্ব ২৬
- Flex overlay (DevTools)ফ্লেক্স ওভারলে
- ব্রাউজারের DevTools-এ flex container-এর ওপর আঁকা রঙিন নকশা, যা item-দের সীমানা, gap আর ফাঁকা জায়গা দেখায়। Chrome/Edge-এ Elements প্যানেলের “flex” ব্যাজে ক্লিক করে চালু হয়।যেখানে শিখবেন: পর্ব ২৫পর্ব ৪৭
- flex-basisফ্লেক্স-বেসিস
- flex item-এর main দিকের শুরুর মাপ, যেখান থেকে বাড়া-কমার হিসাব শুরু। ডিফল্ট auto মানে width (বা height) থাকলে সেটি, না থাকলে লেখার মাপ।যেখানে শিখবেন: পর্ব ২৫পর্ব ২৬পর্ব ২৯
- flex-directionফ্লেক্স-ডিরেকশন
- flex container-এর main axis-এর দিক ঠিক করে: row (ডিফল্ট), row-reverse, column বা column-reverse. reverse মান শুধু চোখের ক্রম উল্টায়, HTML-এর ক্রম নয়।যেখানে শিখবেন: পর্ব ২৫
- flex-growফ্লেক্স-গ্রো
- বাড়তি free space-এর কত ভাগ item নেবে, তার অনুপাত। ডিফল্ট 0 — বাড়বে না। grow 2 মানে grow 1-এর দ্বিগুণ বাড়তি অংশ, দ্বিগুণ চওড়া নয়।যেখানে শিখবেন: পর্ব ২৫পর্ব ২৬পর্ব ২৯
- flex-shrinkফ্লেক্স-শ্রিংক
- জায়গা কম পড়লে item কতটা ছোট হবে, তার অনুপাত। ডিফল্ট 1; ঘাটতি ভাগ হয় shrink × basis-এর ওজনে। 0 দিলে item একটুও ছোট হয় না।যেখানে শিখবেন: পর্ব ২৫পর্ব ২৬পর্ব ৫৫
- flex-wrapফ্লেক্স-র্যাপ
- জায়গা না ধরলে item-রা নতুন লাইনে যাবে কি না ঠিক করে: nowrap (ডিফল্ট, সব এক লাইনে), wrap বা wrap-reverse.যেখানে শিখবেন: পর্ব ২৫পর্ব ২৯পর্ব ৩০
- Flexboxফ্লেক্সবক্স
- CSS-এর এক দিকে (সারি বা কলামে) item সাজানোর লেআউট পদ্ধতি — display: flex দিয়ে চালু হয়। এর item-দের margin মেশে না, আর gap দিয়ে ফাঁক দেওয়া যায়।যেখানে শিখবেন: পর্ব ১৯পর্ব ২৫পর্ব ২৬
- Flexible imageফ্লেক্সিবল ইমেজ
- যে ছবি পাত্রের চেয়ে বড় হয় না আর অনুপাত ঠিক রেখে ছোট হয় — সাধারণত img { max-width: 100%; height: auto; } দিয়ে।যেখানে শিখবেন: পর্ব ৩০
- floatফ্লোট
- একটি বাক্সকে বাঁ বা ডান কিনারায় ভাসিয়ে দেওয়ার CSS property, যাতে আশপাশের লেখা তার পাশ দিয়ে বয়ে যায় — পত্রিকার ছবির পাশে লেখার মতো। পাতার কলাম বানানোর জন্য আজ আর ব্যবহার হয় নাযেখানে শিখবেন: পর্ব ২৩পর্ব ২৫পর্ব ২৭
- Flow contentফ্লো কনটেন্ট
- body-র ভেতরে বসতে পারে এমন প্রায় সব element-এর দল — p, div, h1, ul, blockquote, আর সব phrasing content-ওযেখানে শিখবেন: পর্ব ০৪
- Fluid layoutফ্লুইড লেআউট
- যে লেআউটের বাক্সগুলো নির্দিষ্ট px-এ নয়, পাত্রের অনুপাতে মাপা — যেমন %, fr, আর max-width দিয়ে সীমা। পাত্র ছোট-বড় হলে ভেতরের মাপও সাথে সাথে বদলায়।যেখানে শিখবেন: পর্ব ৩০
- Fluid typographyফ্লুইড টাইপোগ্রাফি
- পর্দার চওড়ার সাথে লেখার মাপ লাফ না দিয়ে মসৃণভাবে বাড়ানো-কমানোর কৌশল, সাধারণত clamp() আর rem + vw মিশিয়ে।যেখানে শিখবেন: পর্ব ৩৫পর্ব ৫৪পর্ব ৫৫
- Focus (ফোকাস)ফোকাস
- পাতার যে লিংক, বোতাম বা ইনপুট এই মুহূর্তে কি-বোর্ডের চাপ গ্রহণ করবে। Tab চাপলে focus পরের অংশে যায়, Enter চাপলে focus-এর লিংক খোলে।যেখানে শিখবেন: পর্ব ১০পর্ব ২২পর্ব ৪২
- Focus (ফোকাস)ফোকাস
- পাতার যে element এই মুহূর্তে কি-বোর্ডের ইনপুট পাচ্ছে — Tab চাপলে focus এক element থেকে পরেরটিতে যায়, আর Enter বা লেখা সেই element-এই যায়। বাটন, লিংক, ইনপুট নিজে থেকেই focus পায়যেখানে শিখবেন: পর্ব ১১পর্ব ১২পর্ব ১৯
- Focus Appearance (WCAG 2.4.13)ফোকাস অ্যাপিয়ারেন্স
- WCAG 2.2-এর AAA স্তরের শর্ত: focus-এর দাগ অন্তত element-এর চারপাশে 2 CSS px পুরু রেখার সমান জায়গা জুড়ে থাকবে, আর focus থাকা ও না-থাকা অবস্থার রঙে অন্তত ৩:১ পার্থক্য থাকবে।যেখানে শিখবেন: পর্ব ৪৫
- Focus indicator (ফোকাসের দাগ)ফোকাস ইন্ডিকেটর
- যে element এখন কীবোর্ডের focus পেয়েছে, তার চারপাশের দৃশ্যমান চিহ্ন — সাধারণত outline. কীবোর্ড ব্যবহারকারী এটি দেখেই বোঝেন পাতার কোথায় আছেন; WCAG 2.4.7 অনুযায়ী এটি দেখা যেতেই হবেযেখানে শিখবেন: পর্ব ৪৩পর্ব ৫৬
- Focus Not Obscured (WCAG 2.4.11)ফোকাস নট অবস্কিউর্ড
- WCAG 2.2-এর AA স্তরের শর্ত: কি-বোর্ডে focus পাওয়া জিনিস লেখকের বানানো sticky header, ব্যানার বা ভাসমান বোতামের নিচে পুরোপুরি ঢাকা পড়বে না। AAA স্তরের 2.4.12 বলে, একটুও ঢাকা পড়বে না।যেখানে শিখবেন: পর্ব ৪৫পর্ব ৫৯
- FOIT (Flash of Invisible Text)ফয়েট
- ওয়েব ফন্ট নামা পর্যন্ত লেখা অদৃশ্য রাখা — পাঠক কিছুক্ষণ ফাঁকা জায়গা দেখেনযেখানে শিখবেন: পর্ব ২১পর্ব ৪৪পর্ব ৪৯
- Follow-up questionফলো-আপ কোয়েশ্চেন
- আগের উত্তর থেকে জন্মানো পরের প্রশ্ন, যা একই বিষয়ে আরও গভীরে যায়। ভাইভা আর ইন্টারভিউতে বোঝার গভীরতা যাচাইয়ের প্রধান উপায়।যেখানে শিখবেন: পর্ব ৫৭
- Font fallbackফন্ট ফলব্যাক
- font-family-তে লেখা ফন্টগুলো একে একে চেষ্টা করা: প্রথমটিতে কোনো অক্ষর না থাকলে বা ফন্টটি না পেলে ব্রাউজার পরেরটি নেয়, শেষে সিস্টেমের ফন্টযেখানে শিখবেন: পর্ব ১৪পর্ব ২১পর্ব ৪৭
- font shorthandফন্ট শর্টহ্যান্ড
- font property — style, weight, size, line-height আর family এক লাইনে লেখার উপায়। size আর family বাধ্যতামূলক; যা লেখা হয়নি সেগুলো প্রাথমিক মানে ফিরে যায়যেখানে শিখবেন: পর্ব ২১
- Font stackফন্ট স্ট্যাক
- font-family-তে লেখা ফন্টের তালিকা, যেমন "Hind Siliguri", system-ui, sans-serif — ব্রাউজার বাঁ থেকে ডানে চেষ্টা করে, যেটিতে অক্ষরটি পায় সেটি নেয়যেখানে শিখবেন: পর্ব ২১পর্ব ৫৭
- Font subsettingফন্ট সাবসেটিং
- একটি ফন্ট ফাইল থেকে শুধু দরকারি অক্ষরগুলো রেখে বাকি সব বাদ দিয়ে ছোট ফাইল বানানো — যেমন শুধু বাংলা আর মৌলিক ইংরেজি অক্ষর। unicode-range-এর সাথে মিলিয়ে ব্যবহার হয়যেখানে শিখবেন: পর্ব ৪৯পর্ব ৫৮
- font-displayফন্ট-ডিসপ্লে
- ওয়েব ফন্ট লোড হওয়ার আগে লেখা কীভাবে দেখাবে তা ঠিক করার নিয়ম। swap দিলে আগে fallback ফন্টে লেখা দেখায়, ফন্ট এলে বদলে যায়যেখানে শিখবেন: পর্ব ১৪পর্ব ২১পর্ব ৪৯
- font-familyফন্ট-ফ্যামিলি
- লেখা কোন ফন্টে দেখাবে তা বলার CSS property; এতে কমা দিয়ে কয়েকটি ফন্টের নাম লেখা হয়, শেষে একটি generic familyযেখানে শিখবেন: পর্ব ২১
- font-size-adjustফন্ট-সাইজ-অ্যাডজাস্ট
- x-height font-size-এর কত ভাগ হবে তা বলে দেয়, ফলে ভিন্ন ফন্ট (যেমন fallback আর ওয়েব ফন্ট) চোখে প্রায় সমান বড় দেখায়। Baseline Newly availableযেখানে শিখবেন: পর্ব ২১
- font-styleফন্ট-স্টাইল
- লেখা সোজা (normal), আলাদা নকশার বাঁকা (italic) নাকি শুধু হেলানো (oblique) হবে তা ঠিক করার propertyযেখানে শিখবেন: পর্ব ২১
- font-variation-settingsফন্ট-ভেরিয়েশন-সেটিংস
- variable font-এর অক্ষ চার অক্ষরের ট্যাগ দিয়ে সরাসরি বদলানোর নিচু স্তরের property, যেমন "wdth" 80. পুরো তালিকা একসাথে উত্তরাধিকারে যায়, তাই সম্ভব হলে font-weight-এর মতো সাধারণ property ব্যবহার করুনযেখানে শিখবেন: পর্ব ২১
- font-weightফন্ট-ওয়েট
- লেখা কতটা মোটা বা চিকন তা ঠিক করার property; মান 100 (সবচেয়ে চিকন) থেকে 900 (সবচেয়ে মোটা), normal = 400, bold = 700. ফন্টে যে ওজন আছে শুধু সেগুলোই দেখা যায়যেখানে শিখবেন: পর্ব ২১
- Force element state (:hov)ফোর্স এলিমেন্ট স্টেট
- DevTools-এর Styles প্যানের :hov বোতামের সুবিধা, যা মাউস বা কি-বোর্ড ছাড়াই একটি element-কে :hover, :focus, :active-এর মতো অবস্থায় আটকে রাখে — যাতে সেই অবস্থার CSS শান্তভাবে পরীক্ষা করা যায়যেখানে শিখবেন: পর্ব ৪৭
- Forced colors modeফোর্সড কালারস মোড
- Windows-এর contrast theme-এর মতো সেটিং চালু থাকলে ব্রাউজারের যে অবস্থা — পাতার রং বাদ দিয়ে ব্যবহারকারীর বেছে নেওয়া অল্প কয়েকটি রং বসানো হয়। CSS-এ @media (forced-colors: active) দিয়ে চেনা যায়।যেখানে শিখবেন: পর্ব ১৮পর্ব ২২পর্ব ৩১
- forced-color-adjustফোর্সড কালার অ্যাডজাস্ট
- যে property ঠিক করে forced colors মোডে ব্রাউজার একটি element-এর রং বদলাবে কি না। ডিফল্ট auto (বদলাবে); none দিলে লেখকের রং থাকে — শুধু রঙের নমুনার মতো বিরল জায়গায় ব্যবহারযোগ্য।যেখানে শিখবেন: পর্ব ৪৫
- Forgiving error handling (CSS)ফরগিভিং এরর হ্যান্ডলিং
- CSS-এর নিয়ম: অচেনা property বা ভুল value-র declaration ব্রাউজার চুপচাপ বাদ দেয়, কোনো error দেখায় না, আর বাকি stylesheet ঠিকমতো চালায়। এতে নতুন ফিচার যোগ করলেও পুরোনো ব্রাউজার ভাঙে না।যেখানে শিখবেন: পর্ব ১৬পর্ব ৪৮
- Forgiving selector listফরগিভিং সিলেক্টর লিস্ট
- :is() আর :where()-এর ভেতরের তালিকা, যেখানে অচেনা বা ভুল selector শুধু বাদ পড়ে আর বাকিগুলো কাজ করে — সাধারণ কমা-তালিকার মতো পুরো rule বাতিল হয় না।যেখানে শিখবেন: পর্ব ১৭পর্ব ৩৫পর্ব ৪৮
- Form (<form>)ফর্ম
- ব্যবহারকারীর কাছ থেকে তথ্য নেওয়ার জন্য ঘর আর বোতামের একটি দল। জমা দিলে ব্রাউজার ঘরগুলোর তথ্য গুছিয়ে action-এ লেখা ঠিকানায় পাঠায়।যেখানে শিখবেন: পর্ব ০৮
- Form controlফর্ম কন্ট্রোল
- ফর্মের যে অংশে লেখা, বেছে নেওয়া বা চাপা যায় — যেমন input, button, select, textarea.যেখানে শিখবেন: পর্ব ০৮পর্ব ০৯পর্ব ৩৬
- Form data setফর্ম ডেটা সেট
- জমা দেওয়ার সময় ব্রাউজার যে নাম=মান জোড়ার তালিকা বানিয়ে সার্ভারে পাঠায়। name নেই, disabled বা টিক না দেওয়া ঘর এতে ওঠে না। আজকের WHATWG নিয়মে এর নাম entry list.যেখানে শিখবেন: পর্ব ০৯
- Formatter / Format Documentফরম্যাটার
- কোডের ইনডেন্ট, ফাঁকা জায়গা আর লাইন ভাঙা এক নিয়মে গুছিয়ে দেওয়ার টুল। কোডের অর্থ বদলায় না, শুধু পড়তে সহজ করেযেখানে শিখবেন: পর্ব ০২পর্ব ৪৬
- Foster parentingফস্টার প্যারেন্টিং
- HTML parser-এর একটি মেরামতের নিয়ম: টেবিলের ভেতরে কিন্তু কোনো ঘরের বাইরে এমন element বা লেখা এলে, যা সেখানে থাকতে পারে না, parser সেটিকে তুলে টেবিলের ঠিক আগে বসিয়ে দেয়। তাই কোডে টেবিলের ভেতরে লেখা অনুচ্ছেদ পাতায় টেবিলের ওপরে দেখায়যেখানে শিখবেন: পর্ব ৫৫
- FOUT (Flash of Unstyled Text)ফাউট
- ওয়েব ফন্ট আসার আগে লেখা বিকল্প (fallback) ফন্টে দেখানো, ফন্ট এলে বদলে যাওয়া — লেখা পড়া যায়, কিন্তু একটু লাফ দেয়যেখানে শিখবেন: পর্ব ২১পর্ব ৪৯
- fr (fraction) unitএফআর ইউনিট
- Grid-এর নিজস্ব একক। নির্দিষ্ট মাপের track আর gap বাদ দেওয়ার পর যে জায়গা থাকে, তার একটি ভাগ। 1fr 2fr মানে বাকি জায়গা ১ : ২ অনুপাতে ভাগযেখানে শিখবেন: পর্ব ২৭পর্ব ২৮পর্ব ৩০
- Fragment (#)ফ্র্যাগমেন্ট
- URL-এ # চিহ্নের পরের অংশ, যা পাতার ভেতরের একটি জায়গা (সাধারণত একটি id) বোঝায়। এটি সার্ভারে পাঠানো হয় না; ব্রাউজার নিজেই সেখানে স্ক্রল করে।যেখানে শিখবেন: পর্ব ০৫
- Frame rate / frame budgetফ্রেম রেট
- পর্দা সেকেন্ডে কতবার নতুন ছবি আঁকে — সাধারণত 60 বার, অনেক ফোনে 90 বা 120 বার। 60fps-এ প্রতিটি ফ্রেম তৈরির জন্য ব্রাউজার পায় মোটামুটি 16ms — এটিই ফ্রেমের বাজেটযেখানে শিখবেন: পর্ব ৩৯
- Free spaceফ্রি স্পেস
- flex বা grid container-এর মাপ থেকে নির্দিষ্ট মাপ (flex-এ basis, grid-এ নির্দিষ্ট track) আর gap বাদ দিয়ে যা থাকে। flex-এ grow/shrink, grid-এ fr track এটি ভাগ করে।যেখানে শিখবেন: পর্ব ২৫পর্ব ২৬পর্ব ২৭
- Front-end (ফ্রন্ট-এন্ড)ফ্রন্ট-এন্ড
- ওয়েব অ্যাপের যে অংশ ব্রাউজারে চলে এবং ব্যবহারকারী দেখেন ও ব্যবহার করেন — HTML, CSS, JavaScript দিয়ে তৈরিযেখানে শিখবেন: পর্ব ০১
- FTP (File Transfer Protocol)এফটিপি
- সার্ভারে ফাইল তোলা-নামানোর পুরোনো protocol. সাধারণ FTP পাসওয়ার্ডসহ সবকিছু এনক্রিপশন ছাড়া পাঠায়, তাই এখন FTPS বা SFTP ব্যবহার করা উচিতযেখানে শিখবেন: পর্ব ৫৩
- Full-bleed layoutফুল-ব্লিড লেআউট
- এমন নকশা যেখানে লেখা মাঝখানের পড়ার মতো সরু কলামে থাকে, কিন্তু কিছু ছবি বা ব্যানার পর্দার এক কিনারা থেকে আরেক কিনারা পর্যন্ত ছড়িয়ে যায়। নামটি এসেছে ছাপাখানার ভাষা থেকে — কাগজের কিনারা পর্যন্ত ছাপা।যেখানে শিখবেন: পর্ব ২৮পর্ব ২৯
- Full-stack (ফুল-স্ট্যাক)ফুল-স্ট্যাক
- front-end আর back-end — দুই দিকেই কাজ করতে পারা ডেভেলপার বা দক্ষতাযেখানে শিখবেন: পর্ব ০১
G
- gapগ্যাপ
- flex বা grid container-এর item-দের শুধু মাঝখানে ফাঁক দেয় — প্রথমটির আগে বা শেষটির পরে নয়। দুটি মান দিলে প্রথমটি row-gap, দ্বিতীয়টি column-gap.যেখানে শিখবেন: পর্ব ২৫পর্ব ২৬পর্ব ২৭
- Gaussian blurগাউসিয়ান ব্লার
- প্রতিটি পিক্সেলকে তার আশেপাশের পিক্সেলের সাথে ঘণ্টা-আকৃতির ওজনে মিশিয়ে ঝাপসা করার পদ্ধতি; ব্যাসার্ধ যত বড়, তত বেশি পিক্সেল মেশাতে হয়, তাই খরচও বাড়েযেখানে শিখবেন: পর্ব ৪১
- Generated contentজেনারেটেড কনটেন্ট
- CSS-এর content property দিয়ে ::before বা ::after-এ তৈরি লেখা বা বাক্স। এটি DOM-এ থাকে না, কপি করা যায় না, কিন্তু পর্দায় দেখা যায় আর screen reader অনেক সময় পড়েযেখানে শিখবেন: পর্ব ৩৪
- Generic font familyজেনেরিক ফন্ট ফ্যামিলি
- কোনো নির্দিষ্ট ফন্ট নয়, ফন্টের একটি ধরন — serif, sans-serif, monospace, system-ui, cursive. আসল কোন ফন্ট আসবে তা ব্রাউজার আর অপারেটিং সিস্টেম ঠিক করেযেখানে শিখবেন: পর্ব ২১পর্ব ৫৭
- GETগেট
- HTTP-র যে method শুধু কিছু চায়, সার্ভারে কিছু বদলায় না। ফর্মে GET হলে নাম=মান জোড়াগুলো URL-এর ? চিহ্নের পরে বসে, তাই পাতাটি বুকমার্ক বা শেয়ার করা যায়।যেখানে শিখবেন: পর্ব ০৮পর্ব ৫৭
- getBoundingClientRect()গেট-বাউন্ডিং-ক্লায়েন্ট-রেক্ট
- JavaScript-এর একটি method, যা কোনো element-এর border box-এর আসল অবস্থান আর মাপ (top, left, width, height…) ভগ্নাংশসহ জানায়, transform-এর প্রভাব ধরে।যেখানে শিখবেন: পর্ব ১৯পর্ব ৪০পর্ব ৫৫
- getComputedStyle()গেট-কম্পিউটেড-স্টাইল
- JavaScript-এর একটি function, যা কোনো element-এর প্রতিটি CSS property-র চূড়ান্ত মান দেয় — cascade, উত্তরাধিকার আর একক বদলের পরে যা আসলে বসেছে। রং আসে rgb() আকারে, মাপ px-এ; “কোন rule জিতল” যাচাইয়ের সবচেয়ে সরাসরি উপায়যেখানে শিখবেন: পর্ব ৫৫
- getPropertyValue()গেট-প্রপার্টি-ভ্যালু
- JavaScript method, যা একটি CSS property-র মান লেখা হিসেবে ফেরত দেয়। getComputedStyle(el).getPropertyValue('--brand') দিয়ে element-এর জন্য variable-এর চূড়ান্ত মান পড়া যায়যেখানে শিখবেন: পর্ব ৩৩পর্ব ৫২
- Gitগিট
- সবচেয়ে প্রচলিত বিনামূল্যের version control টুল। আপনার কম্পিউটারেই চলে, ইন্টারনেট ছাড়াও কাজ করে; ২০০৫ সালে Linus Torvalds তৈরি করেনযেখানে শিখবেন: পর্ব ৫৩পর্ব ৫৬
- Git Bashগিট ব্যাশ
- Git for Windows-এর সাথে আসা একটি terminal, যেখানে Linux-এর মতো কমান্ড (ls, cat, touch) চলে। অনলাইনের বেশিরভাগ Git টিউটোরিয়াল এই ধাঁচেই লেখাযেখানে শিখবেন: পর্ব ৫৩
- Git Credential Managerক্রেডেনশিয়াল ম্যানেজার
- Git for Windows-এর সাথে আসা একটি সহায়ক প্রোগ্রাম — প্রথম push-এর সময় ব্রাউজারে GitHub লগইন খুলে দেয় আর পরিচয়টি নিরাপদে মনে রাখেযেখানে শিখবেন: পর্ব ৫৩
- GitHubগিটহাব
- Git repository অনলাইনে রাখার সবচেয়ে বড় প্ল্যাটফর্ম। কোড শেয়ার, দলের কাজ, pull request আর GitHub Pages দিয়ে সাইট প্রকাশ — সব এক জায়গায়। Git একটি টুল, GitHub একটি সেবাযেখানে শিখবেন: পর্ব ৫৩
- GitHub Pagesগিটহাব পেজেস
- GitHub-এর static site hosting সেবা — repository-র একটি branch-এর HTML-CSS-JS ফাইল সরাসরি ওয়েবসাইট হিসেবে প্রকাশ করে, ঠিকানা হয় username.github.ioযেখানে শিখবেন: পর্ব ৫৩পর্ব ৫৭
- .gitignoreগিট-ইগনোর
- প্রজেক্টের মূল ফোল্ডারের একটি সাধারণ লেখার ফাইল, যেখানে বলে দেওয়া হয় কোন ফাইল বা ফোল্ডার Git একেবারে উপেক্ষা করবে — যেমন .env, node_modules/, লগ ফাইলযেখানে শিখবেন: পর্ব ৫৩
- Glassmorphismগ্লাসমরফিজম
- ঘষা কাচের মতো আধা-স্বচ্ছ, পেছনটা ঝাপসা দেখায় এমন প্যানেল দিয়ে নকশার একটি ধারা; CSS-এ সাধারণত backdrop-filter দিয়ে বানানো হয়যেখানে শিখবেন: পর্ব ৪১
- Global attributeগ্লোবাল অ্যাট্রিবিউট
- যে attribute যেকোনো HTML element-এ বসানো যায় — যেমন id, class, title, lang, hidden, style, data-*যেখানে শিখবেন: পর্ব ০৩
- Global scope (CSS)গ্লোবাল স্কোপ
- CSS-এর স্বাভাবিক আচরণ — প্রতিটি selector পুরো পাতার সব মিলে যাওয়া element-এ খাটে, কোন ফাইলে লেখা তা দেখে না। তাই দুই জায়গায় একই class-এর নাম দিলে সংঘাত হয়।যেখানে শিখবেন: পর্ব ৪৬
- Glyphগ্লিফ
- ফন্টের ভেতরে আঁকা একটি নির্দিষ্ট আকার। একটি অক্ষরের একাধিক glyph থাকতে পারে, আবার কয়েকটি অক্ষর মিলে একটি glyph হতে পারে (যেমন ক্ষ)যেখানে শিখবেন: পর্ব ১৪
- Google Search Consoleসার্চ কনসোল
- Google-এর বিনামূল্যের টুল — আপনার সাইট সার্চে কীভাবে দেখাচ্ছে, কোন পাতা index হয়নি, কী সমস্যা আছে জানায়; এখানে sitemap.xml জমা দেওয়া যায়যেখানে শিখবেন: পর্ব ৫৩
- GPU (Graphics Processing Unit)জি-পি-ইউ
- ছবি আর গ্রাফিক্সের হিসাব একসাথে অনেক পিক্সেলে করার জন্য বিশেষ প্রসেসর; ব্রাউজার compositing আর অনেক filter-এর কাজ এতে পাঠায়যেখানে শিখবেন: পর্ব ৪১
- Graceful degradationগ্রেসফুল ডিগ্রেডেশন
- আগে সবচেয়ে নতুন ব্রাউজারের জন্য পূর্ণ নকশা বানিয়ে পরে পুরোনো ব্রাউজারে যতটা সম্ভব কম ভাঙার ব্যবস্থা করার পদ্ধতি — progressive enhancement-এর উল্টো দিক থেকে শুরুযেখানে শিখবেন: পর্ব ৪৮পর্ব ৫৭
- Gradientগ্রেডিয়েন্ট
- এক রং থেকে আরেক রঙে ধীরে ধীরে বদলে যাওয়া নকশা; CSS-এ এটি ব্রাউজারের আঁকা একটি ছবি, তাই background-image-এ বসেযেখানে শিখবেন: পর্ব ২২
- Grid area (grid-area)গ্রিড এরিয়া
- চারটি grid line দিয়ে ঘেরা যেকোনো আয়তাকার অংশ, এক বা একাধিক ঘর মিলে; আর একই নামের property, যা দিয়ে একটি item-কে নাম দেওয়া এলাকায় বা লাইন নম্বর ধরে বসানো হয় — যেমন grid-area: main বা grid-area: 1 / 1 / 3 / 2যেখানে শিখবেন: পর্ব ২৭পর্ব ২৮পর্ব ২৯
- Grid cellগ্রিড সেল
- একটি সারি আর একটি কলাম মিলে তৈরি ছকের সবচেয়ে ছোট ঘরযেখানে শিখবেন: পর্ব ২৭
- Grid containerগ্রিড কন্টেইনার
- যে element-এ display: grid লেখা হয়। সে নিজে ছক কাটা কাগজের মতো, আর তার সরাসরি সন্তানরা ছকের ঘরে বসেযেখানে শিখবেন: পর্ব ২৭
- Grid itemগ্রিড আইটেম
- grid container-এর সরাসরি সন্তান element. শুধু সন্তানরাই item হয়, তাদের ভেতরের element (নাতি-নাতনি) নয়যেখানে শিখবেন: পর্ব ২৭
- Grid lineগ্রিড লাইন
- track-গুলোর মাঝের আর দুই কিনারার দাগ। ১ থেকে নম্বর দেওয়া থাকে, আর শেষ দিক থেকে −১, −২… n টি track-এ n + 1 টি লাইনযেখানে শিখবেন: পর্ব ২৭
- Grid overlay (DevTools)গ্রিড ওভারলে
- ব্রাউজারের DevTools-এর একটি সুবিধা, যা পাতার ওপর grid-এর লাইন, লাইন নম্বর আর track-এর মাপ রঙিন দাগে এঁকে দেখায়যেখানে শিখবেন: পর্ব ২৭পর্ব ৪৭
- Grid system (framework-এর)গ্রিড সিস্টেম
- পাতাকে নির্দিষ্ট সংখ্যক কলামে (যেমন Bootstrap-এ ১২টি) ভাগ করে সারি-কলামে সাজানোর তৈরি class-এর ব্যবস্থা, যেমন .row আর .col-sm-6. ভেতরে Flexbox আর media query দিয়ে তৈরি।যেখানে শিখবেন: পর্ব ৫১
- Grid trackগ্রিড ট্র্যাক
- ছকের একটি পুরো সারি বা একটি পুরো কলাম। grid-template-columns আর grid-template-rows-এ প্রতিটি মান একটি track-এর মাপযেখানে শিখবেন: পর্ব ২৭পর্ব ২৮
- grid-auto-flowগ্রিড অটো ফ্লো
- auto-placement কোন দিকে ঘর ভরাবে তা ঠিক করার property: row (ডিফল্ট, সারি ধরে), column (কলাম ধরে), আর সাথে dense দিলে পেছনের ফাঁকা ঘরও ভরায়যেখানে শিখবেন: পর্ব ২৭
- grid-template-areasগ্রিড টেমপ্লেট এরিয়াস
- grid container-এর property, যেখানে উদ্ধৃতি-চিহ্নের ভেতরে নাম লিখে লেআউটের ছবি আঁকা হয় — প্রতিটি স্ট্রিং একটি সারি, প্রতিটি শব্দ একটি ঘর, একই নামের ঘর মিলে একটি আয়তাকার এলাকা, আর বিন্দু (.) মানে খালি ঘর।যেখানে শিখবেন: পর্ব ২৮পর্ব ২৯পর্ব ৫৯
- Guaranteed-invalid valueগ্যারান্টিড-ইনভ্যালিড ভ্যালু
- যে custom property ঘোষণাই করা হয়নি (বা যার মান initial), তার বিশেষ “শূন্য” মান। var() এমন মান পেলে fallback ব্যবহার করে; fallback না থাকলে property unset-এর মতো আচরণ করেযেখানে শিখবেন: পর্ব ৩৩
H
- Hard stopহার্ড স্টপ
- gradient-এ দুটি রঙের stop একই অবস্থানে দেওয়া, ফলে মেশানো ছাড়াই রং হঠাৎ বদলায় — ডোরা, পতাকা, পাই চার্টের কৌশলযেখানে শিখবেন: পর্ব ২২
- HarfBuzzহার্ফবাজ
- ওপেন সোর্স text shaping ইঞ্জিন, যা Chrome, Firefox, Android-এর মতো বহু সফটওয়্যার বাংলাসহ জটিল লিপি সাজাতে ব্যবহার করে। নামটি ফারসি “হরফ” থেকেযেখানে শিখবেন: পর্ব ১৪
- HEADহেড
- Git-এর একটি বিশেষ নাম, যা বলে আপনি এখন কোন branch-এ (আর সেই branch-এর কোন commit-এ) দাঁড়িয়ে আছেনযেখানে শিখবেন: পর্ব ৫৩
- head (<head>)হেড
- HTML পাতার যে অংশে পাতা সম্পর্কে তথ্য (metadata) থাকে — charset, title, meta, link, CSS. এর কিছুই পর্দায় আঁকা হয় না, কিন্তু ব্রাউজার, সার্চ ইঞ্জিন আর সোশ্যাল অ্যাপ এটি পড়েযেখানে শিখবেন: পর্ব ১৩পর্ব ১৬
- headers (attribute)হেডার্স
- ডেটা-ঘরের (<td>, দরকারে <th>-এরও) attribute, যেখানে ফাঁকা দিয়ে আলাদা করে সেই সব শিরোনাম-ঘরের id লেখা হয় যেগুলো এই ঘরের শিরোনাম। দুই স্তরের শিরোনামের মতো জটিল টেবিলে কাজে লাগে।যেখানে শিখবেন: পর্ব ০৭
- Heading (h1–h6)হেডিং
- পেজ বা অংশের শিরোনাম; <h1> থেকে <h6> পর্যন্ত ছয় স্তর, যেখানে সংখ্যা মানে গুরুত্ব ও গভীরতা, অক্ষরের আকার নয়যেখানে শিখবেন: পর্ব ০৪
- Hex color (#RRGGBB)হেক্স কালার
- লাল, সবুজ আর নীলের মাত্রা ষোলো-ভিত্তিক দুই অঙ্ক করে লেখা রং, যেমন #006A4E. ছোট রূপ #RGB, আর স্বচ্ছতাসহ #RRGGBBAAযেখানে শিখবেন: পর্ব ২০
- History sniffingহিস্ট্রি স্নিফিং
- কোনো সাইট লুকিয়ে অনেক লিংক বসিয়ে :visited-এর চেহারা মেপে ব্যবহারকারীর ব্রাউজিং ইতিহাস জেনে নেওয়ার পুরোনো কৌশল। এর কারণেই আজ :visited-এ শুধু রং বদলানো যায়যেখানে শিখবেন: পর্ব ৩৪
- Hit testingহিট টেস্টিং
- মাউস ক্লিক বা আঙুলের স্পর্শ পাতার ঠিক কোন element-এর ওপর পড়েছে, ব্রাউজারের সেটা হিসাব করার প্রক্রিয়াযেখানে শিখবেন: পর্ব ৪১পর্ব ৫৫
- Holy grail layoutহোলি গ্রেইল লেআউট
- ওপরে header, নিচে footer, মাঝে তিন কলাম (মেনু, মূল লেখা, পাশের অংশ) — সমান উঁচু, মাঝেরটি নমনীয়। float-এর যুগে খুব কঠিন ছিল বলে এই নাম; এখন Flexbox বা Grid-এ সহজ।যেখানে শিখবেন: পর্ব ২৬পর্ব ২৯পর্ব ৫৯
- hover / pointer media featureহোভার, পয়েন্টার মিডিয়া ফিচার
- media query-র যে শর্তগুলো ইনপুটের ক্ষমতা দেখে: (hover: hover) মানে মূল পয়েন্টারে সহজে hover করা যায়, (pointer: fine) মানে মাউসের মতো সূক্ষ্ম, (pointer: coarse) মানে আঙুলের মতো মোটা। any-hover আর any-pointer যেকোনো যুক্ত ইনপুট দেখে।যেখানে শিখবেন: পর্ব ৩০পর্ব ৩১পর্ব ৩৮
- hrefএইচ-রেফ
- hypertext reference — <a> ও <link>-এর যে attribute-এ গন্তব্যের ঠিকানা (URL) লেখা হয়। এটি absolute, relative বা #id আকারে হতে পারে।যেখানে শিখবেন: পর্ব ০৫
- hreflangএইচ-রেফ-ল্যাং
- <link rel="alternate" hreflang="bn">-এর মতো লাইন, যা জানায় একই পাতার অন্য ভাষা বা অঞ্চলের সংস্করণ কোথায়; প্রতিটি সংস্করণে সব সংস্করণের তালিকা থাকতে হয়যেখানে শিখবেন: পর্ব ১৩
- hsl()এইচ-এস-এল
- hue (রঙের চাকায় কোণ ০–৩৬০), saturation (তীব্রতা) আর lightness (আলো) দিয়ে রং লেখার function — মানুষের পক্ষে নাড়াচাড়া সহজ, তবে lightness চোখের অনুভূতির সাথে পুরোপুরি মেলে নাযেখানে শিখবেন: পর্ব ২০
- .htaccessডট-এইচটি-অ্যাক্সেস
- Apache সার্ভারের ফোল্ডারভিত্তিক সেটিং ফাইল — redirect, কাস্টম 404 পাতা, HTTPS-এ পাঠানো, cache-এর নিয়ম এখানে লেখা হয়যেখানে শিখবেন: পর্ব ৫৩
- HTMLএইচটিএমএল
- HyperText Markup Language — ওয়েব পেজের কাঠামো ও অর্থের ভাষা। ট্যাগ দিয়ে বলে কোনটা শিরোনাম, অনুচ্ছেদ, লিংক, ছবি বা বোতামযেখানে শিখবেন: পর্ব ০১পর্ব ০৩পর্ব ৫৭
- HTML parserএইচটিএমএল পার্সার
- ব্রাউজারের যে অংশ HTML লেখা অক্ষর ধরে ধরে পড়ে DOM গাছ বানায়; ভুল লেখা পেলেও HTML-এর নির্দিষ্ট নিয়ম মেনে নিজে মেরামত করে নেয়যেখানে শিখবেন: পর্ব ০২পর্ব ০৪পর্ব ৫২
- HTML web componentএইচটিএমএল ওয়েব কম্পোনেন্ট
- এমন custom element, যার ভেতরে আগে থেকেই কাজ করা সাধারণ HTML থাকে আর স্ক্রিপ্ট শুধু বাড়তি সুবিধা যোগ করে; স্ক্রিপ্ট না চললেও মূল কাজ চলে — progressive enhancement-এর ধরনযেখানে শিখবেন: পর্ব ৫২
- HTML5এইচটিএমএল ফাইভ
- HTML-এর বড় পুনর্গঠনের প্রচলিত নাম (W3C Recommendation ২০১৪): অর্থবহ ট্যাগ, plugin ছাড়া ভিডিও-অডিও, নতুন ফর্ম ইনপুট আর ভুল HTML পড়ার নির্দিষ্ট নিয়ম। আজ এটি Living Standard-এর অংশযেখানে শিখবেন: পর্ব ০১পর্ব ৫৭
- HTTPএইচটিটিপি
- HyperText Transfer Protocol — ব্রাউজার আর সার্ভারের কথা বলার নিয়ম: ব্রাউজার request পাঠায়, সার্ভার response দেয়যেখানে শিখবেন: পর্ব ০১
- HTTP compression (gzip, Brotli)এইচটিটিপি কম্প্রেশন
- সার্ভার ফাইল পাঠানোর আগে চেপে ছোট করে (gzip বা Brotli), ব্রাউজার পেয়ে আবার খুলে নেয়। লেখা-ভিত্তিক HTML, CSS, JS-এ আকার অনেকটা কমে; ছবি আগেই চাপা থাকে বলে তাতে লাভ সামান্যযেখানে শিখবেন: পর্ব ৪৯
- HTTP requestএইচটিটিপি রিকোয়েস্ট
- ব্রাউজার সার্ভারকে যে অনুরোধ পাঠায়। প্রথম লাইনে method (যেমন GET) আর path, তারপর header-এ বাড়তি তথ্যযেখানে শিখবেন: পর্ব ০১পর্ব ০৮পর্ব ০৯
- HTTP responseএইচটিটিপি রেসপন্স
- request-এর জবাবে সার্ভার যা ফেরত পাঠায়: status code (যেমন 200), header (যেমন Content-Type), তারপর আসল বিষয়বস্তু — HTML, CSS, ছবি ইত্যাদিযেখানে শিখবেন: পর্ব ০১
- HTTPSএইচটিটিপিএস
- TLS এনক্রিপশনের ভেতর দিয়ে চলা HTTP. মাঝপথে কেউ কথা পড়তে বা বদলাতে পারে না, আর সার্ভারের পরিচয় certificate দিয়ে যাচাই হয়। তবে এটি সাইটের সততার নিশ্চয়তা নয়যেখানে শিখবেন: পর্ব ০১পর্ব ৫৭
- Hyperlinkহাইপারলিংক
- এক পাতা বা জায়গা থেকে অন্য পাতা, ফাইল বা একই পাতার অন্য অংশে যাওয়ার ক্লিকযোগ্য সংযোগ। সংক্ষেপে লিংক; HTML-এ বানানো হয় <a> দিয়ে।যেখানে শিখবেন: পর্ব ০৫
- Hypertext (হাইপারটেক্সট)হাইপারটেক্সট
- এমন লেখা যার ভেতরে লিংক থাকে, আর লিংকে চাপলে অন্য লেখা বা নথিতে যাওয়া যায়। HTML আর HTTP নামের H এখান থেকেইযেখানে শিখবেন: পর্ব ০১
- Hyphenation (hyphens)হাইফেনেশন
- লাইনের শেষে লম্বা শব্দ ভেঙে হাইফেন (-) বসানো। CSS-এ hyphens: auto; ব্রাউজারকে lang attribute দেখে ভাষা জানতে হয় আর সেই ভাষার অভিধান লাগেযেখানে শিখবেন: পর্ব ২১
I
- Icon fontআইকন ফন্ট
- অক্ষরের বদলে ছোট ছবি (আইকন) ভরা একটি web font. কোনো একটি অক্ষর-ঘর দেখালেই আইকন আসে। একসময় খুব জনপ্রিয় ছিল, এখন বেশিরভাগ ক্ষেত্রে SVG আইকন পছন্দ করা হয়যেখানে শিখবেন: পর্ব ৪৪
- Icon libraryআইকন লাইব্রেরি
- একই নকশা-নিয়মে আঁকা শত-হাজার আইকনের প্রস্তুত সংগ্রহ, যেমন Lucide, Heroicons, Material Symbols, Font Awesome. এতে সব আইকনের মাপ, রেখার পুরুত্ব আর ধরন মিলে থাকেযেখানে শিখবেন: পর্ব ৪৪
- id attributeআইডি
- একটি element-কে পুরো পাতায় অনন্য একটি নাম দেওয়ার attribute. একটি id পাতায় একবারই থাকবে, ফাঁকা জায়গা ছাড়া; #id লিংক, CSS আর JavaScript একে খুঁজে নেয়।যেখানে শিখবেন: পর্ব ০৫পর্ব ১১পর্ব ১৭
- ID selectorআইডি সিলেক্টর
- # আর id-এর নাম দিয়ে লেখা selector, যেমন #featured — পাতার একটিমাত্র element ধরে। এর specificity খুব বেশি, তাই স্টাইলের জন্য সাধারণত class ভালো।যেখানে শিখবেন: পর্ব ১৭পর্ব ৫৭
- if() (CSS)ইফ ফাংশন
- CSS-এর নতুন একটি ফাংশন, যা একটি property-র ভেতরেই শর্ত অনুযায়ী মান বেছে নেয় — যেমন একটি custom property-র মান বা media query মিললে এক রং, না মিললে আরেক রং। এখনো অল্প কিছু ব্রাউজারে আছেযেখানে শিখবেন: পর্ব ৩৭
- Image CDNইমেজ সি-ডি-এন
- এমন সেবা যা একটি মূল ছবি রেখে ঠিকানায় লেখা নির্দেশ (যেমন ?w=800) অনুযায়ী তখনই ছোট-বড় মাপ বা আধুনিক ফরম্যাট বানিয়ে, cache করে, কাছের সার্ভার থেকে পাঠায়।যেখানে শিখবেন: পর্ব ৩২
- image-set()ইমেজ-সেট
- CSS-এর function, যা background-image-এ কয়েকটি বিকল্প ছবি দেয় — প্রতিটির সাথে 1x/2x ঘনত্ব আর চাইলে type() দিয়ে ফরম্যাট। ব্রাউজার চেনা ফরম্যাটের মধ্যে পর্দার সাথে মানানসইটি নেয়।যেখানে শিখবেন: পর্ব ৩২
- Implicit gridইমপ্লিসিট গ্রিড
- item বেশি হলে বা ছকের বাইরে বসানো হলে ব্রাউজার নিজে যে বাড়তি সারি বা কলাম তৈরি করে। এদের মাপ দেয় grid-auto-rows আর grid-auto-columnsযেখানে শিখবেন: পর্ব ২৭
- Implicit roleইমপ্লিসিট রোল
- যে role একটি HTML element নিজে থেকেই পায়, কিছু লিখতে হয় না — যেমন <nav> পায় navigation, <main> পায় main. একই role আবার হাতে লেখা অপ্রয়োজনীয়।যেখানে শিখবেন: পর্ব ১০
- Implicit submissionইমপ্লিসিট সাবমিশন
- এক লাইনের ঘরে Enter চাপলে ফর্ম জমা হওয়া — ব্রাউজার তখন ফর্মের প্রথম submit বোতামটি চাপার মতো কাজ করে।যেখানে শিখবেন: পর্ব ০৮
- In-app browserইন-অ্যাপ ব্রাউজার
- ফেসবুক, মেসেঞ্জারের মতো অ্যাপের ভেতরে লিংক চাপলে যে ছোট ব্রাউজারে পাতা খোলে। এটি আলাদা ব্রাউজার অ্যাপ নয়, ভেতরে WebView ব্যবহার করে, আর কিছু সুবিধা সাধারণ ব্রাউজারের চেয়ে ভিন্নভাবে আচরণ করেযেখানে শিখবেন: পর্ব ৪৮
- Inactive CSSইনঅ্যাকটিভ সিএসএস
- এমন CSS declaration যা নির্ভুল ও জয়ী, কিন্তু প্রসঙ্গের কারণে কোনো প্রভাব ফেলে না — যেমন flex container ছাড়া justify-content বা inline element-এ width. DevTools এগুলো ধূসর করে ⓘ চিহ্নে কারণ বলে দেয়; ধারণাটি প্রথম আনে Firefoxযেখানে শিখবেন: পর্ব ৪৭
- index.htmlইনডেক্স ডট এইচটিএমএল
- ফোল্ডারের প্রধান পেজের প্রচলিত নাম। ঠিকানায় শুধু ফোল্ডারের নাম দিলে বেশিরভাগ web server নিজে থেকেই এই ফাইলটি দেখায়যেখানে শিখবেন: পর্ব ০২পর্ব ১৫পর্ব ৫৩
- Individual transform properties (translate, rotate, scale)ইন্ডিভিজুয়াল ট্রান্সফর্ম প্রপার্টিজ
- translate, rotate আর scale নামের তিনটি আলাদা CSS property. একটি বদলালে অন্যগুলো অটুট থাকে; ব্রাউজার সবসময় translate → rotate → scale → transform ক্রমে এগুলো জোড়ে। এখন Baseline Widely available.যেখানে শিখবেন: পর্ব ৪০
- Inertইনার্ট
- অচল অবস্থা — element-টিতে চাপা যায় না, Tab-এ focus যায় না, screen reader-ও এড়িয়ে যায়। modal খোলা থাকলে বাকি পাতা এমন হয়; inert নামে একটি HTML attribute-ও আছেযেখানে শিখবেন: পর্ব ১১পর্ব ২৩পর্ব ২৪
- Information architectureইনফরমেশন আর্কিটেকচার
- সাইটের তথ্য কোন পাতায়, কোন ক্রমে, কোন নামে সাজানো হবে তা ঠিক করার কাজ — যাতে পাঠক সহজে যা খুঁজছেন তা পান।যেখানে শিখবেন: পর্ব ১৫
- Inheritanceইনহেরিট্যান্স
- কোনো declaration সরাসরি না লাগলে কিছু property-র মান parent element থেকে child-এ নেমে আসার নিয়ম — যেমন body-তে দেওয়া color ভেতরের সব লেখায় যায়।যেখানে শিখবেন: পর্ব ১৮পর্ব ২০পর্ব ২২
- Inherited propertyইনহেরিটেড প্রপার্টি
- যে property ডিফল্টভাবে parent থেকে child-এ নামে — মূলত লেখার বৈশিষ্ট্য, যেমন color, font-family, line-height. border, margin, padding, background এমন নয়।যেখানে শিখবেন: পর্ব ১৮পর্ব ৩৩পর্ব ৩৬
- Initial containing block (ICB)ইনিশিয়াল কনটেইনিং ব্লক
- পাতার একেবারে শুরুতে বসানো, viewport-এর সমান মাপের একটি আয়তক্ষেত্র। কোনো positioned পূর্বপুরুষ না থাকলে absolute বাক্স এর সাপেক্ষে বসে, আর পাতার সাথে স্ক্রল করে।যেখানে শিখবেন: পর্ব ২৪পর্ব ৫৫
- Initial valueইনিশিয়াল ভ্যালু
- স্পেসিফিকেশনে প্রতিটি property-র জন্য লেখা প্রাথমিক মান — যেমন border-style-এর none, display-এর inline. ব্রাউজারের ডিফল্ট stylesheet-এর মান থেকে এটি আলাদা।যেখানে শিখবেন: পর্ব ১৮পর্ব ৩৩পর্ব ৫৫
- Inline axisইনলাইন অ্যাক্সিস
- লেখা যে দিকে চলে সেই দিক — বাংলা বা ইংরেজিতে আড়াআড়ি। Grid-এ justify- দিয়ে শুরু হওয়া property এই দিকে কাজ করেযেখানে শিখবেন: পর্ব ২৭
- Inline axis ও block axisইনলাইন অক্ষ, ব্লক অক্ষ
- লেখার দিক ধরে CSS-এর দুই অক্ষ: inline অক্ষ = একটি লাইনের ভেতরে শব্দ যেদিকে চলে (বাংলায় বাঁ থেকে ডানে), block অক্ষ = নতুন লাইন বা block যেদিকে জমে (বাংলায় ওপর থেকে নিচে)যেখানে শিখবেন: পর্ব ২৩পর্ব ৩৫
- Inline elementইনলাইন এলিমেন্ট
- লেখার লাইনের ভেতরে বসে, নতুন লাইন শুরু করে না এমন element — যেমন strong, em, span, a; আজকের spec-এ এদের বলা হয় phrasing content, আর আচরণটি আসে CSS-এর display: inline থেকেযেখানে শিখবেন: পর্ব ০৪পর্ব ১৯পর্ব ২৩
- Inline styleইনলাইন স্টাইল
- কোনো element-এর ট্যাগের ভেতরে style attribute দিয়ে সরাসরি লেখা CSS, যেমন <p style="color: red">. শুধু ওই একটি element-এ খাটে, অগ্রাধিকার খুব বেশি।যেখানে শিখবেন: পর্ব ১৬পর্ব ১৮পর্ব ৫২
- Inline SVGইনলাইন এস-ভি-জি
- আলাদা ফাইল না রেখে <svg> কোড সরাসরি HTML পাতার ভেতরে লেখা। তখন SVG-র প্রতিটি অংশ পাতার DOM-এ থাকে, তাই পাতার CSS আর JavaScript সেগুলো বদলাতে পারেযেখানে শিখবেন: পর্ব ৪৪পর্ব ৫৯
- innerHTMLইনার এইচটিএমএল
- element-এর ভেতরের HTML লেখা হিসেবে; এতে কিছু বসালে ব্রাউজার সেটি HTML হিসেবে পার্স করে। বাইরের অবিশ্বস্ত লেখা এখানে দিলে XSS-এর ঝুঁকি তৈরি হয়যেখানে শিখবেন: পর্ব ৫২
- INP (Interaction to Next Paint)আই-এন-পি
- পাতায় ক্লিক, ট্যাপ বা কী চাপার পর পরের ছবিটি পর্দায় আসতে কত সময় লাগে, তার মাপ — পুরো ভিজিটের প্রায় সবচেয়ে ধীর সাড়াটি ধরা হয়। Core Web Vitals-এর একটি; ২০০ মিলিসেকেন্ড বা কম হলে ভালো। ২০২৪ সালের মার্চে FID-এর জায়গা নেয়যেখানে শিখবেন: পর্ব ৪৯পর্ব ৫৭পর্ব ৫৮
- Input groupইনপুট গ্রুপ
- একটি ফর্মের ঘর আর তার গায়ে লাগানো বোতাম বা লেখা এক দলে — যেমন সার্চ বক্স আর “খুঁজুন” বোতাম। ঘর বাকি জায়গা নেয় (flex: 1; min-width: 0), বোতাম নিজের মাপে থাকে।যেখানে শিখবেন: পর্ব ২৬
- Input typeইনপুট টাইপ
- <input>-এর type attribute, যা ঠিক করে ঘরটি কী নেবে আর কেমন আচরণ করবে — text, email, date, range, color, file ইত্যাদি। অচেনা type পেলে ব্রাউজার সাধারণ text দেখায়।যেখানে শিখবেন: পর্ব ০৯
- inputmodeইনপুটমোড
- ফোনে কোন ধরনের অন-স্ক্রিন কি-বোর্ড আসবে তার ইঙ্গিত — যেমন numeric দিলে অঙ্কের প্যাড। এটি কোনো যাচাই করে না, শুধু কি-বোর্ড বদলায়।যেখানে শিখবেন: পর্ব ০৮পর্ব ০৯
- insetইনসেট
- top, right, bottom আর left একসাথে লেখার shorthand property — margin-এর মতো ওপর থেকে ঘড়ির কাঁটার দিকে। inset: 0 মানে চার দিকেই 0, অর্থাৎ পুরো containing block ঢেকে দেওয়া।যেখানে শিখবেন: পর্ব ২৪পর্ব ৩৫পর্ব ৫৭
- Internal stylesheetইন্টারনাল স্টাইলশিট
- পাতার head-এর ভেতরে <style> ট্যাগে লেখা CSS. শুধু সেই একটি পাতায় খাটে, আলাদা করে ক্যাশ হয় না।যেখানে শিখবেন: পর্ব ১৬
- Internet (ইন্টারনেট)ইন্টারনেট
- সারা পৃথিবীর কোটি কোটি কম্পিউটার ও নেটওয়ার্ককে TCP/IP নিয়মে জোড়া দেওয়া বিশাল নেটওয়ার্ক। ওয়েব, ইমেইল, ভিডিও কল সব এর ওপর চলেযেখানে শিখবেন: পর্ব ০১
- Interop (ইন্টারঅপ প্রজেক্ট)ইন্টারঅপ
- প্রধান ব্রাউজার-নির্মাতাদের বার্ষিক যৌথ উদ্যোগ। প্রতি বছর কিছু ফিচার বেছে নেওয়া হয়, আর সবাই মিলে সেগুলো একই রকম ও নির্ভুলভাবে চালু করার চেষ্টা করেন; অগ্রগতি মাপা হয় যৌথ পরীক্ষা (web-platform-tests) দিয়েযেখানে শিখবেন: পর্ব ৩৭পর্ব ৪৮
- interpolate-size / calc-size()ইন্টারপোলেট সাইজ
- height: auto-র মতো keyword মাপ পর্যন্ত transition বা animation চালানোর নতুন উপায়। :root-এ interpolate-size: allow-keywords দিলে পুরো পাতায় চালু হয়; calc-size(auto, size) দিয়ে একটি জায়গায় আলাদাভাবে করা যায়যেখানে শিখবেন: পর্ব ৩৭পর্ব ৩৮
- Interpolation (ইন্টারপোলেশন)ইন্টারপোলেশন
- দুটি মানের মাঝামাঝি মান হিসাব করা — যেমন 10px আর 20px-এর মাঝে 15px, লাল আর নীলের মাঝে বেগুনি। transition আর animation প্রতি ফ্রেমে এই হিসাব করেই মসৃণ নড়াচড়া দেখায়যেখানে শিখবেন: পর্ব ৩৮পর্ব ৩৯পর্ব ৫০
- IntersectionObserverইন্টারসেকশন অবজারভার
- JavaScript-এর একটি API, যা জানায় কোনো element একটি স্ক্রল-জানালায় (বা পুরো পর্দায়) ঢুকল বা বেরোল, আর কতটা দেখা যাচ্ছে। প্রতি পিক্সেলে নয়, শুধু নির্দিষ্ট সীমা পেরোলে খবর দেয়, তাই scroll event-এর চেয়ে দক্ষযেখানে শিখবেন: পর্ব ৪২
- Intrinsic layoutইনট্রিনসিক লেআউট
- যে লেআউট পর্দার নির্দিষ্ট মাপ (breakpoint) না দেখে নিজের ভেতরের জিনিস আর পাওয়া জায়গা দেখে নিজেই সাজ বদলায় — যেমন flex-wrap বা auto-fit দিয়ে।যেখানে শিখবেন: পর্ব ২৯পর্ব ৩০পর্ব ৩১
- Intrinsic sizingইনট্রিনসিক সাইজিং
- বাইরে থেকে নির্দিষ্ট মাপ না দিয়ে ভেতরের কনটেন্ট দেখে মাপ ঠিক করা — min-content, max-content, fit-content আর auto এর উদাহরণ। এর উল্টো extrinsic sizing, যেমন width: 300px বা 50%.যেখানে শিখবেন: পর্ব ২৮
- Invalid at computed-value time (IACVT)ইনভ্যালিড অ্যাট কম্পিউটেড-ভ্যালু টাইম
- var() বসানোর পর মানটি property-র জন্য অর্থহীন হলে declaration-এর এই অবস্থা হয়। তখন ব্রাউজার আগের declaration-এ ফেরে না; property আচরণ করে unset-এর মতো — উত্তরাধিকারী হলে parent-এর মান, না হলে initial valueযেখানে শিখবেন: পর্ব ৩৩পর্ব ৪৮পর্ব ৫৫
- Inverted pyramidউল্টো পিরামিড
- সাংবাদিকতার লেখার ধরন — সবচেয়ে জরুরি কথা সবার আগে, তারপর কম জরুরি বিস্তারিত; ওয়েবে চোখ বুলিয়ে পড়া পাঠকের জন্য খুব কাজের।যেখানে শিখবেন: পর্ব ১৫
- Invoker commands (command / commandfor)ইনভোকার কমান্ডস
- বাটনের দুটি নতুন attribute — commandfor-এ লক্ষ্য element-এর id, command-এ নির্দেশ (যেমন show-modal, close, toggle-popover); এতে JavaScript ছাড়াই বাটন দিয়ে dialog বা popover খোলা-বন্ধ করা যায়। Baseline Newly availableযেখানে শিখবেন: পর্ব ১১পর্ব ৫২পর্ব ৫৯
- IP address (আইপি ঠিকানা)আইপি অ্যাড্রেস
- নেটওয়ার্কে প্রতিটি যন্ত্রের সংখ্যাভিত্তিক ঠিকানা, যেমন 203.0.113.25. কম্পিউটার নাম নয়, এই নম্বর দিয়েই একে অপরকে খোঁজেযেখানে শিখবেন: পর্ব ০১পর্ব ৫৭
- isolationআইসোলেশন
- যে CSS property-র মান isolate দিলে element একটি নতুন stacking context হয়ে যায় — কোনো z-index বা position ছাড়াই। component-এর ভেতরের z-index ভেতরে আটকে রাখতে কাজে লাগে, আর ভেতরের mix-blend-mode-কে বাইরের পাতার সাথে মিশতে দেয় না।যেখানে শিখবেন: পর্ব ২৪পর্ব ৪১
- ITCSS (Inverted Triangle CSS)আই-টি-সিএসএস
- Harry Roberts-এর মডেল — CSS-কে উল্টো ত্রিভুজের মতো স্তরে সাজানো: settings, tools, generic, elements, objects, components, utilities. ওপর থেকে নিচে নিয়মের ছোঁয়া কমে, specificity বাড়ে।যেখানে শিখবেন: পর্ব ৪৬
J
- Jank (জ্যাঙ্ক)জ্যাঙ্ক
- ব্রাউজার সময়মতো নতুন ফ্রেম আঁকতে না পারায় অ্যানিমেশন বা স্ক্রলের ঝাঁকুনি আর কাঁপুনি। সাধারণ কারণ: প্রতি ফ্রেমে layout বা বড় paint, বা ব্যস্ত main threadযেখানে শিখবেন: পর্ব ৩৮পর্ব ৩৯পর্ব ৪২
- JavaScriptজাভাস্ক্রিপ্ট
- ব্রাউজারে চলা প্রোগ্রামিং ভাষা, যা পাতায় আচরণ যোগ করে — বোতাম চাপলে কিছু ঘটা, ফর্ম যাচাই, নতুন তথ্য এনে দেখানো। ১৯৯৫ সালে Netscape-এ তৈরিযেখানে শিখবেন: পর্ব ০১পর্ব ১১পর্ব ৩৯
- JavaScript frameworkজাভাস্ক্রিপ্ট ফ্রেমওয়ার্ক
- React, Vue বা Svelte-এর মতো তৈরি কাঠামো, যা component, ডেটা বদলালে পর্দা নিজে হালনাগাদ করা আর রাউটিংয়ের মতো কাজ সহজ করে; বিনিময়ে বাড়তি JavaScript নামাতে হয়যেখানে শিখবেন: পর্ব ৫২
- JIT (just-in-time) engineজেআইটি ইঞ্জিন
- Tailwind-এর যে পদ্ধতি আগে থেকে বিশাল CSS না বানিয়ে, ফাইলে যে class পাওয়া যায় শুধু সেগুলোর CSS দরকারের মুহূর্তে তৈরি করে। v2.1-এ আসে, v3 থেকে ডিফল্ট।যেখানে শিখবেন: পর্ব ৫১
- jQueryজে-কোয়েরি
- ২০০৬ সালে আসা একটি JavaScript library, যা পুরোনো ব্রাউজারের পার্থক্য লুকিয়ে DOM বদলানো সহজ করত। আধুনিক ব্রাউজারের নিজস্ব JavaScript এখন সেসব কাজ করতে পারে, তাই Bootstrap 5 এটি বাদ দিয়েছে।যেখানে শিখবেন: পর্ব ৫১
K
- kebab-caseকাবাব-কেস
- নাম লেখার একটি ধরন — সব ছোট হাতের অক্ষর, শব্দের মাঝে হাইফেন, যেমন membership-form.html; শিকে গাঁথা কাবাবের মতো দেখায় বলে এই নাম।যেখানে শিখবেন: পর্ব ১৫পর্ব ১৭পর্ব ৩৩
- Key selectorকি সিলেক্টর
- একটি selector-এর সবচেয়ে ডানের অংশ — যে element আসলে স্টাইল পাবে। ব্রাউজার আগে এটি মেলায়, না মিললে বাকি অংশ আর দেখে না।যেখানে শিখবেন: পর্ব ১৭পর্ব ৫৭
- Keyword stuffingকিওয়ার্ড স্টাফিং
- সার্চে ওপরে ওঠার আশায় একই শব্দ অস্বাভাবিকভাবে বারবার ঠেসে দেওয়া — লেখায়, title-এ বা লুকানো জায়গায়। সার্চ ইঞ্জিন একে spam হিসেবে ধরে, ফল উল্টো হয়যেখানে শিখবেন: পর্ব ১৩
L
- Lab dataল্যাব ডেটা
- একটি নির্দিষ্ট যন্ত্রে, নির্দিষ্ট নেটওয়ার্ক-গতি নকল করে, একবার পাতা খুলে নেওয়া মাপ — যেমন Lighthouse. বারবার একই অবস্থায় চালানো যায়, তাই সমস্যা খুঁজতে কাজের; তবে আসল ব্যবহারকারীর অভিজ্ঞতার পুরো ছবি নয়যেখানে শিখবেন: পর্ব ৪৯পর্ব ৫৭পর্ব ৫৮
- Label (<label>)লেবেল
- একটি ফর্মের ঘরের দৃশ্যমান নাম। for আর id মিলিয়ে বা ঘরটিকে ভেতরে মুড়ে জোড়া দিলে লেখায় চাপলেই ঘরে যাওয়া যায়, আর screen reader নামটি পড়ে শোনায়।যেখানে শিখবেন: পর্ব ০৮পর্ব ২৬পর্ব ৪৩
- Landmarkল্যান্ডমার্ক
- পাতার বড় কোনো অংশ, যাকে screen reader আলাদা করে চেনে এবং যেখানে শর্টকাটে লাফ দেওয়া যায় — যেমন <nav> (নেভিগেশন), <main> (মূল অংশ).যেখানে শিখবেন: পর্ব ০৭পর্ব ১০পর্ব ১২
- lang attributeল্যাং অ্যাট্রিবিউট
- লেখার ভাষা জানানোর attribute — <html lang="bn"> পুরো পাতার জন্য, <span lang="en"> মাঝের অন্য ভাষার অংশের জন্য। screen reader এ দেখে সঠিক কণ্ঠ বাছেযেখানে শিখবেন: পর্ব ১২পর্ব ১৪পর্ব ৫৭
- Layer order statementলেয়ার অর্ডার স্টেটমেন্ট
- শুধু নামের তালিকা দিয়ে লেখা @layer নিয়ম, যেমন @layer reset, base, components; — এটি layer-গুলোর ক্রম আগেই ঠিক করে দেয়। বাঁ দিকের নাম সবচেয়ে দুর্বল।যেখানে শিখবেন: পর্ব ৩৫
- Layout (লেআউট / reflow)লেআউট
- rendering-এর যে ধাপে ব্রাউজার হিসাব করে প্রতিটি বাক্স পাতার কোথায় বসবে আর কত বড় হবে। প্রস্থ বা লেখা বদলালে আবার করতে হয়যেখানে শিখবেন: পর্ব ০১পর্ব ২৩পর্ব ৩৮
- Layout patternলেআউট প্যাটার্ন
- বারবার দেখা যায় এমন একটি পাতা-সাজানোর সমস্যার পরীক্ষিত সমাধান — যেমন sidebar, holy grail বা gallery. একবার শিখলে নানা সাইটে একই কৌশল কাজে লাগে।যেখানে শিখবেন: পর্ব ২৯
- Layout primitiveলেআউট প্রিমিটিভ
- একটিমাত্র লেআউট-কাজ করে এমন ছোট, পুনর্ব্যবহারযোগ্য CSS নিয়ম — যেমন Stack, Cluster আর Sidebar. কয়েকটি primitive জুড়ে জুড়ে বড় পাতা বানানো হয় — ইট দিয়ে দেয়াল গাঁথার মতো।যেখানে শিখবেন: পর্ব ২৯
- Layout shiftলেআউট শিফট
- পাতা লোড হওয়ার সময় হঠাৎ কোনো কিছু এসে বসায় আগে থেকে দেখা লেখা বা বোতামের জায়গা সরে যাওয়া — যেমন ছবি এলে নিচের লেখা নেমে যাওয়া।যেখানে শিখবেন: পর্ব ০৬পর্ব ১৫পর্ব ১৯
- Layout tableলেআউট টেবিল
- তথ্য দেখাতে নয়, পাতার অংশগুলো পাশাপাশি সাজাতে ব্যবহার করা টেবিল। ১৯৯০-এর দশকে প্রচলিত ছিল; আজ ওয়েবপেজে এটি ভুল অভ্যাস, এই কাজ CSS-এর।যেখানে শিখবেন: পর্ব ০৭পর্ব ২৫
- Layout thrashing (forced synchronous layout)লেআউট থ্র্যাশিং
- JavaScript-এ বারবার style বদলে সাথে সাথে offsetWidth-এর মতো মাপ পড়লে প্রতিবার ব্রাউজারকে তখনই নতুন layout হিসাব করতে হয়। লুপের ভেতরে এমন হলে পাতা খুব ধীর হয়; সমাধান: আগে সব পড়া, পরে সব লেখাযেখানে শিখবেন: পর্ব ৪৯পর্ব ৫৮
- Layout viewportলেআউট ভিউপোর্ট
- যে জানালার মাপ ধরে ব্রাউজার পাতার লেআউট হিসাব করে; position: fixed বাক্সগুলোও একে ধরে বসে। ফোনে চিমটি কেটে zoom করলেও এটি সাধারণত বদলায় নাযেখানে শিখবেন: পর্ব ২৩পর্ব ৩০
- Lazy loadingলেজি লোডিং
- ছবি বা iframe শুরুতেই না এনে, ব্যবহারকারী স্ক্রল করে কাছাকাছি এলে তবেই আনা। HTML-এ loading="lazy" দিয়ে হয়; ডেটা ও সময় বাঁচে।যেখানে শিখবেন: পর্ব ০৬পর্ব ৪৯পর্ব ৫৪
- LCP (Largest Contentful Paint)এল-সি-পি
- পাতা খোলার পর প্রথম পর্দার সবচেয়ে বড় ছবি বা লেখার অংশটি দেখা যেতে কত সময় লাগল। Core Web Vitals-এর একটি; ২.৫ সেকেন্ড বা কম হলে ভালো।যেখানে শিখবেন: পর্ব ০৬পর্ব ৩২পর্ব ৪৯
- Let's Encryptলেটস এনক্রিপ্ট
- একটি অলাভজনক certificate authority, যা বিনামূল্যে আর স্বয়ংক্রিয়ভাবে TLS certificate দেয়। GitHub Pages, Netlify আর অনেক cPanel হোস্ট ভেতরে এটিই ব্যবহার করেযেখানে শিখবেন: পর্ব ৫৩
- Lifecycle callbackলাইফসাইকেল কলব্যাক
- custom element-এর class-এ বিশেষ নামের method — connectedCallback, disconnectedCallback, attributeChangedCallback, adoptedCallback — যেগুলো element পাতায় বসা, সরা বা attribute বদলের মুহূর্তে ব্রাউজার নিজেই ডাকেযেখানে শিখবেন: পর্ব ৫২
- Ligature (লিগেচার)লিগেচার
- কয়েকটি অক্ষর মিলে ফন্টে একটি আলাদা আকার হয়ে যাওয়া — যেমন বাংলায় ক্ + ষ = ক্ষ। কিছু icon font এই কৌশলে home শব্দটিকে বাড়ির আইকনে বদলায়যেখানে শিখবেন: পর্ব ৪৪
- Light dismissলাইট ডিসমিস
- বাইরে কোথাও চাপলে বা Esc চাপলে ভাসমান অংশ নিজে থেকে বন্ধ হওয়া — popover="auto"-এর স্বাভাবিক আচরণযেখানে শিখবেন: পর্ব ১১পর্ব ৫৪পর্ব ৫৭
- Light DOMলাইট ডম
- পাতার সাধারণ, দৃশ্যমান DOM-গাছ — Shadow DOM-এর বিপরীতে। host element-এর ভেতরে লেখা সন্তানেরা light DOM-এ থাকে, slot-এ দেখা গেলেওযেখানে শিখবেন: পর্ব ৫২
- light-dark()লাইট-ডার্ক ফাংশন
- CSS রঙের ফাংশন: light-dark(লাইটের রং, ডার্কের রং). element-এর used color scheme দেখে একটি বেছে নেয়, তাই color-scheme দেওয়া না থাকলে সবসময় প্রথম রং দেয়। ২০২৪ থেকে Baselineযেখানে শিখবেন: পর্ব ৩৬পর্ব ৪৩পর্ব ৫৪
- Lighthouseলাইটহাউস
- Chrome DevTools-এর ভেতরের একটি পরীক্ষার টুল, যা পারফরম্যান্স, SEO আর অ্যাক্সেসিবিলিটির স্কোর ও ভুলের তালিকা দেয়। স্বয়ংক্রিয় পরীক্ষা সব সমস্যা ধরে নাযেখানে শিখবেন: পর্ব ১২পর্ব ১৫পর্ব ২০
- Lightning CSSলাইটনিং সিএসএস
- Rust ভাষায় লেখা দ্রুতগতির CSS টুল, যা একাই parse, prefix যোগ, নতুন syntax-কে পুরোনো রূপে নামানো আর minify করতে পারে — অনেক ক্ষেত্রে PostCSS-এর কয়েকটি plugin-এর বিকল্পযেখানে শিখবেন: পর্ব ৫০
- Line boxলাইন বক্স
- লেখার প্রতিটি লাইনের জন্য ব্রাউজারের বানানো অদৃশ্য আয়তক্ষেত্র, যার উচ্চতা মূলত line-height থেকে আসে। inline বাক্সের ওপর-নিচের padding, border বা margin এর উচ্চতা বদলায় না।যেখানে শিখবেন: পর্ব ১৯পর্ব ২৩
- Line ending (LF / CRLF)লাইন এন্ডিং
- লাইন শেষ হওয়ার অদৃশ্য চিহ্ন। Linux ও Mac ব্যবহার করে LF, Windows ঐতিহ্যগতভাবে CRLF; Git চাইলে commit-এর সময় এগুলো এক রকম করে দেয়যেখানে শিখবেন: পর্ব ৫৩
- line-clampলাইন ক্ল্যাম্প
- লেখাকে নির্দিষ্ট কয়েক লাইনে থামিয়ে শেষে “…” দেখানোর কৌশল; আজ সব ব্রাউজারে চলে -webkit-line-clamp রূপে, display: -webkit-box আর overflow: hidden সহযেখানে শিখবেন: পর্ব ২৩পর্ব ৪৮পর্ব ৫৭
- line-heightলাইন-হাইট
- লেখার প্রতিটি লাইনের উচ্চতা, অর্থাৎ এক লাইন থেকে পরের লাইনের দূরত্ব ঠিক করার CSS property; বাংলায় ওপরে-নিচে চিহ্ন বেশি, তাই সাধারণত 1.6–1.8 আরামদায়ক।যেখানে শিখবেন: পর্ব ১৪পর্ব ২০পর্ব ২১
- linear() easing functionলিনিয়ার ফাংশন
- বিন্দুর একটি তালিকা দিয়ে যেকোনো আকারের easing বানানোর CSS ফাংশন — ব্রাউজার বিন্দুগুলো সোজা দাগে জোড়ে, তাই স্প্রিং বা বাউন্সের মতো বহুবার দোলা গতিও আঁকা যায়। linear keyword থেকে আলাদা। ২০২৩-এর শেষে Baseline Newly availableযেখানে শিখবেন: পর্ব ৩৮
- Link preview (শেয়ার-কার্ড)লিংক প্রিভিউ
- চ্যাট বা সোশ্যাল মিডিয়ায় লিংক দিলে নিচে যে কার্ড আসে — ছবি, শিরোনাম, বর্ণনা। অ্যাপ নিজে পাতাটি পড়ে head-এর Open Graph ট্যাগ থেকে বানায় এবং ক্যাশে রাখেযেখানে শিখবেন: পর্ব ১৩
- Linterলিন্টার
- যে টুল কোড না চালিয়েই পড়ে দেখে, নির্দিষ্ট নিয়ম ভাঙা হয়েছে কি না বা সম্ভাব্য ভুল আছে কি না, আর সতর্ক করে।যেখানে শিখবেন: পর্ব ৪৬
- List item (li)লিস্ট আইটেম
- তালিকার একটি আইটেম, <li> দিয়ে লেখা। <ul> আর <ol>-এর সরাসরি সন্তান শুধু li হতে পারে; li-এর ভেতরে অবশ্য প্রায় সবকিছু রাখা যায়।যেখানে শিখবেন: পর্ব ০৭
- Live codingলাইভ কোডিং
- ইন্টারভিউয়ারের সামনে, শেয়ার করা editor বা পর্দায়, সরাসরি কোড লেখার ধাপ। ফ্রন্ট-এন্ডে প্রায়ই একটি ছোট UI বানাতে দেওয়া হয়; জোরে ভেবে কাজ করা এখানে খুব জরুরি।যেখানে শিখবেন: পর্ব ৫৮পর্ব ৫৯
- Live region (লাইভ রিজিয়ন)লাইভ রিজিয়ন
- পাতার এমন অংশ, যার লেখা বদলালে screen reader focus না সরিয়েই তা পড়ে শোনায় — aria-live="polite", role="status" বা জরুরি হলে role="alert" দিয়ে চিহ্নিতযেখানে শিখবেন: পর্ব ১২পর্ব ৫২পর্ব ৫৮
- Live reloadলাইভ রিলোড
- ফাইল সেভ করামাত্র ব্রাউজারের পেজ নিজে থেকেই নতুন করে লোড হওয়ার সুবিধা; Live Server-এর মতো extension এটি করেযেখানে শিখবেন: পর্ব ০২পর্ব ৫০
- Living Standardলিভিং স্ট্যান্ডার্ড
- সংস্করণ নম্বর ছাড়া, নিয়মিত হালনাগাদ হওয়া মানদণ্ড। ২০১৯ সাল থেকে WHATWG-এর HTML Living Standard-ই HTML-এর একমাত্র আনুষ্ঠানিক নিয়মযেখানে শিখবেন: পর্ব ০১পর্ব ০৩পর্ব ৫৬
- Local Overridesলোকাল ওভাররাইডস
- Chrome DevTools-এর একটি সুবিধা, যাতে একটি সাইটের ফাইল (যেমন CSS) নিজের কম্পিউটারে কপি করে বদলানো যায় আর রিলোডের পরও ব্রাউজার সেই বদলানো কপিই ব্যবহার করে — লাইভ সাইটে হাত না দিয়ে সমাধান পরীক্ষার জন্যযেখানে শিখবেন: পর্ব ৪৭
- Local serverলোকাল সার্ভার
- নিজের কম্পিউটারেই চলা একটি ছোট web server, যা আপনার প্রজেক্ট ফোল্ডারের ফাইলগুলো http:// ঠিকানায় ব্রাউজারকে দেয় — ঠিক আসল ওয়েবসাইটের মতোযেখানে শিখবেন: পর্ব ০২পর্ব ১৫
- localhost / 127.0.0.1লোকালহোস্ট
- “এই কম্পিউটারটিই” বোঝানোর বিশেষ ঠিকানা। http://127.0.0.1:5500 মানে নিজের কম্পিউটারের 5500 নম্বর port-এ চলা সার্ভারযেখানে শিখবেন: পর্ব ০২
- localStorageলোকাল স্টোরেজ
- ব্রাউজারের ছোট স্থায়ী key-value ভান্ডার, প্রতিটি origin-এর আলাদা। ব্রাউজার বন্ধ করলেও থাকে; প্রাইভেট মোড বা কড়া সেটিংয়ে ব্যবহার করা না-ও যেতে পারে, তাই try/catch দিয়ে ঘিরে রাখা নিরাপদযেখানে শিখবেন: পর্ব ৩৬পর্ব ৫৭
- Logical propertyলজিক্যাল প্রপার্টি
- বাঁ-ডান-ওপর-নিচের বদলে লেখার দিক অনুযায়ী নাম দেওয়া property, যেমন border-inline-start; ডান-থেকে-বাঁ লেখায় নিজে থেকে দিক বদলায়যেখানে শিখবেন: পর্ব ২২পর্ব ২৩পর্ব ২৫
- Long taskলং টাস্ক
- main thread-এ ৫০ মিলিসেকেন্ডের বেশি সময় ধরে একটানা চলা কাজ। এর মধ্যে ব্রাউজার ক্লিক বা ট্যাপের সাড়া দিতে পারে না, তাই INP খারাপ হয়যেখানে শিখবেন: পর্ব ৪৯
- Lossless compressionলসলেস কম্প্রেশন
- কোনো তথ্য না ফেলে, শুধু গুছিয়ে রেখে ফাইল ছোট করা। খুললে হুবহু আসল ছবি ফেরত আসে — যেমন PNG.যেখানে শিখবেন: পর্ব ০৬
- Lossy compressionলসি কম্প্রেশন
- চোখে কম পড়ে এমন খুঁটিনাটি ফেলে দিয়ে ফাইল ছোট করা। ফাইল অনেক ছোট হয়, কিন্তু ফেলে দেওয়া তথ্য আর ফেরানো যায় না — যেমন JPEG.যেখানে শিখবেন: পর্ব ০৬
M
- m-dot site (আলাদা মোবাইল সাইট)এম-ডট সাইট
- মোবাইলের জন্য আলাদা করে বানানো দ্বিতীয় একটি সাইট, সাধারণত m. দিয়ে শুরু ঠিকানায়। সার্ভার ব্রাউজারের পরিচয় দেখে ফোনকে সেখানে পাঠায়; দুটি সাইট রক্ষণাবেক্ষণের ঝামেলা থাকে।যেখানে শিখবেন: পর্ব ৩০
- Machine coding roundমেশিন কোডিং রাউন্ড
- ইন্টারভিউর একটি ধাপ, যেখানে ৬০–৯০ মিনিটে চালানো যায় এমন একটি ছোট কম্পোনেন্ট বা অ্যাপ বানাতে হয় — যেমন accordion, modal বা tabs.যেখানে শিখবেন: পর্ব ৫৯
- Machine-readableমেশিন-রিডেবল
- এমন নির্দিষ্ট মানক রূপে লেখা তথ্য, যা প্রোগ্রাম নির্ভুলভাবে বুঝতে পারে — যেমন time-এর datetime-এ 2026-10-19, পাশে মানুষের জন্য “১৯ অক্টোবর”যেখানে শিখবেন: পর্ব ০৪
- mailto: linkমেইলটু লিংক
- ক্লিক করলে ইমেইল অ্যাপ খুলে প্রাপকের ঠিকানা বসিয়ে দেয় এমন লিংক; ?subject= আর &body= দিয়ে বিষয় ও লেখাও আগে থেকে দেওয়া যায়।যেখানে শিখবেন: পর্ব ০৫
- Main axisমেইন অ্যাক্সিস
- Flexbox-এ যে দিকে item-রা একের পর এক বসে — flex-direction ঠিক করে। row-তে লেখার দিক (বাংলায় বাঁ থেকে ডান), column-এ ওপর থেকে নিচ। justify-content এই অক্ষে কাজ করে।যেখানে শিখবেন: পর্ব ২৫পর্ব ২৬পর্ব ৫৬
- Main threadমেইন থ্রেড
- ব্রাউজারের যে প্রধান কাজের ধারায় JavaScript, style হিসাব, layout আর paint চলে। এটি ব্যস্ত থাকলে পাতা সাড়া দিতে দেরি করেযেখানে শিখবেন: পর্ব ৩৯পর্ব ৪২
- Map (Sass)ম্যাপ
- Sass-এর নাম-মান জোড়ার তালিকা, যেমন (ok: green, err: red). @each দিয়ে ঘুরে ঘুরে অনেকগুলো class তৈরি করতে খুব কাজে লাগেযেখানে শিখবেন: পর্ব ৫০
- marginমার্জিন
- border-এর বাইরের স্বচ্ছ ফাঁকা জায়গা, যা পাশের element-কে দূরে রাখে। ঋণাত্মক বা auto হতে পারে, আর ওপর-নিচে পাশের margin-এর সাথে মিশে যেতে পারে।যেখানে শিখবেন: পর্ব ১৯
- Margin collapsingমার্জিন কলাপসিং
- block লেআউটে গায়ে লাগা দুটি ওপর-নিচের margin মিশে একটি হয়ে যাওয়া — ফাঁক হয় দুটির মধ্যে বড়টি, যোগফল নয়। ওপর-নিচে পরপর দুই element, parent আর তার প্রথম বা শেষ child, এবং খালি বাক্সে এটি ঘটে; flex ও grid item-এ ঘটে না।যেখানে শিখবেন: পর্ব ১৯পর্ব ২৩পর্ব ২৫
- Markdown (মার্কডাউন)মার্কডাউন
- সাধারণ লেখার একটি সহজ নিয়ম: # দিলে শিরোনাম, * দিলে তালিকা, [লেখা](ঠিকানা) দিলে লিংক। .md ফাইল GitHub নিজেই HTML-এ রূপ দিয়ে দেখায়যেখানে শিখবেন: পর্ব ৫৩
- Markup (মার্কআপ)মার্কআপ
- লেখার গায়ে চিহ্ন বা ট্যাগ বসিয়ে তার অর্থ ও কাঠামো বুঝিয়ে দেওয়া। HTML একটি markup ভাষা — প্রোগ্রামিং ভাষা নয়যেখানে শিখবেন: পর্ব ০১পর্ব ০৩
- mask (CSS)মাস্ক
- একটি ছবি বা gradient-এর স্বচ্ছতা দিয়ে element-এর কোন অংশ কতটা দেখা যাবে তা ঠিক করার property; অস্বচ্ছ অংশে element দেখা যায়, স্বচ্ছ অংশে লুকায়, মাঝামাঝি অংশে আধা-দেখা — তাই নরম কিনারা সম্ভবযেখানে শিখবেন: পর্ব ৪১
- Masonry layout (grid-lanes)ম্যাসনরি লেআউট
- ইটের গাঁথুনির মতো নকশা: কলাম সমান, কিন্তু প্রতিটি item নিজের উচ্চতায়, আর ছোট item-এর নিচে ফাঁক না রেখে পরেরটি উঠে আসে। CSS-এ আনার প্রস্তাব (সাম্প্রতিক নাম display: grid-lanes) এখনো আলোচনা আর পরীক্ষার পর্যায়ে, Baseline নয়।যেখানে শিখবেন: পর্ব ২৮
- matchMedia()ম্যাচমিডিয়া
- JavaScript-এর একটি ফাংশন, যা CSS-এর মতোই একটি media query যাচাই করে। এর matches মান true/false বলে দেয়, আর change ইভেন্ট শর্ত বদলালে জানায়যেখানে শিখবেন: পর্ব ৩১পর্ব ৩৬পর্ব ৩৯
- max()ম্যাক্স ফাংশন
- কমা দিয়ে দেওয়া মানগুলোর মধ্যে সবচেয়ে বড়টি নেওয়ার CSS function. max(1rem, 4vw) মানে পর্দার ৪%, কিন্তু কখনো 1rem-এর কম নয়।যেখানে শিখবেন: পর্ব ৩৫
- max-contentম্যাক্স-কনটেন্ট
- কনটেন্টের স্বাভাবিক সবচেয়ে চওড়া মাপ — লেখা একটুও না ভেঙে এক লাইনে রাখলে যতটা চওড়া লাগে।যেখানে শিখবেন: পর্ব ২৮
- MCQ (Multiple Choice Question)এম-সি-কিউ
- বহুনির্বাচনী প্রশ্ন — কয়েকটি অপশন দেওয়া থাকে, সাধারণত চারটি, আর তার মধ্যে থেকে সঠিকটি বেছে নিতে হয়। বিশ্ববিদ্যালয় আর বেশিরভাগ চাকরির প্রাথমিক পরীক্ষায় এই ধরন চলে।যেখানে শিখবেন: পর্ব ৫৬
- MDN Web Docsএমডিএন
- Mozilla-র পরিচালিত, বহু প্রতিষ্ঠানের সহযোগিতায় চলা ওয়েব প্রযুক্তির সবচেয়ে বিস্তারিত উন্মুক্ত রেফারেন্স। প্রতিটি HTML element, CSS property আর JavaScript API-র ব্যাখ্যা, উদাহরণ, Baseline অবস্থা আর ব্রাউজার-সাপোর্টের টেবিল থাকেযেখানে শিখবেন: পর্ব ৪৮পর্ব ৫৭
- Measure (লাইনের দৈর্ঘ্য)মেজার
- এক লাইনে কতটি অক্ষর ধরে — ছাপাখানার শব্দ। ইংরেজির মতো লেখায় ৪৫–৭৫টি অক্ষর আরামদায়ক ধরা হয়যেখানে শিখবেন: পর্ব ২১পর্ব ২৯পর্ব ৩০
- Media featureমিডিয়া ফিচার
- ডিভাইস বা ব্যবহারকারীর একটি নির্দিষ্ট বৈশিষ্ট্য, যা বন্ধনীর ভেতরে লিখে যাচাই করা হয়, যেমন (width >= 600px), (orientation: portrait), (prefers-color-scheme: dark)যেখানে শিখবেন: পর্ব ৩১
- Media objectমিডিয়া অবজেক্ট
- বাঁ (বা ডান) দিকে একটি ছোট ছবি বা আইকন আর পাশে বাকি জায়গা জুড়ে লেখা — মন্তব্য, রিভিউ, চ্যাটের বার্তায় দেখা যাওয়া প্রচলিত নকশা। Flexbox-এ ছবিতে flex: none, লেখায় flex: 1 আর min-width: 0.যেখানে শিখবেন: পর্ব ২৬পর্ব ৪৬
- Media query (@media)মিডিয়া কোয়েরি
- CSS-এর শর্ত, যা পর্দা বা ডিভাইসের বৈশিষ্ট্য (যেমন viewport-এর চওড়া, dark mode পছন্দ) দেখে কিছু নিয়ম চালু বা বন্ধ করে। রেসপন্সিভ ডিজাইনের মূল হাতিয়ার।যেখানে শিখবেন: পর্ব ২৮পর্ব ২৯পর্ব ৩০
- Media query operatorsমিডিয়া কোয়েরির অপারেটর
- কয়েকটি শর্ত জোড়ার শব্দ: and (সবগুলো মিলতে হবে), কমা বা or (যেকোনো একটি মিললেই হবে), not (উল্টো ফল), only (শুধু খুব পুরোনো ব্রাউজার থেকে নিয়ম লুকাত; আজ এর কোনো প্রভাব নেই)যেখানে শিখবেন: পর্ব ৩১
- Media typeমিডিয়া টাইপ
- পাতাটি কোন মাধ্যমে দেখানো হচ্ছে তার মোটা দাগের ভাগ: screen (পর্দা), print (ছাপা বা PDF) আর all (সব). আগে tv, handheld-এর মতো আরও ধরন ছিল, সেগুলো এখন বাতিলযেখানে শিখবেন: পর্ব ৩১
- Merge (মার্জ)মার্জ
- একটি branch-এর কাজ আরেকটি branch-এ মিলিয়ে নেওয়াযেখানে শিখবেন: পর্ব ৫৩
- Merge conflict (মার্জ কনফ্লিক্ট)মার্জ কনফ্লিক্ট
- দুই branch একই ফাইলের একই জায়গা দুইভাবে বদলালে Git নিজে বেছে নিতে পারে না — তখন ফাইলে দাগ দিয়ে দুটো রূপই দেখায়, আর মানুষকে ঠিক করতে হয়যেখানে শিখবেন: পর্ব ৫৩
- Meta descriptionমেটা ডেসক্রিপশন
- <meta name="description">-এ লেখা পাতার এক-দুই বাক্যের সারাংশ। সার্চ ফলাফলে শিরোনামের নিচে প্রায়ই দেখায়, যদিও সার্চ ইঞ্জিন দরকার মনে করলে পাতার লেখা থেকে অন্য অংশ বেছে নেয়যেখানে শিখবেন: পর্ব ১৩পর্ব ১৫পর্ব ৫৭
- Meta tag (<meta>)মেটা ট্যাগ
- head-এর ভেতরের একটি void element, যা পাতা সম্পর্কে তথ্য দেয় — যেমন অক্ষরের encoding, viewport, বর্ণনা। পাতায় কিছু দেখায় নাযেখানে শিখবেন: পর্ব ০৩পর্ব ১৩
- meterমিটার
- জানা সীমার মধ্যে একটি মাপ দেখানোর দণ্ড, যেমন ব্যাটারির চার্জ বা স্টোরেজ। low, high আর optimum দিয়ে বলা যায় কোন অংশ ভালো, কোনটা খারাপ।যেখানে শিখবেন: পর্ব ০৯
- method attributeমেথড অ্যাট্রিবিউট
- <form>-এর যে attribute বলে তথ্য কীভাবে যাবে: get (ডিফল্ট, URL-এ) বা post (request-এর body-তে). dialog মানটি <dialog>-এর জন্য।যেখানে শিখবেন: পর্ব ০৮পর্ব ৫৭
- MIME typeমাইম টাইপ
- ফাইলের ধরনের মানসম্মত নাম, যেমন image/avif, image/webp, image/jpeg, text/html. <source type>-এ লিখলে ব্রাউজার ফাইল না নামিয়েই বোঝে ফরম্যাটটি সে চেনে কি না।যেখানে শিখবেন: পর্ব ৩২পর্ব ৪৪
- min()মিন ফাংশন
- কমা দিয়ে দেওয়া মানগুলোর মধ্যে যেটি সবচেয়ে ছোট, CSS সেটিই নেয়। min(65ch, 100%) মানে “৬৫ অক্ষর চওড়া, কিন্তু parent-এর চেয়ে বেশি নয়”।যেখানে শিখবেন: পর্ব ২৯পর্ব ৩৫
- min() (CSS function)মিন ফাংশন
- CSS-এর গাণিতিক ফাংশন, যা দেওয়া মানগুলোর মধ্যে সবচেয়ে ছোটটি নেয় — যেমন min(250px, 100%) মানে 250px, কিন্তু জায়গা কম হলে পুরো 100%. এর সঙ্গী max() আর clamp().যেখানে শিখবেন: পর্ব ২৮
- min-contentমিন-কনটেন্ট
- একটি বাক্সকে লেখা না কেটে বা উপচে না দিয়ে যতটা সরু করা যায় তার মাপ — সাধারণত সবচেয়ে লম্বা শব্দের চওড়া, আর nowrap লেখায় পুরো লাইনের চওড়া।যেখানে শিখবেন: পর্ব ২৫পর্ব ২৬পর্ব ২৭
- min-width / max-widthমিন-উইডথ, ম্যাক্স-উইডথ
- বাক্সের সর্বনিম্ন আর সর্বোচ্চ চওড়ার সীমা; উচ্চতার জন্য একই কাজ করে min-height আর max-height. দ্বন্দ্ব হলে min জেতে max-এর ওপর, আর দুটোই জেতে width-এর ওপর।যেখানে শিখবেন: পর্ব ১৯পর্ব ৩০
- min-width: auto (flex/grid item)মিন-উইডথ অটো
- flex আর grid item-এর ডিফল্ট সর্বনিম্ন চওড়া হলো ভেতরের জিনিসের সবচেয়ে কম চওড়া। তাই চওড়া টেবিল বা লম্বা লাইন থাকলে item সরু হতে চায় না, লেআউট বাইরে বেরিয়ে যায় — সমাধান min-inline-size: 0 বা minmax(0, 1fr).যেখানে শিখবেন: পর্ব ২৯
- Minificationমিনিফিকেশন
- কোডের অর্থ না বদলে বাড়তি space, লাইন-ভাঙা আর comment মুছে ফাইল ছোট করা — যেমন style.css থেকে style.min.css. সাধারণত build টুল এটি করেযেখানে শিখবেন: পর্ব ৪৯পর্ব ৫০
- Minimal reproduction (reduced test case)মিনিমাল রিপ্রোডাকশন
- যতটা সম্ভব ছোট একটি কোড, যেখানে বাগটি তখনো ঘটে। অপ্রয়োজনীয় সব অংশ বাদ দিয়ে বানানো হয়; কারণ খুঁজতে আর অন্যের সাহায্য চাইতে সবচেয়ে কাজেরযেখানে শিখবেন: পর্ব ৪৭পর্ব ৫৭পর্ব ৫৮
- minmax()মিনম্যাক্স
- grid track-এর মাপের ফাংশন, যা দুটি সীমা দেয়: প্রথম মানের চেয়ে সরু হবে না, দ্বিতীয় মানের চেয়ে চওড়া হবে না। যেমন minmax(200px, 1fr) মানে অন্তত 200px, জায়গা থাকলে বাকি অংশের এক ভাগ।যেখানে শিখবেন: পর্ব ২৮পর্ব ৫৭
- minmax()মিনম্যাক্স
- Grid track-এর জন্য CSS function: track অন্তত প্রথম মানের সমান আর বড়জোর দ্বিতীয় মানের সমান হবে, যেমন minmax(8rem, 1fr).যেখানে শিখবেন: পর্ব ২৯পর্ব ৩০পর্ব ৫৪
- Mixed contentমিক্সড কনটেন্ট
- HTTPS পাতার ভেতরে http:// দিয়ে আনা ছবি, স্ক্রিপ্ট বা স্টাইল। ব্রাউজার এগুলো আটকে দেয় বা সতর্ক করেযেখানে শিখবেন: পর্ব ৫৩
- Mixinমিক্সিন
- Sass-এ @mixin দিয়ে বানানো নামকরা declaration-এর গুচ্ছ, যা @include দিয়ে যেকোনো নিয়মে বসানো যায়; argument নিয়ে প্রতিবার একটু আলাদা ফল দিতে পারেযেখানে শিখবেন: পর্ব ৫০
- Mobile-firstমোবাইল-ফার্স্ট
- নকশা আর CSS ছোট পর্দা থেকে শুরু করার পদ্ধতি: query-র বাইরের নিয়ম ছোট পর্দার জন্য, তারপর min-width media query দিয়ে চওড়া পর্দায় শুধু যোগ। ধারণাটি জনপ্রিয় করেন Luke Wroblewski.যেখানে শিখবেন: পর্ব ৩০পর্ব ৩১পর্ব ৪৩
- Modal dialog (মোডাল ডায়ালগ)মোডাল ডায়ালগ
- যে বাক্স খোলা থাকলে পেছনের পাতা অচল থাকে — পাঠককে আগে বাক্সের কাজ শেষ করতে বা বন্ধ করতে হয়। HTML-এ <dialog>-কে showModal() দিয়ে খুললে হয়যেখানে শিখবেন: পর্ব ১১পর্ব ৫৭পর্ব ৫৯
- Mojibakeমোজিবাকে
- ভুল encoding-এ পড়ার কারণে লেখা অর্থহীন চিহ্নে বদলে যাওয়া, যেমন বাংলা লেখার জায়গায় বা-এর মতো চিহ্ন দেখা। শব্দটি জাপানি, মানে মোটামুটি “অক্ষরের রূপ বদল”যেখানে শিখবেন: পর্ব ১৪পর্ব ৫৭পর্ব ৫৮
- Multi-cursorমাল্টি-কার্সর
- একসাথে একাধিক জায়গায় কার্সর বসিয়ে একবারে সব জায়গায় লেখার সুবিধা; VS Code-এ Alt চেপে ক্লিক করে বা Ctrl+D দিয়েযেখানে শিখবেন: পর্ব ০২
- Multi-keyword displayমাল্টি-কিওয়ার্ড ডিসপ্লে
- display-এর দুই-শব্দের লেখার নিয়ম: প্রথম শব্দ বাইরের আচরণ (block বা inline), দ্বিতীয়টি ভেতরের সাজ (flow, flow-root, flex, grid) — যেমন block flex বা inline gridযেখানে শিখবেন: পর্ব ২৩পর্ব ৫৭
- Multi-page site (MPA)মাল্টি-পেজ সাইট
- যে সাইটে প্রতিটি পাতা আলাদা HTML ডকুমেন্ট; লিংকে ক্লিক করলে ব্রাউজার সার্ভার থেকে নতুন একটি পাতা আনে।যেখানে শিখবেন: পর্ব ১৫
N
- Name=value pairনেম-ভ্যালু পেয়ার
- ফর্ম জমার সময় প্রতিটি ঘর থেকে তৈরি একটি জোড়া: ঘরের name attribute হয় নাম, ভেতরের লেখা হয় মান — যেমন mobile=01712345678.যেখানে শিখবেন: পর্ব ০৮
- Named colorনেমড কালার
- CSS-এর তৈরি করা নামের রং, যেমন red, tomato, seagreen, rebeccapurple — প্রায় ১৫০টি। দ্রুত পরীক্ষার জন্য সুবিধাজনকযেখানে শিখবেন: পর্ব ২০
- Named grid lineনেমড গ্রিড লাইন
- grid-এর লাইনকে বর্গবন্ধনীতে দেওয়া নাম, যেমন [content-start]. নম্বরের বদলে নাম ধরে item বসানো যায়; নাম -start আর -end দিয়ে শেষ হলে ব্রাউজার আপনা-আপনি সেই নামের এলাকাও ধরে নেয়।যেখানে শিখবেন: পর্ব ২৮পর্ব ২৯
- Named timelineনেমড টাইমলাইন
- দুই হাইফেন দিয়ে শুরু নামওয়ালা একটি scroll বা view timeline, যেমন --article; এতে scroller-এর বাইরের element-ও animation-timeline: --article লিখে সেই স্ক্রল ধরে চলতে পারেযেখানে শিখবেন: পর্ব ৪২
- Native widget (নেটিভ কন্ট্রোল)নেটিভ উইজেট
- ব্রাউজার যে ফর্ম কন্ট্রোল নিজে, প্রায়ই অপারেটিং সিস্টেমের চেনা চেহারায় আঁকে — যেমন checkbox, select, range বা file-এর বোতাম। এদের ভেতরের অনেক অংশ (তীরচিহ্ন, খোলা তালিকা, হাতল) DOM-এ থাকে না, তাই সাধারণ CSS selector সেখানে পৌঁছায় নাযেখানে শিখবেন: পর্ব ৪৩পর্ব ৪৮
- Negative delay (staggered animation)নেগেটিভ ডিলে
- ঋণাত্মক animation-delay, যেমন -0.4s — animation অপেক্ষা না করে এমনভাবে শুরু হয় যেন আগেই চলছিল। কয়েকটি element-কে আগে-পিছে সাজানো ঢেউয়ের মতো (staggered) loader-এ কাজে লাগেযেখানে শিখবেন: পর্ব ৩৯
- Negative marginনেগেটিভ মার্জিন
- ঋণাত্মক মানের margin, যা বাক্সকে সেই দিকে টেনে আনে বা প্রতিবেশীকে নিজের দিকে টানে — যেমন parent-এর padding পেরিয়ে কিনারা পর্যন্ত ছড়ানো। padding ঋণাত্মক হতে পারে না।যেখানে শিখবেন: পর্ব ১৯
- Negative markingনেগেটিভ মার্কিং
- যে পরীক্ষায় ভুল উত্তরের জন্য প্রাপ্ত নম্বর থেকে নির্দিষ্ট পরিমাণ কেটে নেওয়া হয়; তখন না জেনে আন্দাজ করা লাভ না ক্ষতি, তা হিসাব করে ঠিক করতে হয়।যেখানে শিখবেন: পর্ব ৫৬
- Nested listনেস্টেড লিস্ট
- তালিকার ভেতরে তালিকা। ভেতরের তালিকাটি লিখতে হয় মূল আইটেমের <li>-এর ভেতরে, তার বন্ধ হওয়ার আগে — যেমন মেনুর “কোর্স”-এর নিচে উপ-মেনু।যেখানে শিখবেন: পর্ব ০৭
- Nestingনেস্টিং
- এক element-এর ভেতরে আরেকটি রাখা। নিয়ম: যেটি পরে খোলা হয়েছে, সেটি আগে বন্ধ করতে হয়যেখানে শিখবেন: পর্ব ০৩
- Nesting selector (&)নেস্টিং সিলেক্টর
- Nested নিয়মের ভেতরে বাইরের নিয়মের selector-কে বোঝানোর চিহ্ন &. &:hover মানে বাইরের element নিজেই hover অবস্থায়; specificity-র হিসাবে সে :is()-এর মতো আচরণ করে।যেখানে শিখবেন: পর্ব ৩৫পর্ব ৫০
- Network panelনেটওয়ার্ক প্যানেল
- DevTools-এর যে প্যানেল দেখায় পেজ খুলতে কোন কোন ফাইল আনা হলো, প্রতিটির আকার কত, কত সময় লাগল আর কোনটি পাওয়া যায়নি (যেমন 404)যেখানে শিখবেন: পর্ব ০২পর্ব ৩০পর্ব ৩২
- Network throttlingনেটওয়ার্ক থ্রটলিং
- DevTools-এ ইচ্ছে করে ইন্টারনেটের গতি কমিয়ে (যেমন Slow 4G বা 3G preset) দেখা, দুর্বল সংযোগে পাতা কেমন লোড হয়।যেখানে শিখবেন: পর্ব ৩০পর্ব ৪৯
- Next-sibling combinator (+)নেক্সট সিবলিং কম্বিনেটর
- + চিহ্ন, যেমন h2 + p — একই parent-এর নিচে বাঁয়েরটির ঠিক পরের element, যদি সে ডানের শর্ত মানে। আগে একে adjacent sibling combinator বলা হতো।যেখানে শিখবেন: পর্ব ১৭পর্ব ৫৭
- Nodeনোড
- DOM tree-এর প্রতিটি অংশ — element node, লেখার text node, comment node ইত্যাদিযেখানে শিখবেন: পর্ব ০৩পর্ব ৫২
- nofollow / ugc / sponsoredনোফলো
- সার্চ ইঞ্জিনের জন্য rel-এর মান: nofollow মানে লিংকটির পক্ষে সুপারিশ নেই, ugc মানে ব্যবহারকারীর লেখা, sponsored মানে টাকা বা সুবিধার বিনিময়ে লিংক।যেখানে শিখবেন: পর্ব ০৫
- Non-breaking space ( )নন-ব্রেকিং স্পেস
- এমন space, যার জায়গায় লাইন ভাঙে না এবং whitespace collapsing-এ হারায় না; “১০ কেজি”-র মতো দুই অংশ এক লাইনে রাখতে কাজে লাগে, দূরত্ব বানাতে নয়যেখানে শিখবেন: পর্ব ০৪
- Non-modal dialogনন-মোডাল ডায়ালগ
- যে বাক্স খোলা থাকলেও পেছনের পাতায় কাজ করা যায়, যেমন একটি চ্যাট-সহায়তার জানালা। <dialog>-কে show() দিয়ে খুললে হয়যেখানে শিখবেন: পর্ব ১১
- Non-text contrast (WCAG 1.4.11)নন-টেক্সট কনট্রাস্ট
- লেখা নয় এমন জরুরি দৃশ্যমান অংশ — ঘরের বর্ডার, checkbox-এর বাক্স, focus-এর দাগ, আইকন — পাশের রঙের সাথে অন্তত ৩:১ contrast ratio রাখার WCAG নিয়ম (স্তর AA)যেখানে শিখবেন: পর্ব ৪৩
- Normal flowনরমাল ফ্লো
- কোনো লেআউট CSS না লিখলে ব্রাউজার যে ডিফল্ট নিয়মে বাক্স সাজায়: block বাক্স একটার নিচে একটা, আর inline বাক্স লেখার লাইনের ভেতরে পাশাপাশি, লাইন ভরলে পরের লাইনেযেখানে শিখবেন: পর্ব ২৩পর্ব ২৪পর্ব ৩০
- normalize.cssনরমালাইজ ডট সিএসএস
- Nicolas Gallagher ও Jonathan Neal-এর তৈরি একটি জনপ্রিয় CSS ফাইল, যা ব্রাউজারের কাজের ডিফল্ট রেখে শুধু ব্রাউজারগুলোর মধ্যের অমিল আর বাগ দূর করে।যেখানে শিখবেন: পর্ব ১৬
- novalidate ও formnovalidateনোভ্যালিডেট
- ব্রাউজারের যাচাই বন্ধ করার boolean attribute: <form>-এ novalidate দিলে পুরো ফর্মে, আর submit বোতামে formnovalidate দিলে শুধু ওই বোতাম চাপলে।যেখানে শিখবেন: পর্ব ০৯
- npmএনপিএম
- Node.js-এর সাথে আসা package manager; JavaScript-ভিত্তিক টুল (sass, postcss) প্রজেক্টে ইনস্টল করে আর package.json-এর script চালায়যেখানে শিখবেন: পর্ব ৫০
O
- object-fitঅবজেক্ট-ফিট
- <img> বা <video> তার বাক্সে কীভাবে বসবে: cover (অনুপাত ঠিক রেখে বাক্স ভরায়, কিনারা কাটা যেতে পারে), contain (পুরো ছবি দেখায়), fill (ডিফল্ট, টেনে বাক্সের মাপে).যেখানে শিখবেন: পর্ব ২৬পর্ব ৩২
- object-positionঅবজেক্ট-পজিশন
- object-fit দিয়ে ঘরে বসানো ছবির কোন অংশ কোথায় থাকবে, তা ঠিক করার CSS property — যেমন left center বা 30% 20%. ডিফল্ট হলো ঠিক মাঝখান, অর্থাৎ 50% 50%.যেখানে শিখবেন: পর্ব ৩২
- oklch()ও-কে-এল-সি-এইচ
- Oklab color space-এর মেরু রূপে রং লেখার function: L (চোখে অনুভূত আলো), C (তীব্রতা), H (hue). সমান L-এ সব রং চোখে প্রায় সমান উজ্জ্বল, তাই প্যালেট বানাতে সুবিধাযেখানে শিখবেন: পর্ব ২০পর্ব ৩৬পর্ব ৫৭
- OLEDও-এল-ই-ডি
- যে পর্দায় প্রতিটি পিক্সেল নিজেই আলো দেয়, আলাদা পেছনের আলো (backlight) থাকে না। তাই গাঢ় বা কালো পিক্সেলে কম বিদ্যুৎ লাগে; LCD পর্দায় এই সুবিধা প্রায় নেইযেখানে শিখবেন: পর্ব ৩৬
- On-screen keyboardঅন-স্ক্রিন কি-বোর্ড
- ফোন বা ট্যাবলেটের পর্দায় ফুটে ওঠা কি-বোর্ড। ঘরের type বা inputmode দেখে ব্রাউজার ঠিক করে কোন ধরনের কি-বোর্ড (অক্ষর, অঙ্ক, ইমেইল) আসবে।যেখানে শিখবেন: পর্ব ০৮
- Online playgroundঅনলাইন প্লেগ্রাউন্ড
- ব্রাউজারেই HTML, CSS, JavaScript লিখে সাথে সাথে ফল দেখার ওয়েবসাইট — কিছু ইনস্টল করতে হয় না। যেমন CodePen, JSFiddleযেখানে শিখবেন: পর্ব ০২
- OOCSS (Object-Oriented CSS)ও-ও-সিএসএস
- Nicole Sullivan-এর প্রস্তাবিত পদ্ধতি — কাঠামো (structure) আর রূপ (skin) আলাদা class-এ রাখা, আর কোনো বস্তুর চেহারা যেন সে কোথায় বসেছে তার ওপর নির্ভর না করে।যেখানে শিখবেন: পর্ব ৪৬
- opacityঅপাসিটি
- পুরো element-কে — লেখা, বর্ডার, ছবি আর সব সন্তানসহ — একসাথে আংশিক স্বচ্ছ করার CSS property; মান ০ থেকে ১যেখানে শিখবেন: পর্ব ২০পর্ব ২৩পর্ব ৩৮
- Open Graph (og:)ওপেন গ্রাফ
- ২০১০ সালে Facebook-এর প্রকাশ করা নিয়ম: <meta property="og:title">, og:description, og:image, og:url, og:type দিয়ে পাতা নিজেই বলে দেয় শেয়ার করলে কার্ড কেমন হবে। আজ প্রায় সব অ্যাপ এটি পড়েযেখানে শিখবেন: পর্ব ১৩পর্ব ১৫পর্ব ৫৩
- OpenTypeওপেনটাইপ
- আধুনিক ফন্ট ফাইলের মান, যার ভেতরে যুক্তাক্ষর বানানো আর চিহ্ন বসানোর নিয়ম (GSUB, GPOS টেবিল) লেখা থাকে। বাংলা ঠিকভাবে দেখাতে এই নিয়মগুলো থাকা জরুরিযেখানে শিখবেন: পর্ব ১৪
- Optional tag (implied tag)অপশনাল ট্যাগ
- যে tag না লিখলেও চলে, কারণ parser নিজেই বুঝে নেয় — যেমন <html>, <head>, <body>, আর </p> বা </li>. তবু নিজে লেখাই ভালো অভ্যাসযেখানে শিখবেন: পর্ব ০৩
- orderঅর্ডার
- flex বা grid item-এর চোখে দেখার ক্রম বদলানোর property — ডিফল্ট 0, ছোট সংখ্যা আগে। Tab আর screen reader-এর ক্রম বদলায় না, তাই অর্থবহ ক্রম HTML-এ রাখতে হয়।যেখানে শিখবেন: পর্ব ২৫পর্ব ২৬
- Ordered list (ol)অর্ডারড লিস্ট
- ক্রমযুক্ত তালিকা — যেখানে ক্রমটাই অর্থের অংশ, যেমন রান্নার ধাপ বা মেধাতালিকা। লেখা হয় <ol> দিয়ে, নম্বর ব্রাউজার নিজেই বসায়।যেখানে শিখবেন: পর্ব ০৭পর্ব ৫৭
- Originঅরিজিন
- একটি ওয়েব ঠিকানার scheme, host আর port — তিনটি মিলে তৈরি পরিচয়, যেমন https://abcltech.com. ব্রাউজারের নিরাপত্তা-নিয়ম ঠিক করে কোন origin কোন origin-এর ডেটা পড়তে পারবেযেখানে শিখবেন: পর্ব ০২পর্ব ০৬পর্ব ৩৭
- Origin trialঅরিজিন ট্রায়াল
- একটি পরীক্ষামূলক ব্যবস্থা, যেখানে কোনো ব্রাউজার একটি নতুন ফিচার সীমিত সময়ের জন্য নির্দিষ্ট সাইটে আসল ব্যবহারকারীদের কাছে চালু করতে দেয়, যাতে স্থায়ীভাবে চালুর আগে মতামত পাওয়া যায়যেখানে শিখবেন: পর্ব ৩৭পর্ব ৪৮
- outlineআউটলাইন
- border-এর বাইরে আঁকা দাগ, যা box model-এর অংশ নয় — কোনো জায়গা নেয় না, পাশের element সরায় না। ব্রাউজার কীবোর্ড focus দেখাতে এটি ব্যবহার করে; outline-offset দিয়ে দূরত্ব বদলানো যায়।যেখানে শিখবেন: পর্ব ১৯পর্ব ৪৩পর্ব ৪৫
- outline-offsetআউটলাইন অফসেট
- outline-কে element-এর border থেকে কতটা দূরে আঁকা হবে, তা ঠিক করার property. ধনাত্মক মানে দাগ বাইরে সরে, ঋণাত্মক মানে ভেতরে ঢোকে। focus-এর দাগকে বোতামের নিজের রং থেকে আলাদা করে স্পষ্ট দেখাতে কাজে লাগে।যেখানে শিখবেন: পর্ব ৪৫
- outputআউটপুট
- একটি হিসাব বা ব্যবহারকারীর কাজের ফল দেখানোর element, যেমন স্লাইডারের মান বা মোট দাম। for attribute-এ লেখা থাকে কোন ঘরগুলো থেকে ফলটি এসেছে।যেখানে শিখবেন: পর্ব ০৯
- overflowওভারফ্লো
- বাক্সের ভেতরের জিনিস বাক্সের চেয়ে বড় হলে কী হবে, তা ঠিক করার CSS property; মান visible (ডিফল্ট, বাইরে ছড়ায়), hidden, scroll, auto আর clipযেখানে শিখবেন: পর্ব ২৩পর্ব ৪২পর্ব ৫৭
- overflow-wrapওভারফ্লো-র্যাপ
- ফাঁকহীন লম্বা শব্দ (যেমন URL) বাক্স ছাপিয়ে গেলে তাকে শব্দের মাঝেও ভাঙার অনুমতি দেয় এমন CSS property; anywhere বা break-word মানযেখানে শিখবেন: পর্ব ২১পর্ব ৫৯
- Overlayওভারলে
- পাতা বা একটি অংশের ওপর বিছানো আবরণ, সাধারণত আধা-স্বচ্ছ কালো — modal বা popup দেখানোর সময় পেছনের জিনিস ঝাপসা বা অন্ধকার করতে ব্যবহৃত হয়।যেখানে শিখবেন: পর্ব ২৪
- overscroll-behaviorওভারস্ক্রল বিহেভিয়ার
- স্ক্রল-বাক্স সীমানায় পৌঁছালে কী হবে তা ঠিক করার CSS নিয়ম; contain দিলে স্ক্রল বাইরের বাক্সে গড়ায় না, none দিলে সীমানার ঝাঁকুনি বা pull-to-refresh-ও বন্ধ হয়যেখানে শিখবেন: পর্ব ৪২
P
- package.jsonপ্যাকেজ ডট জেসন
- প্রজেক্টের মূল ফোল্ডারের একটি JSON ফাইল, যেখানে কোন টুলের কোন সংস্করণ লাগবে আর কোন কমান্ড কোন নামে চলবে (scripts) তা লেখা থাকেযেখানে শিখবেন: পর্ব ৫০
- paddingপ্যাডিং
- content আর border-এর মাঝের ভেতরের ফাঁকা জায়গা। এখানে element-এর নিজের ব্যাকগ্রাউন্ড দেখা যায়; মান ঋণাত্মক হতে পারে না।যেখানে শিখবেন: পর্ব ১৯
- Paint (পেইন্ট)পেইন্ট
- rendering-এর যে ধাপে ব্রাউজার প্রতিটি বাক্সের রং, লেখা, বর্ডার, ছায়া আঁকার নির্দেশ তৈরি করে এবং আঁকেযেখানে শিখবেন: পর্ব ০১পর্ব ২২পর্ব ৩৮
- Paint flashingপেইন্ট ফ্ল্যাশিং
- Rendering ট্যাবের একটি বিকল্প, যা পাতার যে অংশ নতুন করে আঁকা (paint) হয় সেখানে সবুজ ঝলক দেখায় — অকারণে বেশি আঁকা হচ্ছে কি না, তা ধরার জন্যযেখানে শিখবেন: পর্ব ৪৭
- Painting orderপেইন্টিং অর্ডার
- একটি stacking context-এর ভেতরে ব্রাউজার যে নির্দিষ্ট ক্রমে পেছন থেকে সামনে আঁকে — ব্যাকগ্রাউন্ড, ঋণাত্মক z-index, সাধারণ block, float, inline লেখা, positioned বাক্স, তারপর ধনাত্মক z-index.যেখানে শিখবেন: পর্ব ২৪
- Pancake stackপ্যানকেক স্ট্যাক
- header, main আর footer ওপর-নিচে সাজানো লেআউট, যেখানে grid-template-rows: auto 1fr auto দিয়ে মাঝের অংশ বাড়তি জায়গা নেয় — ফলে লেখা কম হলেও footer পর্দার নিচেই থাকে।যেখানে শিখবেন: পর্ব ২৯
- Paragraph (<p>)প্যারাগ্রাফ
- একটি ভাবনা বা বিষয় নিয়ে কয়েকটি বাক্যের দল, যাকে <p> দিয়ে চিহ্নিত করা হয়; এর ভেতরে শুধু phrasing content বসতে পারেযেখানে শিখবেন: পর্ব ০৪
- Parallaxপ্যারালাক্স
- স্ক্রলের সময় পেছনের স্তর সামনের স্তরের চেয়ে ভিন্ন গতিতে সরার ইফেক্ট, যা গভীরতার অনুভূতি দেয়। বেশি হলে কারও কারও মাথা ঘোরাতে পারে, তাই reduced motion-এ বন্ধ রাখা উচিতযেখানে শিখবেন: পর্ব ৪২পর্ব ৪৫
- Parent (element)প্যারেন্ট
- যে element-এর সরাসরি ভেতরে আরেকটি element আছে, সে ওই element-এর parent বা মা-বাবা। root ছাড়া প্রতিটি element-এর parent ঠিক একটিযেখানে শিখবেন: পর্ব ০৩পর্ব ১৭পর্ব ১৮
- Parse errorপার্স এরর
- HTML-এর নিয়ম ভাঙা কোনো লেখা, যেমন ভুল ক্রমে বন্ধ করা tag. ব্রাউজার পাতা বাতিল করে না, নিয়ম মেনে মেরামত করে; validator এগুলো দেখায়যেখানে শিখবেন: পর্ব ০৩পর্ব ৫৮
- Parse timeপার্স টাইম
- ব্রাউজার যখন CSS ফাইল পড়ে প্রতিটি declaration-এর ব্যাকরণ যাচাই করে, সেই সময়। এখানে ভুল ধরা পড়লে declaration-টি পুরো বাতিল হয়, আর আগের declaration কাজ করেযেখানে শিখবেন: পর্ব ৩৩
- Parser (HTML parser)পার্সার
- ব্রাউজারের যে অংশ HTML লেখা পড়ে টুকরো করে আর তা থেকে DOM tree বানায়। ভুল থাকলে নির্দিষ্ট নিয়মে মেরামতও করেযেখানে শিখবেন: পর্ব ০৩পর্ব ১৩
- Parsing (পার্সিং)পার্সিং
- লেখা অক্ষরে অক্ষরে পড়ে তার গঠন বোঝা। ব্রাউজার HTML parse করে ট্যাগ চেনে এবং DOM গাছ তৈরি করে; ভুল HTML-ও নির্দিষ্ট নিয়মে সামলায়যেখানে শিখবেন: পর্ব ০১পর্ব ৫৫
- Partial (Sass)পার্শিয়াল
- নামের শুরুতে আন্ডারস্কোর (_) থাকা Sass ফাইল, যেমন _tokens.scss. এটি নিজে আলাদা CSS ফাইল হয় না; অন্য ফাইল @use বা @forward দিয়ে টেনে নিলে তবেই কাজে লাগেযেখানে শিখবেন: পর্ব ৫০
- Pathপাথ
- সার্ভারের ভেতরে কোন ফোল্ডার ও ফাইল, তা বোঝানো URL-এর অংশ; ফোল্ডারগুলো / দিয়ে আলাদা থাকে, যেমন /blog/posts/eid.html.যেখানে শিখবেন: পর্ব ০৫
- pathLengthপাথ লেংথ
- একটি attribute, যা ব্রাউজারকে বলে “এই রেখার পুরো দৈর্ঘ্যকে এত ধরে হিসাব করো”। pathLength="100" দিলে দাগ-ফাঁকের মাপ শতাংশের মতো লেখা যায়, আসল দৈর্ঘ্য মাপতে হয় না
- patternপ্যাটার্ন
- input-এর attribute, যাতে একটি regex লেখা হয়; ব্রাউজার দেখে পুরো লেখাটি সেই নকশার সাথে মেলে কি না। ফাঁকা ঘরে এটি যাচাই হয় না।যেখানে শিখবেন: পর্ব ০৯
- Pattern libraryপ্যাটার্ন লাইব্রেরি
- সাইটের সব component আর তাদের সব রূপ এক জায়গায় দেখানো জীবন্ত সংগ্রহ, পাশে ব্যবহারবিধি — নকশা আর কোডের সাধারণ রেফারেন্স।যেখানে শিখবেন: পর্ব ৪৬
- Percent-encodingপার্সেন্ট-এনকোডিং
- URL-এ সরাসরি রাখা যায় না এমন অক্ষর (ফাঁকা জায়গা, বাংলা অক্ষর ইত্যাদি) % আর দুই অঙ্কের hex কোডে লেখার নিয়ম; যেমন ফাঁকা জায়গা হয় %20.যেখানে শিখবেন: পর্ব ০৫পর্ব ০৮পর্ব ০৯
- Percentage (%)পার্সেন্টেজ
- অন্য একটি মাপের শতাংশ। কিসের শতাংশ তা property অনুযায়ী আলাদা: width-এ পাত্রের চওড়া, padding-এ সবসময় পাত্রের চওড়া, font-size-এ মূলের font-size, translate-এ নিজের বাক্সযেখানে শিখবেন: পর্ব ২০পর্ব ৩০
- Perceptual uniformityপারসেপচুয়াল ইউনিফর্মিটি
- রঙের মডেলের এমন গুণ, যাতে সংখ্যায় সমান পরিবর্তন মানুষের চোখেও প্রায় সমান পরিবর্তন মনে হয়। Oklab ও OKLCH এ লক্ষ্যে তৈরিযেখানে শিখবেন: পর্ব ২০পর্ব ৫৪পর্ব ৫৭
- Performance budgetপারফরম্যান্স বাজেট
- দলের আগে থেকে ঠিক করে রাখা সীমা — যেমন “প্রথম পর্দার CSS 14 KB-এর বেশি নয়” বা “মোবাইলে LCP ২.৫ সেকেন্ড বা কম”. নতুন ফিচার এই সীমা ভাঙলে আগে আলোচনা হয়যেখানে শিখবেন: পর্ব ৪৯
- Performance panelপারফরম্যান্স প্যানেল
- DevTools-এর যে প্যানেলে কয়েক সেকেন্ডের কাজ রেকর্ড করে দেখা যায় প্রতিটি ফ্রেমে style হিসাব, layout, paint আর JavaScript কতটা সময় নিল — ঝাঁকুনি (jank) ও ধীরগতির কারণ খোঁজার টুলযেখানে শিখবেন: পর্ব ৪৭
- Permissions Policyপারমিশনস পলিসি
- কোন পাতা বা iframe কোন ক্ষমতা (ক্যামেরা, মাইক্রোফোন, লোকেশন, autoplay, পূর্ণ পর্দা) ব্যবহার করতে পারবে তা ঠিক করার নিয়ম। iframe-এ allow attribute দিয়ে দেওয়া হয়।যেখানে শিখবেন: পর্ব ০৬
- Personal access token (PAT)পার্সোনাল অ্যাক্সেস টোকেন
- GitHub-এর দেওয়া পাসওয়ার্ডের বদলে ব্যবহারযোগ্য একটি লম্বা গোপন কোড, যার ক্ষমতা আর মেয়াদ সীমিত করে দেওয়া যায়যেখানে শিখবেন: পর্ব ৫৩
- perspectiveপারস্পেকটিভ
- 3D-তে দর্শক পর্দা থেকে কত দূরে, তার মাপ। মান যত ছোট, গভীরতার বিকৃতি তত বেশি। parent-এ perspective property দিলে সব সন্তান একই দর্শক ভাগ করে; transform-এর ভেতরে perspective() ফাংশন দিলে প্রতিটি element নিজের দর্শক পায়।যেখানে শিখবেন: পর্ব ৪০
- Photosensitive seizureফটোসেনসিটিভ সিজার
- নির্দিষ্ট হারে ঝলকানো আলো বা রঙে কিছু মানুষের খিঁচুনি হওয়া। WCAG 2.3.1 তাই সেকেন্ডে ৩ বারের বেশি ঝলকানি নিষেধ করেযেখানে শিখবেন: পর্ব ৩৯
- Phrasing contentফ্রেজিং কনটেন্ট
- লেখার লাইনের ভেতরের element ও লেখা — strong, em, span, code, a, img ইত্যাদি; <p>-এর ভেতরে শুধু এগুলোই বসতে পারেযেখানে শিখবেন: পর্ব ০৪
- Physical propertyফিজিক্যাল প্রপার্টি
- পর্দার নির্দিষ্ট দিক ধরে নাম দেওয়া CSS property — margin-left, top, width ইত্যাদি। লেখার দিক বদলালেও এরা একই দিকে থাকে।যেখানে শিখবেন: পর্ব ৩৫
- Pixel-perfectপিক্সেল-পারফেক্ট
- ডিজাইনের ছবির সাথে প্রতিটি মাপ হুবহু মিলিয়ে বানানো। ছবির নির্দিষ্ট প্রস্থে এটি লক্ষ্য, কিন্তু অন্য সব প্রস্থে পাতাকে নীতি মেনে মানিয়ে নিতে হয়।যেখানে শিখবেন: পর্ব ৫৯
- placeholderপ্লেসহোল্ডার
- ঘর ফাঁকা থাকা অবস্থায় ভেতরে দেখানো ধূসর ইঙ্গিত-লেখা, যা লেখা শুরু করলেই হারিয়ে যায়। এটি label-এর বদলি নয়, বড়জোর একটি উদাহরণ।যেখানে শিখবেন: পর্ব ০৮পর্ব ৪৩পর্ব ৫৭
- Placeholder selectorপ্লেসহোল্ডার সিলেক্টর
- Sass-এ % দিয়ে শুরু হওয়া selector, যেমন %message. নিজে CSS-এ আসে না; শুধু @extend করার জন্য বানানোযেখানে শিখবেন: পর্ব ৫০
- Pluginপ্লাগইন
- ব্রাউজারের সাথে জুড়ে দেওয়া বাইরের প্রোগ্রাম, যা ব্রাউজার নিজে পারত না এমন জিনিস চালাত — যেমন Flash, Java applet. আধুনিক ব্রাউজার এগুলো আর চালায় না।যেখানে শিখবেন: পর্ব ০৬পর্ব ৫৭
- Polyfill (পলিফিল)পলিফিল
- যে JavaScript কোড পুরোনো ব্রাউজারে একটি নতুন ওয়েব ফিচারের আচরণ নকল করে দেয়, যাতে আপনি নতুন নিয়মে কোড লিখতে পারেনযেখানে শিখবেন: পর্ব ১১পর্ব ৪৮
- Popover (popover attribute)পপওভার
- HTML-এর একটি attribute, যা যেকোনো element-কে শুরুতে লুকানো ভাসমান অংশ বানায়; খুললে top layer-এ ওঠে। popovertarget দেওয়া বাটন JavaScript ছাড়াই একে খোলে-বন্ধ করেযেখানে শিখবেন: পর্ব ১১পর্ব ৩৭পর্ব ৩৮
- Porter-Duff compositingপোর্টার-ডাফ কম্পোজিটিং
- ১৯৮৪ সালে Thomas Porter আর Tom Duff-এর প্রকাশ করা স্বচ্ছ স্তর একটির ওপর আরেকটি বসানোর গাণিতিক নিয়ম; আজকের ব্রাউজার আর গ্রাফিক্স সফটওয়্যারের ভিত্তিযেখানে শিখবেন: পর্ব ৪১
- Portfolio (পোর্টফোলিও)পোর্টফোলিও
- নিজের আগের কাজের নমুনা এক জায়গায় সাজিয়ে দেখানোর সংগ্রহ। ওয়েব ডেভেলপারের ক্ষেত্রে সাধারণত একটি ওয়েবসাইট, যা নিজেই তাঁর দক্ষতার প্রমাণ।যেখানে শিখবেন: পর্ব ৫৪পর্ব ৫৯
- Portfolio reviewপোর্টফোলিও রিভিউ
- ইন্টারভিউর যে ধাপে প্রার্থী নিজের আগের কাজ বা প্রজেক্ট খুলে দেখান আর ব্যাখ্যা করেন — কী বানিয়েছেন, কেন এভাবে, কী শিখেছেন, এখন কী বদলাতেন।যেখানে শিখবেন: পর্ব ৫৮
- position (CSS property)পজিশন
- যে CSS property ঠিক করে একটি বাক্স normal flow মেনে বসবে, না অন্য নিয়মে। মান পাঁচটি: static (ডিফল্ট), relative, absolute, fixed আর sticky.যেখানে শিখবেন: পর্ব ২৪পর্ব ৫৭
- position-areaপজিশন এরিয়া
- anchor positioning-এর একটি property, যা anchor-কে মাঝখানে রেখে চারপাশকে ৩×৩ ঘরের ছকে ভাগ করে, আর বলে দেয় ভাসমান element কোন ঘরে বসবে — যেমন top, bottom বা bottom span-right
- position-try-fallbacksপজিশন ট্রাই ফলব্যাকস
- anchor-এর সাথে বাঁধা element-এর জন্য বিকল্প জায়গার তালিকা। প্রথম পছন্দের জায়গায় পর্দা বা কনটেইনারের সীমা ছাড়িয়ে গেলে ব্রাউজার ক্রমানুসারে বিকল্পগুলো (যেমন flip-block) চেষ্টা করে
- position: stickyস্টিকি পজিশন
- এমন position, যেখানে বাক্স শুরুতে flow-এ নিজের জায়গায় থাকে, আর স্ক্রল করে top: 0-এর মতো একটি সীমায় পৌঁছালে সেখানে আটকে যায় — তবে শুধু নিজের parent-এর সীমার ভেতরে।যেখানে শিখবেন: পর্ব ২৪পর্ব ৩১পর্ব ৪৫
- Positioned elementপজিশনড এলিমেন্ট
- যে element-এর position-এর মান static ছাড়া অন্য কিছু — relative, absolute, fixed বা sticky. শুধু এদের ক্ষেত্রেই top, left আর z-index কাজ করে (z-index অবশ্য flex আর grid item-এও কাজ করে)যেখানে শিখবেন: পর্ব ২৪পর্ব ৫৭
- POSTপোস্ট
- HTTP-র যে method সার্ভারে তথ্য পাঠিয়ে কিছু তৈরি বা বদলায় — যেমন অ্যাকাউন্ট খোলা, অর্ডার। ফর্মের জোড়াগুলো URL-এ নয়, request-এর body-তে যায়।যেখানে শিখবেন: পর্ব ০৮পর্ব ৫৭
- PostCSSপোস্টসিএসএস
- JavaScript-এ লেখা একটি টুল, যা CSS ফাইল পড়ে plugin দিয়ে স্বয়ংক্রিয়ভাবে বদলায় — যেমন prefix বসানো, ছোট করা বা নতুন syntax-কে পুরোনো রূপে আনা। সাধারণত build-এর সময় চলেযেখানে শিখবেন: পর্ব ৪৮পর্ব ৫০পর্ব ৫৮
- postcss-preset-envপোস্টসিএসএস প্রিসেট এনভ
- অনেকগুলো PostCSS plugin-এর একটি প্যাকেট, যা নতুন CSS feature (যেমন nesting) আপনার লক্ষ্য-ব্রাউজারের উপযোগী রূপে বদলে দেয়; ভেতরে Autoprefixer-ও থাকেযেখানে শিখবেন: পর্ব ৫০
- POURপি-ও-ইউ-আর
- WCAG-এর চার মূল নীতির আদ্যক্ষর: Perceivable (অনুভব করা যায়), Operable (চালানো যায়), Understandable (বোঝা যায়), Robust (মজবুত)যেখানে শিখবেন: পর্ব ১২পর্ব ৫৭পর্ব ৫৮
- preconnect (rel="preconnect")প্রি-কানেক্ট
- ব্রাউজারকে আগাম ইশারা: “এই সার্ভারের সাথে এখনই সংযোগ তৈরি করে রাখো” — যাতে পরে ফাইল চাইলে DNS ও সংযোগের সময় বাঁচে; শুধু দরকারি এক-দুটি সার্ভারের জন্যযেখানে শিখবেন: পর্ব ১৩পর্ব ২১পর্ব ৪৯
- prefers-color-schemeপ্রেফার্স কালার স্কিম
- যে media feature জানায় ব্যবহারকারী তাঁর ফোন বা কম্পিউটারে হালকা (light) না গাঢ় (dark) থিম বেছে রেখেছেন। dark mode বানাতে কাজে লাগেযেখানে শিখবেন: পর্ব ৩১পর্ব ৩৬পর্ব ৪৭
- prefers-contrastপ্রেফার্স কনট্রাস্ট
- যে media feature জানায় ব্যবহারকারী বেশি (more) বা কম (less) রঙের পার্থক্য চেয়েছেন কি না, যাতে লেখা আর পটভূমির পার্থক্য বাড়িয়ে পড়া সহজ করা যায়যেখানে শিখবেন: পর্ব ৩১পর্ব ৪৫
- prefers-reduced-motionপ্রেফার্স রিডিউসড মোশন
- যে media feature জানায় ব্যবহারকারী অপারেটিং সিস্টেমে কম অ্যানিমেশন চেয়েছেন কি না। যাঁদের নড়াচড়া দেখলে মাথা ঘোরে বা অস্বস্তি হয়, তাঁদের জন্য অ্যানিমেশন কমাতে এটি ব্যবহার করা হয়যেখানে শিখবেন: পর্ব ৩১পর্ব ৩৭পর্ব ৩৮
- prefers-reduced-transparencyপ্রেফারস রিডিউসড ট্রান্সপারেন্সি
- একটি media feature, যা জানায় ব্যবহারকারী অপারেটিং সিস্টেমে স্বচ্ছতা কমানোর সেটিং চালু করেছেন কি না; এখনো সব প্রধান ব্রাউজারে নেইযেখানে শিখবেন: পর্ব ৪১
- preload (rel="preload")প্রি-লোড
- ব্রাউজারকে আগাম ইশারা: “এই ফাইলটি শিগগিরই লাগবে, আগেভাগে নামাও” — যেমন প্রথম পর্দার বড় ছবি বা মূল ফন্ট; as attribute দিয়ে ফাইলের ধরন বলতে হয়যেখানে শিখবেন: পর্ব ১৩পর্ব ৩২পর্ব ৪৯
- Preload scannerপ্রি-লোড স্ক্যানার
- ব্রাউজারের একটি হালকা অংশ, যা মূল HTML পড়া শেষ হওয়ার আগেই সামনের লেখা উঁকি দিয়ে দেখে <img>, stylesheet আর script খুঁজে আগেভাগে চেয়ে বসে। CSS বা লেআউট তখনো জানা থাকে না, তাই ছবির srcset আর sizes HTML-এই লিখতে হয়।যেখানে শিখবেন: পর্ব ৩২পর্ব ৪৯
- Presentation attributeপ্রেজেন্টেশন অ্যাট্রিবিউট
- SVG-তে fill="red"-এর মতো যে attribute আসলে একটি CSS property-র কাজ করে। এর specificity শূন্য, তাই যেকোনো সাধারণ CSS নিয়ম একে হারিয়ে দেয়যেখানে শিখবেন: পর্ব ৪৪
- preserveAspectRatioপ্রিজার্ভ অ্যাসপেক্ট রেশিও
- viewBox-এর অনুপাত আর SVG-র ঘরের অনুপাত না মিললে কী হবে, তা বলার attribute. ডিফল্ট xMidYMid meet — পুরো ছবি দেখাও, মাঝখানে বসাও; slice মানে ঘর ভরাও, বাড়তি অংশ কাটো; none মানে টেনে লম্বা করোযেখানে শিখবেন: পর্ব ৪৪
- Prettierপ্রিটিয়ার
- একটি জনপ্রিয় code formatter — HTML, CSS, JavaScript-সহ নানা ভাষার কোডের ফাঁক, ইনডেন্ট আর লাইন ভাঙা এক নিয়মে সাজিয়ে দেয়; কোডের অর্থ বদলায় না।যেখানে শিখবেন: পর্ব ৪৬
- Print stylesheetপ্রিন্ট স্টাইলশিট
- @media print-এর ভেতরে লেখা CSS, যা শুধু পাতা ছাপার বা PDF বানানোর সময় চালু হয়, যেমন মেনু লুকানো আর লিংকের ঠিকানা দেখানোযেখানে শিখবেন: পর্ব ৩১পর্ব ৪৫পর্ব ৪৭
- Private Use Area (PUA)প্রাইভেট ইউজ এরিয়া
- Unicode-এর যে code point-গুলোর কোনো সার্বজনীন অর্থ নেই — যে কেউ নিজের কাজে ব্যবহার করতে পারে। icon font আইকনগুলো এখানে রাখে, তাই font না এলে বা screen reader পড়লে অর্থহীন চিহ্ন দেখা যায়যেখানে শিখবেন: পর্ব ৪৪
- progressপ্রোগ্রেস
- একটি কাজ কতদূর এগোল তা দেখানোর দণ্ড, যেমন ফাইল আপলোড ৬৫%; value না দিলে অনির্দিষ্ট অগ্রগতি বোঝায়।যেখানে শিখবেন: পর্ব ০৯
- Progressive enhancementপ্রোগ্রেসিভ এনহ্যান্সমেন্ট
- আগে সবার ব্রাউজারে চলে এমন মূল HTML, তার ওপর CSS-এর সাজ আর নতুন ফিচার বা JavaScript-এর বাড়তি সুবিধা — যাতে নতুন ফিচার না থাকলেও মূল কাজ ঠিক থাকেযেখানে শিখবেন: পর্ব ১১পর্ব ২৮পর্ব ৩০
- Property (CSS)প্রপার্টি
- declaration-এ কোলনের বাঁ দিকের নাম, যা বলে কোন বৈশিষ্ট্য বদলানো হচ্ছে — color, font-size, margin ইত্যাদি। নামগুলো ঠিক করা; বানান ভুল হলে ব্রাউজার চেনে না।যেখানে শিখবেন: পর্ব ১৬পর্ব ৫৭
- Proxy browserপ্রক্সি ব্রাউজার
- যে ব্রাউজার পাতাটি নিজের সার্ভারে খুলে ও আঁকে, তারপর ছোট করে ফোনে পাঠায় — যেমন Opera Mini. ডেটা বাঁচে, কিন্তু JavaScript আর আধুনিক CSS সীমিতভাবে চলেযেখানে শিখবেন: পর্ব ৪৮
- Pseudo-classসিউডো-ক্লাস
- CSS selector-এর একটি ধরন, যা element-কে তার অবস্থা দেখে বাছে — যেমন :hover (মাউস ওপরে), :checked (টিক দেওয়া), :invalid (যাচাইয়ে ব্যর্থ). শুরুতে একটি কোলন থাকে।যেখানে শিখবেন: পর্ব ০৯পর্ব ১৭পর্ব ১৮
- Pseudo-elementসুডো-এলিমেন্ট
- element-এর এমন একটি অংশ যা HTML-এ আলাদা ট্যাগ হিসেবে নেই, কিন্তু CSS দিয়ে সাজানো যায় — যেমন ::before, ::after, ::first-line. specificity-তে type selector-এর সমান ওজন।যেখানে শিখবেন: পর্ব ১৮পর্ব ১৯পর্ব ২২
- Pull (পুল)পুল
- remote repository-র নতুন commit নিজের কম্পিউটারে এনে বর্তমান branch-এ মিলিয়ে নেওয়াযেখানে শিখবেন: পর্ব ৫৩
- Pull request (PR)পুল রিকোয়েস্ট
- GitHub-এ একটি branch-এর কাজ মূল branch-এ মেলানোর অনুরোধ — অন্যরা পরিবর্তন দেখে মন্তব্য করেন, তারপর merge হয়যেখানে শিখবেন: পর্ব ৫৩পর্ব ৫৮
- Pull-to-refreshপুল টু রিফ্রেশ
- পাতা বা তালিকার একেবারে ওপরে থেকে আঙুল নিচে টেনে নতুন করে লোড করার ইশারা। মোবাইল ব্রাউজারে পুরো পাতার জন্য এটি থাকে; ওয়েব অ্যাপে দরকার হলে overscroll-behavior দিয়ে বন্ধ করা যায়যেখানে শিখবেন: পর্ব ৪২
- Push (পুশ)পুশ
- নিজের কম্পিউটারের নতুন commit-গুলো remote repository-তে পাঠানোযেখানে শিখবেন: পর্ব ৫৩
Q
- Quantifierকোয়ান্টিফায়ার
- regex-এ আগের অংশটি কতবার আসবে তা বলার চিহ্ন — {8} মানে ঠিক ৮বার, {3,5} মানে ৩ থেকে ৫বার, ? মানে থাকতেও পারে, না-ও পারে।যেখানে শিখবেন: পর্ব ০৯
- Quantity queryকোয়ান্টিটি কোয়েরি
- কতগুলো সন্তান আছে তা দেখে স্টাইল বদলানোর কৌশল, যেমন ul:has(> li:nth-child(5)) মানে কমপক্ষে ৫টি li আছে এমন তালিকাযেখানে শিখবেন: পর্ব ৩৪
- Query stringকোয়েরি স্ট্রিং
- URL-এ ? চিহ্নের পরের অংশ, যেখানে নাম=মান জোড়া (মাঝে &) দিয়ে সার্ভারকে বাড়তি তথ্য দেওয়া হয় — যেমন সার্চের শব্দ বা ফিল্টার।যেখানে শিখবেন: পর্ব ০৫পর্ব ০৮পর্ব ৫৭
- querySelector()কোয়েরি সিলেক্টর
- JavaScript-এর method, যা একটি CSS selector নিয়ে DOM-এ প্রথম যে element মেলে সেটি ফেরত দেয়; কিছু না মিললে ফেরত দেয় nullযেখানে শিখবেন: পর্ব ৫২
R
- Radio buttonরেডিও বাটন
- গোল বাছাইয়ের ঘর (<input type="radio">). একই name-এর radio-গুলো এক দল, আর দলে একসাথে শুধু একটি বাছা থাকে।যেখানে শিখবেন: পর্ব ০৯পর্ব ৪৩
- Range slider (<input type="range">)রেঞ্জ স্লাইডার
- টেনে বা তীর-চাবি চেপে একটি সীমার মধ্যে মান বাছার কন্ট্রোল — একটি ট্র্যাক আর একটি হাতল (thumb) থাকে। রং বদলাতে accent-color যথেষ্ট; পুরো নকশার জন্য এখনো শুধু ব্রাউজার-নির্দিষ্ট, non-standard pseudo-element আছে (যেমন ::-webkit-slider-thumb, ::-moz-range-thumb)যেখানে শিখবেন: পর্ব ৪৩
- Range syntax (media query)রেঞ্জ সিনট্যাক্স
- Media Queries Level 4-এর নতুন লেখার ধরন, যেখানে min-width/max-width-এর বদলে গণিতের মতো <, <=, >, >= চিহ্ন লেখা যায় — যেমন (400px <= width <= 800px) — আর এটি এখন সব প্রধান ব্রাউজারে চলেযেখানে শিখবেন: পর্ব ৩১
- Raster imageর্যাস্টার ইমেজ
- ছোট ছোট রঙিন বিন্দুর (pixel) গ্রিড দিয়ে তৈরি ছবি — যেমন JPEG, PNG, WebP. নিজের মাপের চেয়ে বড় করলে ঝাপসা হয়।যেখানে শিখবেন: পর্ব ০৬পর্ব ৪৪
- Reader modeরিডার মোড
- ব্রাউজারের এমন সুবিধা, যা পেজের বিজ্ঞাপন ও সাজসজ্জা সরিয়ে শুধু মূল লেখা পরিষ্কারভাবে দেখায়; কোনটি মূল লেখা তা বুঝতে সে HTML-এর গঠন পড়েযেখানে শিখবেন: পর্ব ০৪
- reading-flowরিডিং-ফ্লো
- নতুন প্রস্তাবিত CSS property, যা flex বা grid container-এ focus আর পড়ার ক্রমকে চোখে দেখার ক্রম মানতে বলে। সম্প্রতি Chrome-এ এসেছে, এখনো Baseline নয়।যেখানে শিখবেন: পর্ব ২৫পর্ব ৪৫পর্ব ৫৮
- README.mdরিডমি
- repository-র মূল ফোল্ডারের পরিচয়পত্র — প্রজেক্টটি কী, কীভাবে চালাতে হয়, কে বানিয়েছেন। GitHub এটি repo-র প্রথম পাতায় সাজিয়ে দেখায়যেখানে শিখবেন: পর্ব ৫৩
- readonlyরিড-অনলি
- ঘরের মান বদলানো যাবে না, কিন্তু মানটি জমার সাথে যায়, ঘরটি focus পায় আর লেখা কপি করা যায়। যাচাই থেকে বাদ পড়ে; checkbox, radio, select-এ কাজ করে না।যেখানে শিখবেন: পর্ব ০৯পর্ব ৪৩
- Red-flag answerরেড-ফ্ল্যাগ উত্তর
- এমন উত্তর, যা শুনে ইন্টারভিউয়ার সতর্ক হয়ে যান — যেমন পুরোনো জ্ঞান, ব্যবহারকারীর প্রতি উদাসীনতা বা শেখার অনীহার চিহ্ন। “সব জায়গায় !important দিই” এর একটি উদাহরণ।যেখানে শিখবেন: পর্ব ৫৮
- Refactoringরিফ্যাক্টরিং
- বাইরের আচরণ বা চেহারা না বদলে কোডের ভেতরের গঠন ছোট ছোট ধাপে উন্নত করা — যাতে পড়া, বদলানো আর রক্ষণাবেক্ষণ সহজ হয়।যেখানে শিখবেন: পর্ব ৪৬
- Referer headerরেফারার হেডার
- ব্রাউজার নতুন পাতা চাওয়ার সময় যে তথ্য পাঠায় — পাঠক কোন পাতা থেকে এসেছেন। শব্দটির বানান মূল নিয়মে ভুল করে লেখা হয়েছিল, সেই ভুল বানানই রয়ে গেছে।যেখানে শিখবেন: পর্ব ০৫
- Reflow (WCAG 1.4.10)রিফ্লো
- WCAG-এর একটি নিয়ম: ছোট পর্দায় বা বড় করে দেখলেও সাধারণ লেখা পাশে স্ক্রল ছাড়াই পড়া যাবে। ডেটা-টেবিলের মতো দুই দিকের কাঠামোর জন্য এখানে ব্যতিক্রম রাখা আছে।যেখানে শিখবেন: পর্ব ০৭পর্ব ২৯পর্ব ৩০
- Registered custom propertyরেজিস্টার্ড কাস্টম প্রপার্টি
- @property বা CSS.registerProperty() দিয়ে ধরন ঘোষণা করা custom property. ব্রাউজার এর মানকে সত্যিকারের রং, দৈর্ঘ্য বা কোণ হিসেবে বোঝে, তাই মাঝের মান হিসাব করে মসৃণ animation করতে পারেযেখানে শিখবেন: পর্ব ৩৩
- Regular expression (regex)রেগুলার এক্সপ্রেশন
- লেখার একটি নকশা বা ছাঁচ, যা দিয়ে যাচাই করা যায় কোনো লেখা নির্দিষ্ট আকারের কি না — যেমন “০১ দিয়ে শুরু, মোট ১১ অঙ্ক”.যেখানে শিখবেন: পর্ব ০৯পর্ব ১৭পর্ব ৫৭
- rel attributeরেল অ্যাট্রিবিউট
- relationship — লিংক করা পাতার সাথে এই পাতার সম্পর্ক জানানোর attribute, যেমন noopener, nofollow, sponsored, ugc; একাধিক মান ফাঁকা দিয়ে দেওয়া যায়।যেখানে শিখবেন: পর্ব ০৫
- rel="noreferrer"নো-রেফারার
- লিংকের একটি rel মান, যা নতুন সাইটকে জানাতে দেয় না পাঠক কোন পাতা থেকে এসেছেন (Referer পাঠায় না); সাথে noopener-এর কাজও করে।যেখানে শিখবেন: পর্ব ০৫
- Relative length (আপেক্ষিক একক)রিলেটিভ লেংথ
- যে একক অন্য কোনো মাপের অনুপাতে হিসাব হয় — লেখার মাপ (em, rem, ch), মূল বাক্স (%) বা ব্রাউজারের জানালা (vw, vh)যেখানে শিখবেন: পর্ব ২০
- Relative luminance (আপেক্ষিক উজ্জ্বলতা)রিলেটিভ লুমিন্যান্স
- WCAG-এর সূত্রে একটি রঙের উজ্জ্বলতার মাপ — ০ (কালো) থেকে ১ (সাদা). লাল, সবুজ, নীলকে gamma সরিয়ে চোখের সংবেদনশীলতার ওজনে যোগ করে পাওয়া যায়; সবুজের ওজন সবচেয়ে বেশি। দুটি রঙের luminance থেকেই contrast ratio হিসাব হয়।যেখানে শিখবেন: পর্ব ৪৫
- Relative path / URLরিলেটিভ পাথ
- বর্তমান পাতার ঠিকানার সাপেক্ষে লেখা অসম্পূর্ণ ঠিকানা; ../ মানে এক ফোল্ডার উপরে, ./ মানে একই ফোল্ডার। ব্রাউজার একে পূর্ণ ঠিকানায় বদলে নেয়।যেখানে শিখবেন: পর্ব ০৫পর্ব ১৫পর্ব ১৬
- Relative selectorরিলেটিভ সিলেক্টর
- এমন selector যার শুরুটা ধরা হয় অন্য একটি element থেকে, যেমন :has()-এর ভেতরের > img বা + p. বন্ধনীর বাইরের element-টিই সেই শুরুর বিন্দুযেখানে শিখবেন: পর্ব ৩৪
- rem (root em)রেম
- root element (html)-এর font-size-এর গুণিতক একক। পাতার যেকোনো জায়গায় একই মাপ দেয় আর ব্যবহারকারীর ডিফল্ট লেখার মাপ মানে, তাই লেখার মাপের জন্য সবচেয়ে প্রচলিতযেখানে শিখবেন: পর্ব ২০পর্ব ৫৮
- rem (root em)রেম
- মূল <html> element-এর font-size-এর গুণিতক। সাধারণত 1rem = 16px, কিন্তু পাঠক ব্রাউজারে লেখার আকার বাড়ালে rem-ও বাড়ে — তাই লেখার আকারের জন্য উপযুক্ত এককযেখানে শিখবেন: পর্ব ২১পর্ব ৪৫
- Remote (রিমোট repository)রিমোট
- অন্য কোথাও — সাধারণত GitHub-এর মতো সার্ভারে — রাখা একই repository-র কপি। প্রচলিত নাম originযেখানে শিখবেন: পর্ব ৫৩
- Render treeরেন্ডার ট্রি
- DOM আর CSSOM মিলিয়ে তৈরি তালিকা — শুধু যে element পর্দায় দেখা যাবে, তাদের চূড়ান্ত স্টাইলসহ। head বা display: none দেওয়া element এতে থাকে নাযেখানে শিখবেন: পর্ব ০১পর্ব ৩৪পর্ব ৩৮
- Render-blockingরেন্ডার-ব্লকিং
- যে ফাইল না আসা পর্যন্ত ব্রাউজার পাতা পর্দায় আঁকে না। head-এর stylesheet সাধারণত render-blocking, যাতে পাঠক সাজানোর আগের সাদামাটা পাতা না দেখেন।যেখানে শিখবেন: পর্ব ১৬পর্ব ৩৬পর্ব ৪৭
- Rendered Fontsরেন্ডার্ড ফন্টস
- Chrome বা Edge DevTools-এর Computed ট্যাবের নিচের অংশ, যা বলে বেছে নেওয়া element-এর লেখা আসলে কোন ফন্টে কয়টি অক্ষর (glyph) আঁকা হয়েছে — ওয়েব ফন্ট এসেছে, না বাংলা অক্ষর সিস্টেমের fallback ফন্টে আঁকা হলো, তা যাচাইয়ের উপায়যেখানে শিখবেন: পর্ব ৪৭
- Rendering engine (রেন্ডারিং ইঞ্জিন)রেন্ডারিং ইঞ্জিন
- ব্রাউজারের যে অংশ HTML ও CSS পড়ে পাতা আঁকে। আজকের প্রধান তিনটি: Blink (Chrome, Edge), WebKit (Safari), Gecko (Firefox)যেখানে শিখবেন: পর্ব ০১পর্ব ০২পর্ব ৪৮
- Rendering tabরেন্ডারিং ট্যাব
- DevTools-এর drawer-এর একটি ট্যাব, যা আঁকার কাজ চোখে দেখায় (paint flashing, layout shift) আর ব্যবহারকারীর পরিস্থিতির ভান করে — print, prefers-color-scheme, prefers-reduced-motion, বর্ণান্ধতা ইত্যাদিযেখানে শিখবেন: পর্ব ৪৭
- repeat()রিপিট ফাংশন
- একই track-মাপ বা প্যাটার্ন বারবার না লিখে সংক্ষেপে লেখার CSS ফাংশন। repeat(3, 1fr) মানে 1fr 1fr 1frযেখানে শিখবেন: পর্ব ২৭পর্ব ৫৭
- Replaced elementরিপ্লেসড এলিমেন্ট
- যে element-এর জায়গায় পেজে বাইরের একটি জিনিস বসে, যার নিজস্ব আকার আছে — যেমন <img>-এর ছবি, <video>-এর ভিডিও বা <iframe>-এর পাতা। CSS এর ভেতরের অংশ সরাসরি সাজাতে পারে না।যেখানে শিখবেন: পর্ব ০৬পর্ব ১৯পর্ব ৩০
- Repository (repo, রিপোজিটরি)রিপোজিটরি
- Git যে প্রজেক্টের হিসাব রাখছে — ফাইলগুলো আর তাদের পুরো ইতিহাস একসাথে। ইতিহাসটি থাকে প্রজেক্ট ফোল্ডারের ভেতরের লুকানো .git ফোল্ডারেযেখানে শিখবেন: পর্ব ৫৩
- Request bodyরিকোয়েস্ট বডি
- HTTP request-এর header-এর পরের অংশ, যেখানে পাঠানো তথ্য থাকে। POST ফর্মের নাম=মান জোড়া এখানে যায়, URL-এ দেখা যায় না।যেখানে শিখবেন: পর্ব ০৮পর্ব ৫৭পর্ব ৫৮
- requiredরিকোয়ার্ড
- একটি boolean attribute, যা বলে ঘরটি ফাঁকা রেখে ফর্ম জমা দেওয়া যাবে না। radio দলে একটিতে দিলেই পুরো দল বাধ্যতামূলক হয়।যেখানে শিখবেন: পর্ব ০৯
- Resolution switchingরেজোলিউশন সুইচিং
- একই ছবির ছোট-বড় কয়েকটি ফাইল দিয়ে পর্দা অনুযায়ী মানানসইটি নামানো। srcset আর sizes দিয়ে হয়, সিদ্ধান্ত নেয় ব্রাউজার।যেখানে শিখবেন: পর্ব ৩২পর্ব ৫৭
- Resource Timing APIরিসোর্স টাইমিং
- ব্রাউজারের একটি JavaScript ব্যবস্থা (performance.getEntriesByType('resource')), যা পাতার প্রতিটি নামানো ফাইলের সময়ের হিসাব দেয় — কখন শুরু, কতক্ষণ লাগল, কত বড়যেখানে শিখবেন: পর্ব ৪৯
- Responsive web designরেসপন্সিভ ওয়েব ডিজাইন
- একটিই HTML পাতা, আর এমন CSS যা পর্দার মাপ অনুযায়ী নিজেই সাজ বদলায় — ফোন, ট্যাবলেট, বড় মনিটর সবখানে পড়ার উপযোগী। নামটি Ethan Marcotte-এর, ২০১০ সালে।যেখানে শিখবেন: পর্ব ৩০পর্ব ৫৭
- rgb()আর-জি-বি
- লাল, সবুজ, নীলের মাত্রা ০ থেকে ২৫৫ দিয়ে রং লেখার function. আধুনিক লেখা rgb(244 42 65 / 50%), যেখানে / চিহ্নের পরের অংশ স্বচ্ছতাযেখানে শিখবেন: পর্ব ২০
- Rich resultরিচ রেজাল্ট
- সার্চ ফলাফলে সাধারণ নীল লিংকের চেয়ে সমৃদ্ধ চেহারা — breadcrumb, পণ্যের দাম, অনুষ্ঠানের তারিখ ইত্যাদি। structured data এর যোগ্যতা দেয়, নিশ্চয়তা নয়যেখানে শিখবেন: পর্ব ১৩
- River (টাইপোগ্রাফিক নদী)রিভার
- justify করা লেখায় শব্দের বড় বড় ফাঁক ওপর-নিচে মিলে লেখার ভেতর দিয়ে যে সাদা আঁকাবাঁকা রেখা তৈরি হয় — পড়ার ছন্দ ভাঙেযেখানে শিখবেন: পর্ব ২১
- Robots meta tagরোবটস মেটা ট্যাগ
- <meta name="robots"> — সার্চ ইঞ্জিনকে পাতাটি নিয়ে নির্দেশ দেয়: noindex (সূচিপত্রে রেখো না), nofollow (লিংক অনুসরণ কোরো না), max-image-preview ইত্যাদিযেখানে শিখবেন: পর্ব ১৩
- robots.txtরোবটস ডট টিএক্সটি
- সাইটের মূল ফোল্ডারে রাখা একটি লেখা-ফাইল, যা crawler-দের বলে কোন অংশে ঢোকা (crawl) যাবে না। এটি শুধু অনুরোধ, তালা নয়; আর index থেকে বাদ দেওয়ার কাজও এর নয়যেখানে শিখবেন: পর্ব ১৩পর্ব ৫৩
- Role (ভূমিকা)রোল
- accessibility tree-তে একটি অংশের পরিচয় — যেমন navigation, main, button, heading. Screen reader এই role শুনিয়েই বলে অংশটি কী ধরনের।যেখানে শিখবেন: পর্ব ১০পর্ব ১২পর্ব ৫২
- Root elementরুট এলিমেন্ট
- ডকুমেন্টের সবচেয়ে বাইরের element — HTML পাতায় <html>. CSS-এ :root selector আর rem একক এটিকেই বোঝায়যেখানে শিখবেন: পর্ব ২০পর্ব ৩৩পর্ব ৫৭
- Root-relative pathরুট-রিলেটিভ পাথ
- / দিয়ে শুরু হওয়া ঠিকানা, যা বর্তমান ফোল্ডার নয়, সাইটের গোড়া (root) থেকে হিসাব হয় — যেমন /images/logo.png.যেখানে শিখবেন: পর্ব ০৫পর্ব ১৫পর্ব ৫৭
- Row group (thead, tbody, tfoot)রো গ্রুপ
- টেবিলের সারিগুলোর দল — মাথার সারি <thead>, মূল ডেটা <tbody>, আর যোগফল বা গড়ের সারি <tfoot>. অর্থ বোঝায়, আর ছাপা বা স্ক্রলের সময়ও কাজে লাগে।যেখানে শিখবেন: পর্ব ০৭
- rowspanরোস্প্যান
- টেবিলের ঘরের attribute — ঘরটি নিচের দিকে কয়টি সারি জুড়ে থাকবে। নিচের সারির ওই খোপ আগেই দখল হয়ে যায়, তাই সেখানে আবার ঘর লেখা যায় না।যেখানে শিখবেন: পর্ব ০৭পর্ব ৫৭
- RTL (right-to-left)আর-টি-এল
- ডান থেকে বাঁয়ে লেখা হয় এমন লিপি — আরবি, উর্দু, ফারসি, হিব্রু। HTML-এ dir="rtl" দিয়ে জানানো হয়; উল্টোটি LTR, যেমন বাংলা ও ইংরেজি।যেখানে শিখবেন: পর্ব ৩৫
S
- Sanitize (পরিশোধন)স্যানিটাইজ
- বাইরে থেকে আসা HTML বা SVG থেকে script, onload-এর মতো বিপজ্জনক অংশ ছেঁকে বাদ দেওয়া, যাতে শুধু নিরাপদ অংশ পাতায় বসে। DOMPurify-এর মতো পরীক্ষিত লাইব্রেরি এ কাজ করেযেখানে শিখবেন: পর্ব ৪৪পর্ব ৫২
- Sassস্যাস
- সবচেয়ে জনপ্রিয় CSS preprocessor; variable, nesting, mixin, function আর loop দিয়ে লেখা স্টাইলকে build-এর সময় সাধারণ CSS-এ রূপান্তর করে। নামটি Syntactically Awesome Style Sheets-এর সংক্ষেপযেখানে শিখবেন: পর্ব ৫০পর্ব ৫১পর্ব ৫৬
- Sass functionস্যাস ফাংশন
- Compile-এর সময় একটি মান হিসাব করে ফেরত দেয় এমন ফাংশন — Sass-এর নিজের module-এর (math.div, color.adjust) বা @function দিয়ে নিজের বানানোযেখানে শিখবেন: পর্ব ৫০
- Sass variableস্যাস ভ্যারিয়েবল
- $ চিহ্ন দিয়ে শুরু হওয়া Sass-এর নাম, যেমন $brand. Compile-এর সময় প্রতিটি ব্যবহারের জায়গায় তার মান বসে যায়, তাই চূড়ান্ত CSS-এ বা ব্রাউজারে এর কোনো অস্তিত্ব থাকে নাযেখানে শিখবেন: পর্ব ৫০
- schema.orgস্কিমা ডট অর্গ
- ২০১১ সালে বড় সার্চ ইঞ্জিনগুলো মিলে শুরু করা structured data-র সাধারণ শব্দভান্ডার — Article, Course, Product, Event, BreadcrumbList, FAQPage-এর মতো ধরন আর তাদের বৈশিষ্ট্যযেখানে শিখবেন: পর্ব ১৩
- Scheme (protocol)স্কিম
- URL-এর শুরুর অংশ, যা বলে কোন নিয়মে বা কোন অ্যাপ দিয়ে ঠিকানাটি খুলতে হবে — যেমন https, http, mailto, tel, file.যেখানে শিখবেন: পর্ব ০৫
- scope (attribute)স্কোপ
- <th>-এর attribute, যা বলে শিরোনামটি কোন দিকের ঘরগুলোর জন্য — col (নিচের কলাম), row (ডানের সারি), colgroup বা rowgroup. এতে screen reader প্রতিটি ঘরের সাথে ঠিক শিরোনাম পড়ে।যেখানে শিখবেন: পর্ব ০৭পর্ব ৫৭
- Scope creepস্কোপ ক্রিপ
- প্রজেক্ট চলার সময় ধীরে ধীরে নতুন নতুন কাজ যোগ হতে থাকা, কিন্তু সময় বা পারিশ্রমিক না বাড়া। লিখিত কাজের তালিকা আর বাড়তি কাজের আলাদা হিসাব দিয়ে ঠেকানো হয়।যেখানে শিখবেন: পর্ব ৫৮
- Scoped styles (framework)স্কোপড স্টাইল
- Vue, Svelte, Angular-এর মতো framework-এর সুবিধা, যেখানে একটি component-এর CSS শুধু সেই component-এ খাটে — সাধারণত element-এ একটি অনন্য attribute বসিয়ে selector-এ জুড়ে দিয়ে।যেখানে শিখবেন: পর্ব ৪৬
- Scoping proximityস্কোপিং প্রক্সিমিটি
- cascade-এর একটি ধাপ: দুটি @scope নিয়মের specificity সমান হলে, যে নিয়মের scoping root element-টির DOM-এ সবচেয়ে কাছে, সে জেতে — কোডে কোনটি পরে লেখা, তা এখানে গৌণযেখানে শিখবেন: পর্ব ৩৭
- Scoping rootস্কোপিং রুট
- @scope (.card) লিখলে যে .card element-গুলো থেকে scope শুরু হয়। নিয়মগুলো শুধু এর ভেতরে খাটে, আর :scope দিয়ে এই element-টিকেই বোঝানো হয়যেখানে শিখবেন: পর্ব ৩৭
- Screen reader (স্ক্রিন রিডার)স্ক্রিন রিডার
- যে সফটওয়্যার পর্দার লেখা ও কাঠামো জোরে পড়ে শোনায়, যাতে চোখে দেখতে পান না এমন মানুষ কম্পিউটার ও ওয়েব ব্যবহার করতে পারেন। এটি HTML-এর অর্থের ওপর নির্ভর করেযেখানে শিখবেন: পর্ব ০১পর্ব ০৩পর্ব ০৪
- Screening roundস্ক্রিনিং রাউন্ড
- ইন্টারভিউর প্রথম ছোট ধাপ, সাধারণত ১৫–৩০ মিনিটের ফোন বা ভিডিও কল। প্রার্থীর পটভূমি, আগ্রহ আর পদের সাথে মিল দেখা হয়; কখনো দু-একটি সহজ প্রযুক্তিগত প্রশ্নও থাকে।যেখানে শিখবেন: পর্ব ৫৮
- Scroll chainingস্ক্রল চেইনিং
- ভেতরের একটি স্ক্রল-বাক্স তার শেষ সীমানায় পৌঁছানোর পর বাড়তি স্ক্রল বাইরের বাক্সে বা পুরো পাতায় চলে যাওয়া — শিকলের মতো। চ্যাট বক্স বা modal-এ এটি বিরক্তিকরযেখানে শিখবেন: পর্ব ৪২
- Scroll containerস্ক্রল কন্টেইনার
- এমন একটি বাক্স, যার ভেতরের জিনিস বড় হলে বাক্সের নিজের ভেতরেই স্ক্রল হয়, বাকি পাতা নড়ে না। CSS-এ overflow-এর hidden, scroll বা auto মান দিলে এমন বাক্স তৈরি হয় (visible বা clip দিলে নয়); চওড়া টেবিলকে ফোনে ব্যবহারযোগ্য রাখতে এর ভেতরে মোড়ানো হয়।যেখানে শিখবেন: পর্ব ০৭পর্ব ২৩পর্ব ২৪
- Scroll eventস্ক্রল ইভেন্ট
- পাতা বা কোনো বাক্স স্ক্রল হলে JavaScript-এ যে ঘটনা (event) ঘটে। এটি main thread-এ চলে আর স্ক্রলের পরে আসে, তাই এর ওপর ভারী কাজ করলে পাতা ঝাঁকুনি দিয়ে চলেযেখানে শিখবেন: পর্ব ৪২
- Scroll hijackingস্ক্রল হাইজ্যাকিং
- ব্যবহারকারীর স্বাভাবিক স্ক্রল আটকে বা বদলে দিয়ে জোর করে নিজের মতো গতি বা লাফ চাপিয়ে দেওয়া — যেমন চাকা একটু ঘোরালেই পুরো পাতা পরের অংশে টেনে নেওয়া। এতে নিয়ন্ত্রণ হারানোর অনুভূতি হয়যেখানে শিখবেন: পর্ব ৪২
- Scroll progress timelineস্ক্রল প্রোগ্রেস টাইমলাইন
- যে timeline একটি scroll container কতটা স্ক্রল হয়েছে (০% থেকে ১০০%) তা মাপে। animation-timeline: scroll() দিয়ে নামহীন, আর scroll-timeline property দিয়ে নামওয়ালা রূপে ব্যবহার করা হয়যেখানে শিখবেন: পর্ব ৪২
- Scroll snapস্ক্রল স্ন্যাপ
- CSS-এর এমন ব্যবস্থা, যাতে স্ক্রল থামার পর বাক্সটি নিজে থেকে নিকটতম নির্দিষ্ট বিন্দুতে (খাঁজে) গিয়ে বসে — যেমন carousel-এর প্রতিটি কার্ড ঠিক জায়গায়। ধারকে scroll-snap-type আর ভেতরের জিনিসে scroll-snap-align দিয়ে লেখা হয়যেখানে শিখবেন: পর্ব ৪২পর্ব ৫৬
- scroll-behaviorস্ক্রল বিহেভিয়ার
- scroll container-এর CSS property; smooth দিলে লিংক বা JavaScript দিয়ে করা স্ক্রল এক লাফে না হয়ে অল্প সময়ে গড়িয়ে যায়। ব্যবহারকারীর নিজের চাকা ঘোরানো বা আঙুল টানায় এর প্রভাব নেইযেখানে শিখবেন: পর্ব ৪২
- Scroll-driven animationস্ক্রল-ড্রিভেন অ্যানিমেশন
- যে CSS animation সময় ধরে নয়, পাতার স্ক্রল কতটা হয়েছে বা একটি element পর্দায় কতটা দেখা যাচ্ছে তা ধরে এগোয়। animation-timeline: scroll() বা view() দিয়ে লেখা হয়যেখানে শিখবেন: পর্ব ৩৭পর্ব ৩৯পর্ব ৪২
- scroll-paddingস্ক্রল প্যাডিং
- scroll container-এ (যেমন পুরো পাতায়) দেওয়া একটি বাড়তি দূরত্ব, যা ব্রাউজার কোনো element দেখাতে স্ক্রল করার সময় বাদ রাখে। sticky header-এর নিচে লিংক বা focus পাওয়া জিনিস ঢাকা পড়া আটকায়।যেখানে শিখবেন: পর্ব ২৪পর্ব ৪৫পর্ব ৫৯
- Scroll-state queryস্ক্রল-স্টেট কোয়েরি
- @container scroll-state(...) ধরনের নতুন শর্ত, যা জানতে চায় একটি sticky element আটকে গেছে কি না বা একটি বাক্স আরও স্ক্রল করা যায় কি না। এখন শুধু Chromium-ভিত্তিক ব্রাউজারে আছে, Baseline নয়যেখানে শিখবেন: পর্ব ৩১
- scrollbar-colorস্ক্রলবার কালার
- স্ক্রলবারের রং ঠিক করার মানসম্মত CSS property; প্রথম রং টেনে ধরার অংশের (thumb), দ্বিতীয় রং পথের (track) জন্য। পুরোনো ::-webkit-scrollbar-এর বদলে এটিই সুপারিশকৃতযেখানে শিখবেন: পর্ব ৪২
- scrollbar-gutterস্ক্রলবার গাটার
- স্ক্রলবারের জন্য আগেই জায়গা রেখে দেওয়ার CSS property; stable দিলে স্ক্রলবার আসা-যাওয়ার সময় লেখা আর লেআউট পাশে লাফায় নাযেখানে শিখবেন: পর্ব ২৩পর্ব ৪২
- scrollbar-widthস্ক্রলবার উইডথ
- স্ক্রলবার কতটা মোটা হবে তা জানানোর মানসম্মত CSS property — এর মান হতে পারে auto, thin বা none; সঠিক মাপ ব্রাউজার ও অপারেটিং সিস্টেম ঠিক করেযেখানে শিখবেন: পর্ব ৪২
- SCSS syntaxএসসিএসএস সিনট্যাক্স
- Sass-এর দুই লেখার ধরনের একটি, ফাইলের শেষে .scss থাকে। এটি CSS-এর মতোই বন্ধনী { } আর সেমিকোলন ব্যবহার করে, তাই যেকোনো বৈধ CSS ফাইল একই সাথে বৈধ SCSS-ওযেখানে শিখবেন: পর্ব ৫০
- Secret / API key (গোপন চাবি)সিক্রেট কি
- কোনো সেবা (পেমেন্ট, ইমেইল, ডেটাবেস) ব্যবহারের পাসওয়ার্ডের মতো গোপন কোড। repository-তে বা ব্রাউজারে পাঠানো কোডে কখনো রাখা যাবে নাযেখানে শিখবেন: পর্ব ৫৩
- select ও optionসিলেক্ট ও অপশন
- বিকল্পের তালিকা থেকে বাছাইয়ের কন্ট্রোল — সাধারণত ড্রপডাউন। প্রতিটি বিকল্প একটি <option>, দলে ভাগ করতে <optgroup>, একাধিক বাছতে multiple.যেখানে শিখবেন: পর্ব ০৯পর্ব ৩৭পর্ব ৪৩
- Selector (সিলেক্টর)সিলেক্টর
- CSS rule-এর শুরুর অংশ, যা বলে নিয়মটি পাতার কোন element-এ খাটবে — যেমন p (সব অনুচ্ছেদ), .tag (class="tag" যার), #today (id="today" যার).যেখানে শিখবেন: পর্ব ১৬পর্ব ১৭পর্ব ১৮
- Selector explosionসিলেক্টর এক্সপ্লোশন
- @extend বা গভীর nesting থেকে অল্প লেখায় অনেক বেশি আর লম্বা selector তৈরি হয়ে CSS ফাইল ফুলে ওঠার সমস্যাযেখানে শিখবেন: পর্ব ৫০
- Selector list (grouping)সিলেক্টর লিস্ট
- কমা দিয়ে আলাদা করা কয়েকটি selector, যেমন h2, h3 — একই declaration সবগুলোতে খাটে। সাধারণ তালিকায় একটি selector অবৈধ হলে পুরো rule বাতিল হয়।যেখানে শিখবেন: পর্ব ১৭
- Self-hosting (ফন্ট)সেল্ফ-হোস্টিং
- Google Fonts-এর মতো তৃতীয় পক্ষের সার্ভার থেকে না নিয়ে ফন্ট ফাইল নিজের সাইটের সার্ভারে রেখে @font-face দিয়ে ব্যবহার করাযেখানে শিখবেন: পর্ব ২১
- Semantic HTMLসিমান্টিক এইচটিএমএল
- লেখার প্রতিটি অংশকে তার অর্থের সাথে মেলে এমন element দিয়ে চিহ্নিত করা — শিরোনামে heading, অনুচ্ছেদে p, সতর্কতায় strong; চেহারা ঠিক করে CSSযেখানে শিখবেন: পর্ব ০৪পর্ব ০৭পর্ব ১০
- Semantic tokenসিমান্টিক টোকেন
- যে design token রূপ নয়, কাজ বলে — যেমন --color-danger বা --color-text. থিম বদলালে এগুলোর মান বদলায়, নাম একই থাকেযেখানে শিখবেন: পর্ব ৩৩পর্ব ৩৬পর্ব ৪৬
- SEO (Search Engine Optimization)এসইও
- সার্চ ইঞ্জিন যাতে পেজের বিষয় সঠিকভাবে বোঝে ও ফলাফলে দেখায়, সেজন্য পেজকে গুছিয়ে তৈরি করার কৌশল; পরিষ্কার heading ও অর্থবহ HTML এর ভিত্তি, তবে ভালো বিষয়বস্তুই মূলযেখানে শিখবেন: পর্ব ০৪পর্ব ০৫পর্ব ১৩
- Separation of concernsসেপারেশন অব কনসার্নস
- আলাদা কাজ আলাদা জায়গায় রাখার নীতি — ওয়েবে HTML-এ অর্থ ও কাঠামো, CSS-এ চেহারা, JavaScript-এ আচরণ। এতে একটি বদলালে অন্যটি ভাঙে না।যেখানে শিখবেন: পর্ব ১৬পর্ব ২৭পর্ব ৪৬
- SERP (Search Engine Results Page)সার্প
- কিছু খোঁজার পর সার্চ ইঞ্জিন যে ফলাফলের পাতা দেখায় — প্রতিটি ফলাফলে ঠিকানা, শিরোনাম (title link) আর ছোট সারাংশ (snippet) থাকেযেখানে শিখবেন: পর্ব ১৩
- Server (সার্ভার)সার্ভার
- সারাক্ষণ চালু থাকা একটি কম্পিউটার বা প্রোগ্রাম, যা request এলে ফাইল বা তথ্য পাঠিয়ে উত্তর দেয়। সাধারণত ডেটা সেন্টারে থাকেযেখানে শিখবেন: পর্ব ০১পর্ব ৫৭
- Server Side Include (SSI)সার্ভার সাইড ইনক্লুড
- ওয়েব সার্ভারের একটি পুরোনো সুবিধা: পাতা পাঠানোর আগে বিশেষ একটি comment-এর জায়গায় অন্য ফাইলের লেখা বসিয়ে দেয়। Apache-এ আজও চলে।যেখানে শিখবেন: পর্ব ১৫
- Server-side validationসার্ভার-সাইড ভ্যালিডেশন
- সার্ভারে পৌঁছানোর পর প্রতিটি তথ্য আবার যাচাই করা। ব্যবহারকারী এটা এড়াতে পারেন না, তাই নিরাপত্তা ও সঠিক তথ্যের আসল পাহারা এটাই।যেখানে শিখবেন: পর্ব ০৯পর্ব ১৫পর্ব ৫৭
- sessionStorageসেশন স্টোরেজ
- localStorage-এর মতো ব্রাউজারের ছোট key-value ভান্ডার, কিন্তু শুধু একটি ট্যাবের জন্য — ট্যাবটি বন্ধ করলেই মুছে যায়। সার্ভারে নিজে থেকে পাঠানো হয় নাযেখানে শিখবেন: পর্ব ৫৭
- setCustomValidity()সেট-কাস্টম-ভ্যালিডিটি
- JavaScript method, যা একটি ঘরে নিজের ভুল-বার্তা বসিয়ে তাকে invalid করে; ফাঁকা লেখা '' দিলে আবার valid হয়। নিজের নিয়ম (যেমন দুই পাসওয়ার্ড মেলানো) যোগ করতে ব্যবহার হয়।যেখানে শিখবেন: পর্ব ০৯
- SFTP / FTPSএসএফটিপি
- ফাইল পাঠানোর নিরাপদ, এনক্রিপ্ট করা উপায়। SFTP চলে SSH-এর ভেতর দিয়ে, FTPS হলো TLS-যুক্ত FTP; FileZilla আর WinSCP দুটোই সমর্থন করেযেখানে শিখবেন: পর্ব ৫৩
- Shadow DOMশ্যাডো ডম
- একটি element-এর সাথে জোড়া লুকানো, আলাদা DOM-গাছ, যার CSS পাতার CSS থেকে বিচ্ছিন্ন — বাইরের selector ভেতরে ঢোকে না, ভেতরেরটা বাইরে যায় না; পেরোয় শুধু উত্তরাধিকারী property, CSS variable আর ::part()যেখানে শিখবেন: পর্ব ৫২পর্ব ৫৭পর্ব ৫৮
- Shadow hostশ্যাডো হোস্ট
- যে সাধারণ element-এর সাথে একটি shadow root জোড়া আছে, যেমন <price-card>. ভেতর থেকে একে :host দিয়ে সাজানো হয়যেখানে শিখবেন: পর্ব ৫২
- Shadow rootশ্যাডো রুট
- Shadow DOM-গাছের গোড়া; attachShadow() বা declarative shadow DOM দিয়ে তৈরি হয়। mode open হলে বাইরের JavaScript el.shadowRoot দিয়ে এতে পৌঁছাতে পারেযেখানে শিখবেন: পর্ব ৫২
- Shadow treeশ্যাডো ট্রি
- ব্রাউজারের বানানো একটি লুকানো কপি-গাছ। <use> যে আকার দেখায়, তা আসলে এমন একটি কপি — পাতার CSS selector সেখানে পৌঁছায় না, শুধু উত্তরাধিকারে পাওয়া property (যেমন color, fill) আর CSS variable ভেতরে যায়যেখানে শিখবেন: পর্ব ৪৪
- shape-outsideশেপ-আউটসাইড
- float দেওয়া বাক্সের চারপাশে লেখা কোন আকৃতি ধরে ঘুরবে, তা বলার CSS property — যেমন circle(50%) দিলে লেখা গোল বাঁক ধরে বয়যেখানে শিখবেন: পর্ব ২৩পর্ব ৫৭
- Shorthand propertyশর্টহ্যান্ড প্রপার্টি
- এক লাইনে কয়েকটি property-র মান লেখার সংক্ষিপ্ত রূপ — যেমন margin একাই margin-top, margin-right, margin-bottom আর margin-left সেট করে। না লেখা অংশগুলোও ডিফল্টে ফিরে যায়।যেখানে শিখবেন: পর্ব ১৯পর্ব ২২পর্ব ৩৮
- Siblingসিবলিং
- একই parent-এর child — অর্থাৎ ভাইবোন element. এদের ক্রম গুরুত্বপূর্ণযেখানে শিখবেন: পর্ব ০৩পর্ব ১৭
- sibling-index()সিবলিং ইনডেক্স
- নতুন CSS ফাংশন, যা বলে দেয় একটি element তার parent-এর ভেতরে কত নম্বর child (১ থেকে শুরু). এর সাথী sibling-count() মোট child-এর সংখ্যা দেয়; এখনো অল্প কিছু ব্রাউজারে আছেযেখানে শিখবেন: পর্ব ৩৭
- Single responsibilityসিঙ্গেল রেসপন্সিবিলিটি
- প্রতিটি অংশের দায়িত্ব একটিই — এই নীতি। CSS-এ যেমন .card শুধু কার্ডের চেহারা ঠিক করে, পাতায় কোথায় বসবে তা চারপাশের layout-এর কাজ।যেখানে শিখবেন: পর্ব ৪৬
- Single-page application (SPA)সিঙ্গল-পেজ অ্যাপ্লিকেশন
- একবার একটি পাতা নামিয়ে তারপর JavaScript দিয়ে ভেতরের অংশ বদলে বদলে নতুন “পাতা” দেখানো ওয়েব অ্যাপ।যেখানে শিখবেন: পর্ব ১৫পর্ব ৫২
- Sitemapসাইটম্যাপ
- সাইটের পাতাগুলোর মানচিত্র — দুই অর্থে: পরিকল্পনার সময় কোন পাতা থাকবে আর কোনটি কার নিচে তার নকশা; আর sitemap.xml, সাইটের গুরুত্বপূর্ণ পাতাগুলোর ঠিকানার একটি XML তালিকা, যা সার্চ ইঞ্জিনকে নতুন বা লুকানো পাতা খুঁজে পেতে সাহায্য করেযেখানে শিখবেন: পর্ব ১৩পর্ব ১৫পর্ব ৫৩
- Situational disability (পরিস্থিতিগত প্রতিবন্ধিতা)সিচুয়েশনাল ডিজঅ্যাবিলিটি
- পরিস্থিতির কারণে সাময়িকভাবে কোনো ক্ষমতা কমে যাওয়া — যেমন কড়া রোদে পর্দা দেখতে না পারা, এক হাতে ব্যাগ থাকায় অন্য হাতে ফোন চালানো, বা ভিড়ের বাসে শব্দ শুনতে না পারাযেখানে শিখবেন: পর্ব ১২পর্ব ৫৭
- Size containmentসাইজ কনটেইনমেন্ট
- ব্রাউজারকে দেওয়া একটি প্রতিশ্রুতি যে element-এর মাপ তার ভেতরের জিনিসের ওপর নির্ভর করবে না। container-type দিলে এটি আপনা-আপনি চালু হয়, তাই ভেতরের নিয়ম বদলালেও পাত্রের মাপ বদলায় না এবং হিসাবের চক্র তৈরি হয় নাযেখানে শিখবেন: পর্ব ৩১পর্ব ৪৯পর্ব ৫৪
- sizes attributeসাইজেস
- <img>-এ লেখা আন্দাজ, পাতায় ছবির ঘর কত চওড়া হবে — যেমন (min-width: 900px) 33vw, 100vw. প্রথম মেলা শর্তের চওড়া নেওয়া হয়; না দিলে ধরা হয় 100vw.যেখানে শিখবেন: পর্ব ৩২পর্ব ৫৪পর্ব ৫৭
- Skeleton screenস্কেলেটন স্ক্রিন
- লোড হওয়ার সময় আসল বিষয়ের জায়গায় ধূসর রূপরেখা দেখানো, যাতে ব্যবহারকারী বোঝেন কোথায় কী আসছে আর অপেক্ষা কম মনে হয়যেখানে শিখবেন: পর্ব ৩৯পর্ব ৫৯
- Skip linkস্কিপ লিংক
- পাতার একদম প্রথম লিংক, যেমন “মূল অংশে যান”, যা মেনু পেরিয়ে সরাসরি <main>-এ লাফ দেয়। সাধারণত লুকানো থাকে আর Tab চাপলে দেখা যায়।যেখানে শিখবেন: পর্ব ১০পর্ব ১২পর্ব ১৫
- Slugস্লাগ
- URL-এর শেষের ছোট, পড়া যায় এমন অংশ যা পাতার বিষয় বোঝায়, যেমন bangla-on-the-web; সাধারণত ছোট হাতের ইংরেজি অক্ষর আর হাইফেনে লেখা হয়যেখানে শিখবেন: পর্ব ১৪
- SMACSSস্ম্যাকস
- Scalable and Modular Architecture for CSS — Jonathan Snook-এর পদ্ধতি, যেখানে প্রতিটি নিয়ম পাঁচ বিভাগের একটিতে পড়ে: base, layout, module, state, theme.যেখানে শিখবেন: পর্ব ৪৬
- Snapportস্ন্যাপপোর্ট
- scroll container-এর দেখা যাওয়া অংশ থেকে scroll-padding বাদ দিয়ে যে এলাকা থাকে; snap-এর খাঁজ এর কিনারা বা মাঝখানের সাথে মেলানো হয়যেখানে শিখবেন: পর্ব ৪২
- Snapshot (স্ন্যাপশট)স্ন্যাপশট
- কোনো এক মুহূর্তে পুরো প্রজেক্ট যেমন ছিল, তার হুবহু সংরক্ষিত ছবিযেখানে শিখবেন: পর্ব ৫৩
- Source mapসোর্স ম্যাপ
- একটি .map ফাইল, যা চূড়ান্ত (compile বা minify করা) ফাইলের প্রতিটি অংশ মূল ফাইলের কোন লাইন থেকে এসেছে তা মনে রাখে; DevTools এটি পড়ে আপনাকে মূল .scss লাইন দেখায়যেখানে শিখবেন: পর্ব ৫০
- Source order (order of appearance)সোর্স অর্ডার
- CSS কোন ক্রমে লেখা বা লোড হয়েছে। cascade-এর বাকি সব ধাপে সমান হলে পরে আসা declaration জেতে।যেখানে শিখবেন: পর্ব ১৮
- Spacer GIFস্পেসার জিআইএফ
- পুরোনো দিনের কৌশল — এক পিক্সেলের স্বচ্ছ ছবি, যাকে বড়-ছোট করে টেবিল-লেআউটে ফাঁকা জায়গা তৈরি করা হতো। CSS-এর margin ও padding আসার পর অপ্রয়োজনীয়।যেখানে শিখবেন: পর্ব ০৭
- Spacing scaleস্পেসিং স্কেল
- ইচ্ছেমতো মাপের বদলে আগে থেকে ঠিক করা কয়েকটি ফাঁকের ধাপ, যেমন 0.25rem, 0.5rem, 0.75rem, 1.25rem, 2rem. সব margin, padding আর gap এই ধাপ থেকে নিলে পাতায় একটা ছন্দ আসে।যেখানে শিখবেন: পর্ব ৫৪পর্ব ৫৯
- span (grid)স্প্যান
- grid-column বা grid-row-এ span 2 লিখলে item দুটি কলাম বা সারি জুড়ে বসে — যেমন গ্যালারির বড় ছবি।যেখানে শিখবেন: পর্ব ২৯পর্ব ৫৯
- Specificityস্পেসিফিসিটি
- একটি selector কতটা নির্দিষ্ট, তার মাপ — id, class-জাতীয় আর type-জাতীয় অংশ আলাদা তিন ঘরে গোনা হয়। একই element-এ দুটি নিয়ম লড়লে বেশি specificity-র নিয়ম জেতে।যেখানে শিখবেন: পর্ব ১৭পর্ব ১৮পর্ব ৩০
- Sprite sheetস্প্রাইট শিট
- একটি ছবিতে পাশাপাশি সাজানো অনেকগুলো অ্যানিমেশন-ফ্রেম, সিনেমার ফিল্ম-রিলের মতো। background-position-কে steps() দিয়ে সরালে প্রতিবার ঠিক একটি ফ্রেম দেখা যায়যেখানে শিখবেন: পর্ব ৩৮
- srcsetএস-আর-সি-সেট
- <img> বা <source>-এর attribute, যেখানে একই ছবির কয়েকটি ফাইলের তালিকা থাকে — প্রতিটির পাশে ঘনত্ব (1x, 2x) বা আসল চওড়া (400w) লেখা থাকে। ব্রাউজার পর্দা দেখে এর মধ্যে একটি বেছে নেয়; এটি পরামর্শ, আদেশ নয়।যেখানে শিখবেন: পর্ব ৩২পর্ব ৪৯পর্ব ৫৪
- sRGBএস-আরজিবি
- সাধারণ কম্পিউটার আর ফোনের পর্দার মানক রঙের জগৎ। hex, rgb() আর hsl() দিয়ে লেখা সব রং এর ভেতরেই থাকেযেখানে শিখবেন: পর্ব ২০
- SSH key (এসএসএইচ কি)এসএসএইচ কি
- একজোড়া গাণিতিক চাবি — public key সার্ভারে (যেমন GitHub-এ) দেওয়া হয়, private key শুধু আপনার কম্পিউটারে থাকে। পাসওয়ার্ড ছাড়াই নিরাপদে পরিচয় প্রমাণ করেযেখানে শিখবেন: পর্ব ৫৩
- Stacking contextস্ট্যাকিং কনটেক্সট
- CSS-এ element-গুলোর ওপর-নিচ ক্রমের একটি আলাদা দল। transform, একের কম opacity, বা position-এর সাথে z-index-এর মতো কিছু বৈশিষ্ট্য একটি নতুন দল বানায়, আর দলের ভেতরের element যত বড় z-index-ই পাক, দলের বাইরে উঠতে পারে না।যেখানে শিখবেন: পর্ব ১১পর্ব ২০পর্ব ২৪
- Staging area (index, স্টেজিং)স্টেজিং এরিয়া
- পরের commit-এ কোন কোন পরিবর্তন যাবে, তার বাছাই করা তালিকা। git add দিয়ে এখানে তোলা হয়যেখানে শিখবেন: পর্ব ৫৩
- Standards mode (no-quirks mode)স্ট্যান্ডার্ডস মোড
- যে অবস্থায় ব্রাউজার HTML ও CSS-এর আধুনিক, সঠিক নিয়মে পাতা আঁকে। <!doctype html> থাকলে এটি চালু হয়যেখানে শিখবেন: পর্ব ০৩পর্ব ১৯পর্ব ৫৭
- STAR methodস্টার মেথড
- অভিজ্ঞতা বা প্রজেক্টের গল্প গুছিয়ে বলার একটি কাঠামো: Situation (প্রেক্ষাপট), Task (আপনার দায়িত্ব), Action (আপনি কী করলেন) আর Result (কী ফল হলো).যেখানে শিখবেন: পর্ব ৫৭পর্ব ৫৮
- Stat cardস্ট্যাট কার্ড
- ড্যাশবোর্ডের ছোট বাক্স, যাতে একটি মূল সংখ্যা আর তার নাম থাকে — যেমন “আজকের আবেদন ৪৮”।যেখানে শিখবেন: পর্ব ২৯
- State class (is-)স্টেট ক্লাস
- কোনো element-এর অবস্থা বোঝানো class, যেমন .is-open, .is-active, .is-hidden — সাধারণত JavaScript বা ব্যবহারকারীর কাজে যোগ হয় ও সরে।যেখানে শিখবেন: পর্ব ৪৬
- Static positionস্ট্যাটিক পজিশন
- absolute বাক্স flow-এ থাকলে যেখানে বসত, সেই জায়গা। top বা left-এর মতো কোনো offset না দিলে absolute বাক্স এখানেই দেখা যায়, যদিও flow-এ আর জায়গা নেয় না।যেখানে শিখবেন: পর্ব ২৪
- Static site (স্ট্যাটিক সাইট)স্ট্যাটিক সাইট
- যে সাইটের প্রতিটি পাতা আগে থেকেই তৈরি ফাইল হিসেবে সার্ভারে থাকে এবং হুবহু পাঠানো হয় — সবাই একই পাতা পায়। দ্রুত, সস্তা ও নিরাপদযেখানে শিখবেন: পর্ব ০১পর্ব ১৫পর্ব ৫৩
- Static site generator (SSG)স্ট্যাটিক সাইট জেনারেটর
- একটি টুল, যা template আর লেখার ফাইল থেকে আগেই সব পূর্ণ HTML পাতা বানিয়ে দেয়; সার্ভারে যায় শুধু তৈরি পাতা। যেমন Jekyll, Hugo, Eleventy, Astro.যেখানে শিখবেন: পর্ব ১৫পর্ব ৫৭
- Status codeস্ট্যাটাস কোড
- HTTP response-এর তিন অঙ্কের সংখ্যা, যা ফলাফল জানায়: 200 মানে ঠিক আছে, 301 মানে স্থায়ীভাবে সরে গেছে, 404 মানে পাওয়া যায়নি, 500 মানে সার্ভারের ভেতরে গোলমালযেখানে শিখবেন: পর্ব ০১পর্ব ৫৭
- Stepped-value function (round, mod, rem)স্টেপড ভ্যালু ফাংশন
- মানকে নির্দিষ্ট ধাপে মেলানোর CSS function: round() কাছের গুণিতকে গোল করে, mod() আর rem() ভাগশেষ দেয়। ২০২৪ সালে Baseline Newly available হয়েছে।যেখানে শিখবেন: পর্ব ৩৫
- steps()স্টেপস ফাংশন
- যে timing function পথকে কয়েকটি সমান ধাপে ভাগ করে প্রতিটি ধাপে এক লাফ দেয়, মাঝের মান দেখায় না। jump-start, jump-end, jump-none, jump-both দিয়ে লাফের মুহূর্ত ঠিক হয়; টাইপরাইটার আর sprite animation-এ কাজে লাগেযেখানে শিখবেন: পর্ব ৩৮পর্ব ৩৯
- Storybookস্টোরিবুক
- একটি ওপেন-সোর্স টুল, যেখানে প্রতিটি UI component আলাদাভাবে, তার সব অবস্থায় খুলে দেখা, নথিভুক্ত করা আর পরীক্ষা করা যায়।যেখানে শিখবেন: পর্ব ৪৬
- Stretched linkস্ট্রেচড লিংক
- কার্ডের শিরোনামের লিংকে একটি ::after বসিয়ে position: absolute আর inset: 0 দিয়ে পুরো কার্ড ঢেকে দেওয়ার কৌশল। পুরো কার্ড চাপা যায়, কিন্তু লিংকের নাম থাকে শুধু শিরোনামটুকু।যেখানে শিখবেন: পর্ব ৫৪
- strokeস্ট্রোক
- SVG আকারের কিনারা বরাবর টানা রেখা — যেন কলম দিয়ে আকারের চারপাশে দাগ দেওয়া। মোটা হবে কত (stroke-width), মাথা কেমন (stroke-linecap), কোণ কেমন (stroke-linejoin) — সবই আলাদা করে বলা যায়যেখানে শিখবেন: পর্ব ৪৪
- stroke-dasharray / stroke-dashoffsetস্ট্রোক ড্যাশঅ্যারে
- রেখাকে দাগ-ফাঁক-দাগ নকশায় ভাঙার নিয়ম, যেমন "12 6" মানে ১২ ঘর দাগ, ৬ ঘর ফাঁক। dashoffset সেই নকশাকে রেখা বরাবর সরায় — দুটো মিলিয়ে রেখা নিজে আঁকা হওয়ার অ্যানিমেশন বানানো যায়যেখানে শিখবেন: পর্ব ৪৪
- Structural pseudo-classস্ট্রাকচারাল সিউডো-ক্লাস
- DOM গাছে element-এর অবস্থান দেখে বাছাই করা pseudo-class, যেমন :first-child, :nth-child(), :nth-of-type(), :empty আর :rootযেখানে শিখবেন: পর্ব ৩৪
- Structured dataস্ট্রাকচার্ড ডেটা
- পাতার বিষয়বস্তুর যন্ত্র-পাঠযোগ্য, নির্দিষ্ট ছকে লেখা বর্ণনা — যেমন “এটি একটি Product, দাম ৫০০ টাকা”। সার্চ ইঞ্জিনকে নিশ্চিত হয়ে বুঝতে আর rich result দেখাতে সাহায্য করেযেখানে শিখবেন: পর্ব ১৩
- Style guide (code)স্টাইল গাইড
- দলের লিখিত নিয়মের খাতা — class-এর নাম কীভাবে, কোন উপসর্গ, কোন layer, কী নিষেধ — যাতে সবাই একইভাবে CSS লেখেন।যেখানে শিখবেন: পর্ব ৪৬
- Style invalidationস্টাইল ইনভ্যালিডেশন
- DOM বা class বদলালে ব্রাউজার কোন কোন element-এর স্টাইল আবার হিসাব করতে হবে তা চিহ্নিত করার ব্যবস্থা — যাতে পুরো পাতা নয়, শুধু দরকারি অংশ আবার যাচাই হয়যেখানে শিখবেন: পর্ব ৩৪
- Style queryস্টাইল কোয়েরি
- @container style(--x: y) ধরনের শর্ত, যা পাত্রের মাপ নয়, তার কোনো custom property-র মান দেখে নিয়ম চালু করে। দীর্ঘদিন সব ব্রাউজারে ছিল না, তাই Baseline ধরে নেবেন না — Can I use দেখে নিন।যেখানে শিখবেন: পর্ব ৩১
- Style recalculationস্টাইল রিক্যালকুলেশন
- DOM বা class বদলালে কোন element-এ কোন CSS নিয়ম খাটে আর চূড়ান্ত মান কী, তা ব্রাউজারের নতুন করে হিসাব করা। DevTools-এর Performance প্যানেলে “Recalculate Style” নামে দেখা যায়।যেখানে শিখবেন: পর্ব ১৭পর্ব ৩৩পর্ব ৩৮
- style.setProperty()সেট-প্রপার্টি
- JavaScript method, যা element-এর inline style-এ একটি property বসায়; ড্যাশওয়ালা custom property-র জন্য এটিই উপায়, যেমন el.style.setProperty('--gap', '24px')যেখানে শিখবেন: পর্ব ৩৩পর্ব ৫২
- Stylelintস্টাইললিন্ট
- CSS-এর জনপ্রিয় linter — কোড পড়ে নিয়মভঙ্গ আর সম্ভাব্য ভুল খোঁজে, যেমন id selector, !important, ভারী selector, ভুল নামের ধরন বা অচেনা property.যেখানে শিখবেন: পর্ব ৪৬পর্ব ৫৮
- Styles paneস্টাইলস প্যান
- DevTools-এর Elements প্যানেলের পাশের অংশ, যা বেছে নেওয়া element-এ লাগা সব CSS নিয়ম শক্তির ক্রমে দেখায় — কোনটি জিতেছে, কোনটি কাটা গেছে, কোনটি invalid বা inactive; এখানেই মান বদলে সাথে সাথে ফল দেখা যায়যেখানে শিখবেন: পর্ব ৪৭
- subgridসাবগ্রিড
- grid-template-columns বা grid-template-rows-এর একটি মান, যা দিয়ে ভেতরের grid নিজের ছক না বানিয়ে বাইরের (parent) grid-এর লাইনগুলো ব্যবহার করেযেখানে শিখবেন: পর্ব ২৭পর্ব ২৮পর্ব ২৯
- Subpixel (ভগ্নাংশ পিক্সেল)সাবপিক্সেল
- এক পিক্সেলের ভগ্নাংশ মাপের অবস্থান, যেমন 100.5px. transform-এ এমন মান এলে লেখা বা কিনারা দুই পিক্সেলের মাঝখানে পড়ে, আর কিছু ব্রাউজার বা স্ক্রিনে একটু ঝাপসা দেখাতে পারে।যেখানে শিখবেন: পর্ব ৪০
- Subsequent-sibling combinator (~)সাবসিকোয়েন্ট সিবলিং কম্বিনেটর
- ~ চিহ্ন, যেমন h2 ~ p — একই parent-এর নিচে বাঁয়েরটির পরে আসা সব ভাই-বোন, যারা ডানের শর্ত মানে। আগে একে general sibling combinator বলা হতো।যেখানে শিখবেন: পর্ব ১৭পর্ব ৫৭
- Success criterion (সাফল্যের শর্ত)সাকসেস ক্রাইটেরিয়ন
- WCAG-এর একটি যাচাইযোগ্য নিয়ম, নম্বর দিয়ে চেনা যায় — যেমন ১.১.১ (ছবির বিকল্প লেখা) বা ২.১.১ (কি-বোর্ডে সব কাজ). প্রতিটির একটি স্তর থাকে: A, AA বা AAAযেখানে শিখবেন: পর্ব ১২পর্ব ২৪পর্ব ৩০
- SVG (Scalable Vector Graphics)এস-ভি-জি
- লেখা (XML) আকারে আঁকার নির্দেশ দিয়ে তৈরি vector ছবির ফরম্যাট। লোগো, আইকন ও চার্টের জন্য আদর্শ; HTML-এর ভেতরে সরাসরিও লেখা যায়।যেখানে শিখবেন: পর্ব ০৬পর্ব ১৩পর্ব ৩২
- SVG coordinate system (user units)এস-ভি-জি কোঅর্ডিনেট সিস্টেম
- SVG-র আঁকার খাতার স্থানাঙ্ক। শুরু (0,0) ওপরের বাঁ কোণে, x বাড়ে ডানে আর y বাড়ে নিচে। এক “ঘর” (user unit) পর্দায় কত পিক্সেল হবে, তা ঠিক করে viewBox আর width/heightযেখানে শিখবেন: পর্ব ৪৪
- SVG spriteএস-ভি-জি স্প্রাইট
- অনেকগুলো আইকনকে <symbol> হিসেবে একটি SVG-তে জমা রাখা, তারপর দরকারমতো <use href="#id"> দিয়ে যেকোনোটি দেখানো। এক জায়গায় সব আইকন, পাতায় শুধু ডাকযেখানে শিখবেন: পর্ব ৪৪
- SVGOএস-ভি-জি-ও
- SVG ফাইল ছোট করার জনপ্রিয় open-source টুল (Node.js-এ চলে). ডিজাইন সফটওয়্যারের রেখে যাওয়া বাড়তি তথ্য, মন্তব্য আর অপ্রয়োজনীয় দশমিক মুছে ফাইলের আকার অনেক কমায়। ব্রাউজারে চালানোর রূপ SVGOMGযেখানে শিখবেন: পর্ব ৪৪
T
- Tab order (ট্যাব অর্ডার)ট্যাব অর্ডার
- Tab কী চাপলে focus যে ক্রমে এক element থেকে আরেকটিতে যায়। সাধারণত HTML-এ লেখার ক্রমই tab orderযেখানে শিখবেন: পর্ব ১২পর্ব ২৫পর্ব ২৬
- tabindexট্যাব-ইনডেক্স
- focus-এর নিয়ম বদলানোর attribute: 0 দিলে Tab-এর স্বাভাবিক ক্রমে আসে, -1 দিলে Tab-এ আসে না কিন্তু স্ক্রিপ্টে focus দেওয়া যায়; ধনাত্মক মান ক্রম ভাঙে বলে এড়াতে হয়যেখানে শিখবেন: পর্ব ১২পর্ব ৪২পর্ব ৫৭
- Tabnabbingট্যাবন্যাবিং
- নতুন ট্যাবে খোলা পাতা window.opener দিয়ে পেছনের ট্যাবটিকে চুপিচুপি নকল পাতায় বদলে দেওয়ার প্রতারণা। rel="noopener" আর আধুনিক ব্রাউজারের ডিফল্ট আচরণ এটি ঠেকায়।যেখানে শিখবেন: পর্ব ০৫পর্ব ৫৭পর্ব ৫৮
- Tag (ট্যাগ)ট্যাগ
- কোণাকার বন্ধনীতে লেখা HTML-এর চিহ্ন, যেমন <p> (শুরু) আর </p> (শেষ). দুটির মাঝের লেখা সেই element-এর অংশযেখানে শিখবেন: পর্ব ০১পর্ব ০৩পর্ব ৫৭
- Tailwind CSSটেইলউইন্ড সিএসএস
- Adam Wathan-এর তৈরি (প্রথম প্রকাশ ২০১৭) utility-first CSS framework. তৈরি component দেয় না; p-4, flex, md:p-10-এর মতো ছোট class দেয়, আর build টুল শুধু ব্যবহৃত class-এর CSS তৈরি করে।যেখানে শিখবেন: পর্ব ৫১পর্ব ৫৬পর্ব ৫৭
- Take-home assignmentটেক-হোম অ্যাসাইনমেন্ট
- বাড়িতে বসে কয়েক ঘণ্টা বা কয়েক দিনে করে জমা দেওয়ার একটি কাজ, যেমন একটি নকশা দেখে পাতা বানানো। পরে সাধারণত কোড আর সিদ্ধান্তগুলো নিয়ে আলোচনা হয়।যেখানে শিখবেন: পর্ব ৫৮পর্ব ৫৯
- tel: linkটেল লিংক
- ক্লিক করলে ফোনের ডায়াল-প্যাডে নম্বর বসিয়ে দেয় এমন লিংক; নম্বর আন্তর্জাতিক রূপে লেখা ভালো, যেমন +8801712345678.যেখানে শিখবেন: পর্ব ০৫
- Template (partial)টেমপ্লেট
- পাতার বারবার আসা অংশ (যেমন header বা footer) একটি আলাদা ফাইলে রাখা ছাঁচ; সার্ভার বা build টুল সেটি প্রতিটি পাতায় বসিয়ে পূর্ণ HTML বানায়।যেখানে শিখবেন: পর্ব ১৫
- Terminal (টার্মিনাল)টার্মিনাল
- লেখা কমান্ড দিয়ে কম্পিউটার চালানোর জানালা। Windows-এ PowerShell বা Git Bash, Mac ও Linux-এ Terminalযেখানে শিখবেন: পর্ব ৫৩
- Text shapingটেক্সট শেপিং
- অক্ষরের নম্বরের সারি থেকে ফন্টের সঠিক আকার (glyph) বেছে, জোড়া লাগিয়ে, জায়গা বদলে পর্দায় সাজানোর কাজ। বাংলার কার আর যুক্তাক্ষর এর ওপর নির্ভর করেযেখানে শিখবেন: পর্ব ১৪
- Text Spacing (WCAG 1.4.12)টেক্সট স্পেসিং
- WCAG-এর AA শর্ত: ব্যবহারকারী line-height লেখার মাপের ১.৫ গুণ, অনুচ্ছেদের পরের ফাঁক ২ গুণ, letter-spacing ০.১২ গুণ আর word-spacing ০.১৬ গুণ করলেও কোনো লেখা বা কাজ কেটে, ঢেকে বা হারিয়ে যাবে না।যেখানে শিখবেন: পর্ব ৪৫
- text-overflowটেক্সট ওভারফ্লো
- কাটা পড়া এক লাইনের লেখার শেষে কী দেখাবে, তা ঠিক করার CSS property; ellipsis দিলে “…” বসে, তবে সাথে white-space: nowrap আর overflow: hidden লাগেযেখানে শিখবেন: পর্ব ২৩পর্ব ২৫
- text-wrapটেক্সট-র্যাপ
- লাইন কীভাবে ভাঙবে তা ঠিক করার CSS property; balance শিরোনামের লাইনগুলো সমান দৈর্ঘ্যের করে, pretty অনুচ্ছেদের শেষে একা শব্দ এড়ায়যেখানে শিখবেন: পর্ব ২১পর্ব ৩৫পর্ব ৫৪
- textareaটেক্সট-এরিয়া
- কয়েক লাইনের লেখার ঘর, যেমন ঠিকানা বা মতামত। শুরুর লেখা বসে খোলা আর বন্ধ ট্যাগের মাঝে, আর সেখানের ফাঁকা জায়গা হুবহু থাকে।যেখানে শিখবেন: পর্ব ০৯পর্ব ৩৭
- textContentটেক্সট কনটেন্ট
- element-এর ভেতরের সব লেখা; এতে কিছু বসালে সেটি নিছক লেখা হিসেবেই বসে, HTML হিসেবে পার্স হয় না — তাই ব্যবহারকারীর দেওয়া লেখা বসানোর নিরাপদ উপায়যেখানে শিখবেন: পর্ব ৫২
- Thematic break (<hr>)থিম্যাটিক ব্রেক
- লেখার ভেতরে প্রসঙ্গ বা দৃশ্য বদলের চিহ্ন; HTML-এ <hr> এই অর্থ বহন করে, যদিও ব্রাউজার একে আনুভূমিক দাগ হিসেবে দেখায়যেখানে শিখবেন: পর্ব ০৪
- theme-colorথিম কালার
- <meta name="theme-color"> — কিছু ব্রাউজারকে (যেমন Android-এর Chrome) অ্যাড্রেস বার বা চারপাশের রং কী হবে তা জানায়। সব ব্রাউজার মানে না; না মানলে কোনো ক্ষতি নেইযেখানে শিখবেন: পর্ব ১৩পর্ব ৩৬
- Theming (থিম)থিমিং
- একই HTML আর component রেখে শুধু কয়েকটি token-এর মান বদলে পুরো সাইট বা একটি অংশের চেহারা বদলানো — যেমন light আর dark থিম, বা ভিন্ন ব্র্যান্ডের রংযেখানে শিখবেন: পর্ব ৩৩
- Think aloudথিংক অ্যালাউড
- সমস্যা সমাধানের সময় নিজের ভাবনার ধাপগুলো জোরে বলা, যাতে পরীক্ষক বা ইন্টারভিউয়ার আপনার যুক্তির পথ দেখতে পান — উত্তর পুরো ঠিক না হলেও।যেখানে শিখবেন: পর্ব ৫৭পর্ব ৫৮পর্ব ৫৯
- Third-party scriptথার্ড-পার্টি স্ক্রিপ্ট
- অন্য কোম্পানির সার্ভার থেকে আসা JavaScript — যেমন বিজ্ঞাপন, analytics, চ্যাট উইজেট বা সোশ্যাল বোতাম। এর আকার, গতি আর আচরণ সাইটের মালিকের হাতে থাকে নাযেখানে শিখবেন: পর্ব ৪৯
- timeline-scopeটাইমলাইন স্কোপ
- একটি named timeline-এর নামকে কোনো পূর্বপুরুষ element-এর পুরো এলাকায় দৃশ্যমান করার CSS property, যাতে ভাই-বোন বা দূরের element-ও সেই timeline ব্যবহার করতে পারেযেখানে শিখবেন: পর্ব ৪২
- Timing function (easing)টাইমিং ফাংশন
- সময়ের সাথে পরিবর্তনের গতির ধরন — কোথায় দ্রুত, কোথায় ধীর। যেমন ease, linear, ease-in-out, cubic-bezier(), steps()যেখানে শিখবেন: পর্ব ৩৮পর্ব ৩৯
- title (<title>)টাইটেল
- পাতার নাম — ব্রাউজারের ট্যাবে, বুকমার্কে আর সার্চ ফলাফলের নীল শিরোনামে দেখায়; screen reader পাতা খুললে প্রথমে এটি পড়ে। প্রতিটি HTML পাতায় একটি থাকা বাধ্যতামূলকযেখানে শিখবেন: পর্ব ১৩
- TLS/SSL certificateএসএসএল সার্টিফিকেট
- একটি ডিজিটাল পরিচয়পত্র, যা প্রমাণ করে সার্ভারটি সত্যিই ওই domain-এর, আর HTTPS-এর এনক্রিপশন চালু করে। নির্দিষ্ট মেয়াদ শেষে নবায়ন করতে হয়যেখানে শিখবেন: পর্ব ৫৩
- Tofu (□)টোফু
- ফন্টে কোনো অক্ষরের আকার না থাকলে যে ফাঁকা চারকোনা বাক্স দেখা যায়। Google-এর Noto (No more tofu) ফন্ট পরিবারের নাম এখান থেকেইযেখানে শিখবেন: পর্ব ১৪পর্ব ২১পর্ব ৪৭
- Toggle switch (অন-অফ সুইচ)টগল সুইচ
- চাপামাত্র কোনো সেটিং চালু বা বন্ধ করার কন্ট্রোল, ফোনের সেটিংসের মতো। ওয়েবে এটি সাধারণত role="switch" দেওয়া একটি আসল checkbox, যা CSS দিয়ে সুইচের মতো আঁকা হয়; screen reader তখন on বা off বলেযেখানে শিখবেন: পর্ব ৪৩
- Tooltipটুলটিপ
- কোনো বোতাম বা শব্দে মাউস রাখলে বা focus দিলে পাশে দেখানো ছোট ব্যাখ্যার বাক্স। শুধু hover নয়, কীবোর্ডের focus-এও দেখানো উচিত।যেখানে শিখবেন: পর্ব ২৪পর্ব ৫৯
- Top layerটপ লেয়ার
- পাতার সব element-এর ওপরে ব্রাউজারের একটি বিশেষ আঁকার স্তর। modal dialog, popover আর fullscreen element এখানে ওঠে, তাই কোনো z-index বা overflow: hidden তাদের ঢাকতে বা কাটতে পারে নাযেখানে শিখবেন: পর্ব ১১পর্ব ২৪পর্ব ৩৪
- Touch target (চাপার জায়গা)টাচ টার্গেট
- লিংক বা বোতামের যে অংশে আঙুল বা মাউস দিয়ে চাপলে কাজ হয়। WCAG 2.2-এর 2.5.8 অনুযায়ী অন্তত 24×24 CSS px (বা যথেষ্ট ফাঁক); কাজের জন্য 44–48px ভালো।যেখানে শিখবেন: পর্ব ৩০পর্ব ৩৮পর্ব ৪৩
- Trade-offট্রেড-অফ
- একটি সুবিধা পেতে আরেকটি কিছু ছাড়ার হিসাব। যেমন Tailwind কাজ দ্রুত করে, কিন্তু HTML ভারী করে। ভালো উত্তরে সিদ্ধান্তের সাথে তার দামও বলা হয়।যেখানে শিখবেন: পর্ব ৫৮
- transformট্রান্সফর্ম
- যে CSS property দিয়ে একটি element-কে সরানো, ঘোরানো, বড়-ছোট বা হেলানো যায়, আশপাশের লেআউট না বদলে। none ছাড়া যেকোনো মান নতুন stacking context বানায় এবং ভেতরের fixed ও absolute বাক্সের containing block হয়ে যায়।যেখানে শিখবেন: পর্ব ২৪পর্ব ৩৮পর্ব ৪০
- Transform functionট্রান্সফর্ম ফাংশন
- transform property-র মানের ভেতরে লেখা এক একটি বদলের নির্দেশ — যেমন translate(), rotate(), scale(), skew(), perspective(). একাধিক ফাংশন ফাঁকা জায়গা দিয়ে পরপর লেখা যায়, আর তাদের ক্রমে ফল বদলায়।যেখানে শিখবেন: পর্ব ৪০
- transform-originট্রান্সফর্ম অরিজিন
- যে CSS property ঠিক করে rotate, scale আর skew কোন বিন্দু ঘিরে ঘটবে। ডিফল্ট মান 50% 50%, অর্থাৎ element-এর ঠিক মাঝখান; দরজার কবজার মতো কিনারা বা কোণও দেওয়া যায়।যেখানে শিখবেন: পর্ব ৪০পর্ব ৫৬
- transform-style: preserve-3dপ্রিজার্ভ থ্রি-ডি
- যে মান দিলে element-এর সন্তানরা একটি সমতলে চ্যাপ্টা না হয়ে একই 3D জগতে নিজের গভীরতা নিয়ে থাকে। কার্ড ফ্লিপ আর কিউবে মোড়কে এটি লাগে; overflow, opacity বা filter-এর মতো property থাকলে এটি নিজে থেকেই বন্ধ হয়ে যায়।যেখানে শিখবেন: পর্ব ৪০
- Transformation matrix — matrix()ট্রান্সফরমেশন ম্যাট্রিক্স
- সংখ্যার একটি ছক, যাতে সরানো, ঘোরানো, বড়-ছোট আর হেলানো সব একসাথে লেখা থাকে। ব্রাউজার সব transform ফাংশন গুণ করে একটি matrix বানায়; 2D-তে matrix(a, b, c, d, e, f), 3D-তে matrix3d() — ১৬টি সংখ্যা।যেখানে শিখবেন: পর্ব ৪০
- transition-behaviorট্রানজিশন বিহেভিয়র
- যে property বলে দেয় discrete property (যেমন display) transition-এ যোগ দেবে কি না। allow-discrete দিলে যোগ দেয় আর সময়ের মাঝপথে এক লাফে বদলায়; display-এর বেলায় দৃশ্যমান অবস্থা পুরো সময় ধরে থাকে। Baseline Newly available (২০২৪)যেখানে শিখবেন: পর্ব ৩৮
- transitionend eventট্রানজিশন-এন্ড ইভেন্ট
- একটি CSS transition শেষ হলে element-এ পাঠানো DOM ঘটনা — প্রতিটি property-র জন্য আলাদা, event.propertyName-এ নাম থাকে। transition বাতিল হলে আসে transitioncancel; duration 0 হলে কোনো ঘটনাই আসে নাযেখানে শিখবেন: পর্ব ৩৮
- TTFB (Time to First Byte)টি-টি-এফ-বি
- অনুরোধ পাঠানোর পর সার্ভার থেকে উত্তরের প্রথম অংশ (প্রথম byte) পৌঁছাতে কত সময় লাগল। সার্ভার, নেটওয়ার্ক আর redirect-এর দেরি এর ভেতরেই ধরা পড়েযেখানে শিখবেন: পর্ব ৪৯
- TTL (Time To Live)টিটিএল
- একটি DNS উত্তর অন্যরা কতক্ষণ cache-এ রাখতে পারবে, সেকেন্ডে। এজন্যই DNS বদলের পর সবার কাছে নতুন ঠিকানা পৌঁছাতে কিছু সময় লাগেযেখানে শিখবেন: পর্ব ৫৩
- Type scale (modular scale)টাইপ স্কেল
- লেখার আকারগুলোর একটি সিঁড়ি, যেখানে প্রতিটি ধাপ আগেরটির একই অনুপাতে বড় (যেমন 1.25 গুণ) — এতে শিরোনাম আর মূল লেখার আকারে ছন্দ থাকেযেখানে শিখবেন: পর্ব ২১পর্ব ৩৩পর্ব ৫৪
- Type selectorটাইপ সিলেক্টর
- শুধু ট্যাগের নাম দিয়ে লেখা selector, যেমন p বা li — পাতার সেই ধরনের সব element ধরে। একে element selector-ও বলে।যেখানে শিখবেন: পর্ব ১৭
- Typography (টাইপোগ্রাফি)টাইপোগ্রাফি
- লেখাকে পড়ার উপযোগী আর সুন্দর করে সাজানোর কারিগরি — ফন্ট বাছাই, অক্ষরের আকার, লাইনের ফাঁক, লাইনের দৈর্ঘ্য আর লেখার স্তরবিন্যাসযেখানে শিখবেন: পর্ব ২১
U
- Unicodeইউনিকোড
- পৃথিবীর প্রায় সব লিপির প্রতিটি অক্ষরকে একটি নির্দিষ্ট নম্বর দেওয়ার আন্তর্জাতিক মান। বাংলা অক্ষরগুলোর নম্বর U+0980 থেকে U+09FF-এর মধ্যেযেখানে শিখবেন: পর্ব ১৪পর্ব ৫৭
- Unicode normalizationইউনিকোড নরমালাইজেশন
- দেখতে একই কিন্তু ভিন্ন code point-এর সারিতে লেখা লেখাকে একটি মানক রূপে আনা (NFC, NFD ইত্যাদি), যাতে তুলনা আর খোঁজা ঠিক হয়যেখানে শিখবেন: পর্ব ১৪
- unicode-rangeইউনিকোড-রেঞ্জ
- @font-face-এর একটি descriptor (ঘোষণা), যা বলে ফন্ট ফাইলটি কোন কোন অক্ষরের জন্য। পাতায় ওই অক্ষর না থাকলে ব্রাউজার ফাইলটি নামায়ই নাযেখানে শিখবেন: পর্ব ১৪পর্ব ২১পর্ব ৪৯
- Unitless numberইউনিটলেস নাম্বার
- একক ছাড়া সংখ্যা, যেমন 16 বা 1.25. variable-এ এমন সংখ্যা রেখে calc() দিয়ে 1px, 1% বা 1deg দিয়ে গুণ করলে একই সংখ্যা থেকে নানা এককের মান বানানো যায়যেখানে শিখবেন: পর্ব ৩৩
- Universal selector (*)ইউনিভার্সাল সিলেক্টর
- তারকাচিহ্ন * — যেকোনো element-কে ধরে। একা লিখলে পাতার সব element, .card * লিখলে card-এর ভেতরের সব element. এর specificity শূন্য।যেখানে শিখবেন: পর্ব ১৭পর্ব ১৮পর্ব ১৯
- Unlayered styleআনলেয়ার্ড স্টাইল
- কোনো @layer-এর ভেতরে না রাখা CSS. সাধারণ declaration-এ এটি সব layer-কে হারায়, কিন্তু !important-এ সব layer-এর important-এর কাছে হারে।যেখানে শিখবেন: পর্ব ৩৫
- Unordered list (ul)আনঅর্ডারড লিস্ট
- ক্রমহীন তালিকা — যেখানে আইটেমের ক্রম বদলালে অর্থ বদলায় না, যেমন বাজারের ফর্দ। লেখা হয় <ul> দিয়ে, ব্রাউজার বুলেট চিহ্ন দেখায়।যেখানে শিখবেন: পর্ব ০৭পর্ব ৫৭
- Unused CSS (অব্যবহৃত CSS)আনইউজড সিএসএস
- যে CSS নিয়ম পাতায় ডাউনলোড হয় কিন্তু কোনো উপাদানে খাটে না। ফাইল বড় করে আর প্রথম দেখানো দেরি করায়; DevTools-এর Coverage প্যানেলে মাপা যায়। ছাঁটাইয়ের কাজকে আগে “purge” বলা হতো।যেখানে শিখবেন: পর্ব ৫১
- Upgrade (custom element)আপগ্রেড
- define হওয়ার আগে পাতায় বসা custom element-কে ব্রাউজার যখন পরে তার আসল class-এ রূপ দেয় — constructor চলে, আগের attribute-এর খবর আসে, তারপর connectedCallbackযেখানে শিখবেন: পর্ব ৫২
- URLইউআরএল
- Uniform Resource Locator — ইন্টারনেটে কোনো পাতা বা ফাইলের পূর্ণ ঠিকানা, যেমন https://www.example.com/shop/kantha.html. এতে scheme, host, path, query, fragment থাকতে পারেযেখানে শিখবেন: পর্ব ০১পর্ব ০২পর্ব ০৫
- Use of Color (WCAG 1.4.1)ইউজ অব কালার
- WCAG-এর A স্তরের শর্ত: রং যেন কোনো তথ্যের একমাত্র সংকেত না হয়। যেমন লেখার ভেতরের লিংকে underline, ভুলের ঘরে লাল রঙের সাথে আইকন ও লেখা — যাতে বর্ণান্ধ মানুষ বা সাদা-কালো প্রিন্টেও অর্থ বোঝা যায়।যেখানে শিখবেন: পর্ব ৪৫পর্ব ৫৯
- Used valueইউজড ভ্যালু
- লেআউট হিসাবের পর চূড়ান্ত মান — যেমন width: 50% তখন আসল পিক্সেল সংখ্যায় রূপ নেয়, কারণ parent-এর চওড়া জানা যায়।যেখানে শিখবেন: পর্ব ১৮
- User preference media featureইউজার প্রেফারেন্স মিডিয়া ফিচার
- ব্যবহারকারীর নিজের পছন্দ জানার media feature-এর পরিবার — যেমন prefers-color-scheme, prefers-reduced-motion, prefers-contrast, forced-colorsযেখানে শিখবেন: পর্ব ৩৬
- User stylesheetইউজার স্টাইলশিট
- পাঠকের নিজের CSS নিয়ম — ব্রাউজারের সেটিং, extension বা অপারেটিং সিস্টেমের সুবিধা দিয়ে আসে, যেমন সব লেখা বড় করা। important হলে সাইটের CSS-কেও হারায়।যেখানে শিখবেন: পর্ব ১৮
- User-agent sniffingইউজার-এজেন্ট স্নিফিং
- ব্রাউজারের পাঠানো নাম-পরিচয়ের লেখা (navigator.userAgent) দেখে ব্রাউজার চিনে আলাদা কোড দেওয়ার পুরোনো কৌশল। এই লেখা প্রায়ই বিভ্রান্তিকর আর পুরোনো হয়ে যায়, তাই feature detection অনেক নির্ভরযোগ্যযেখানে শিখবেন: পর্ব ৪৮
- User-agent stylesheetইউজার-এজেন্ট স্টাইলশিট
- ব্রাউজারের নিজস্ব ডিফল্ট CSS, যার জন্য কোনো CSS না লিখলেও heading বড়, strong মোটা আর p-এর আগে-পরে ফাঁক দেখায়; আপনার CSS এটিকে বদলে দিতে পারেযেখানে শিখবেন: পর্ব ০৪পর্ব ১৬পর্ব ১৮
- UTF-8ইউটিএফ-এইট
- Unicode অক্ষরগুলোকে বাইটে জমা রাখার সবচেয়ে প্রচলিত নিয়ম, যাতে বাংলা, ইংরেজিসহ পৃথিবীর প্রায় সব লিপি ধরে। নতুন HTML পাতার জন্য এটিই একমাত্র সঠিক encodingযেখানে শিখবেন: পর্ব ০৩পর্ব ০৪পর্ব ১৩
V
- Validatorভ্যালিডেটর
- HTML বা CSS নিয়ম মেনে লেখা হয়েছে কি না যাচাই করার টুল। যেমন validator.w3.org — ব্রাউজার যে ভুল চুপচাপ মেরামত করে, এটি সেগুলো ধরিয়ে দেয়যেখানে শিখবেন: পর্ব ০২পর্ব ০৩পর্ব ১৫
- ValidityState (validity)ভ্যালিডিটি স্টেট
- প্রতিটি ফর্ম-ঘরের যাচাই-রিপোর্ট, JavaScript-এ element.validity দিয়ে পড়া যায় — valueMissing, typeMismatch, patternMismatch, tooShort, rangeOverflow, customError ইত্যাদি, আর সব ঠিক থাকলে valid.যেখানে শিখবেন: পর্ব ০৯
- Value (CSS)ভ্যালু
- declaration-এ কোলনের ডান দিকের অংশ — property-টির নতুন মান, যেমন crimson বা 2rem. প্রতিটি property শুধু নির্দিষ্ট ধরনের মান নেয়।যেখানে শিখবেন: পর্ব ১৬পর্ব ৫৭
- Vanishing pointভ্যানিশিং পয়েন্ট
- পরিপ্রেক্ষিতে আঁকা ছবিতে দূরে চলে যাওয়া সমান্তরাল রেখাগুলো যে বিন্দুতে গিয়ে মেলে — যেমন দিগন্তে রেললাইনের দুই পাত। CSS-এ perspective-origin এই বিন্দুর জায়গা ঠিক করে।যেখানে শিখবেন: পর্ব ৪০
- var()ভার ফাংশন
- CSS function, যা একটি custom property-র মান তুলে এনে সেই জায়গায় বসায়, যেমন color: var(--brand). কমার পরে একটি বিকল্প (fallback) মানও দেওয়া যায়: var(--brand, teal)যেখানে শিখবেন: পর্ব ৩৩পর্ব ৫৭
- Variable fontভেরিয়েবল ফন্ট
- একটি ফাইলের ভেতরে ওজন, প্রস্থ, হেলানোর মতো নকশার “অক্ষ” থাকে, আর অক্ষ ধরে যেকোনো মাঝামাঝি মান বেছে নেওয়া যায় — অনেক ফাইলের বদলে একটিযেখানে শিখবেন: পর্ব ২১পর্ব ৪৪পর্ব ৪৯
- Variant (Tailwind prefix)ভ্যারিয়েন্ট
- Tailwind class-এর সামনে বসা শর্ত, যেমন md: (একটি নির্দিষ্ট চওড়া বা তার বেশি হলে), hover:, focus-visible: বা dark:. শর্ত সত্য হলেই class-টির CSS খাটে; একাধিক variant জোড়াও যায়, যেমন md:hover:.যেখানে শিখবেন: পর্ব ৫১
- Vector imageভেক্টর ইমেজ
- রেখা, বৃত্ত, রঙের মতো আঁকার নির্দেশ দিয়ে তৈরি ছবি, যেমন SVG. যত বড়ই করা হোক, ধার ঝকঝকে থাকে।যেখানে শিখবেন: পর্ব ০৬পর্ব ৪৪
- Vendor prefixভেন্ডর প্রিফিক্স
- -webkit-, -moz- এর মতো উপসর্গ, যা দিয়ে ব্রাউজার একসময় পরীক্ষামূলক CSS চালু করত; spec স্থির হওয়ার পর বেশিরভাগই অপ্রয়োজনীয়যেখানে শিখবেন: পর্ব ২২পর্ব ২৩পর্ব ২৫
- Version control (ভার্সন কন্ট্রোল)ভার্সন কন্ট্রোল
- ফাইলের প্রতিটি পরিবর্তনের হিসাব রাখার পদ্ধতি — কে, কখন, কী বদলেছেন আর কেন। যেকোনো সময় আগের যেকোনো অবস্থায় ফিরে যাওয়া যায়যেখানে শিখবেন: পর্ব ৫৩
- Vestibular disorderভেস্টিবুলার ডিজঅর্ডার
- কানের ভেতরের ভারসাম্য-ব্যবস্থার সমস্যা। এমন মানুষের কাছে পর্দার বড় নড়াচড়া, zoom বা parallax মাথা ঘোরা, বমিভাব বা মাইগ্রেন ঘটাতে পারে — তাই prefers-reduced-motion মানা জরুরিযেখানে শিখবেন: পর্ব ৩৮পর্ব ৩৯পর্ব ৪২
- View progress timelineভিউ প্রোগ্রেস টাইমলাইন
- যে timeline একটি নির্দিষ্ট element স্ক্রল-জানালায় ঢোকা থেকে বেরিয়ে যাওয়া পর্যন্ত কতটা পথ পেরিয়েছে তা মাপে। animation-timeline: view() বা view-timeline property দিয়ে লেখা হয়যেখানে শিখবেন: পর্ব ৪২
- View Sourceভিউ সোর্স
- সার্ভার থেকে আসা HTML ফাইলের হুবহু লেখা দেখার উপায়; Ctrl+U চাপলে খোলে। ব্রাউজারের সংশোধন বা JavaScript-এর পরিবর্তন এখানে দেখা যায় নাযেখানে শিখবেন: পর্ব ০২
- View Transitionভিউ ট্রানজিশন
- ব্রাউজারের একটি ব্যবস্থা, যা পাতার পুরোনো অবস্থার ছবি আর নতুন অবস্থা পাশাপাশি রেখে দুইয়ের মাঝে মসৃণ অ্যানিমেশন চালায়। একই পাতায় document.startViewTransition() দিয়ে, আর পাতা বদলের সময় @view-transition দিয়ে চালু হয়যেখানে শিখবেন: পর্ব ৩৭পর্ব ৩৯
- viewBoxভিউবক্স
- SVG-র আঁকার খাতার নিজস্ব মাপ ও স্থানাঙ্ক, যেমন viewBox="0 0 300 120". এটি থাকলে বাইরে থেকে যেকোনো চওড়া দিলেই ছবি অনুপাত মেনে ছোট-বড় হয়।যেখানে শিখবেন: পর্ব ৩২পর্ব ৪৪পর্ব ৫৬
- Viewportভিউপোর্ট
- ব্রাউজারে পাতার যে অংশ দেখা যায়। viewport meta tag মোবাইল ব্রাউজারকে বলে পাতার চওড়া ফোনের পর্দার চওড়ার সমান ধরতেযেখানে শিখবেন: পর্ব ০৩পর্ব ১৩পর্ব ২০
- Viewport units (vw, vh)ভিউপোর্ট ইউনিটস
- ব্রাউজারের দেখা যাওয়া অংশের মাপের শতাংশ: 1vw = চওড়ার ১%, 1vh = উচ্চতার ১%, সাথে vmin আর vmaxযেখানে শিখবেন: পর্ব ২০পর্ব ৪৭
- visibilityভিজিবিলিটি
- জায়গা ধরে রেখে element অদৃশ্য করার CSS property; hidden দিলে চোখ, screen reader আর Tab — সবার কাছ থেকে লুকায়, কিন্তু লেআউটে ফাঁকা জায়গা থেকে যায়যেখানে শিখবেন: পর্ব ২৩
- Visual order vs DOM orderভিজ্যুয়াল অর্ডার
- CSS দিয়ে চোখে দেখা ক্রম (বাঁ থেকে ডানে, ওপর থেকে নিচে) আর HTML-এ লেখা ক্রম আলাদা হয়ে যাওয়া। screen reader আর কীবোর্ডের Tab দুটোই HTML-এর ক্রম মানে, তাই দুটো না মিললে ব্যবহারকারী বিভ্রান্ত হন।যেখানে শিখবেন: পর্ব ২৯পর্ব ৪৫
- Visual viewportভিজ্যুয়াল ভিউপোর্ট
- এই মুহূর্তে পর্দায় পাতার যতটুকু চোখে দেখা যাচ্ছে; zoom করলে বা ফোনের কীবোর্ড উঠলে ছোট হয়। JavaScript-এ window.visualViewport দিয়ে পড়া যায়যেখানে শিখবেন: পর্ব ২৩
- Viva (viva voce)ভাইভা
- মৌখিক পরীক্ষা — পরীক্ষক মুখে প্রশ্ন করেন, প্রার্থী মুখে উত্তর দেন, আর উত্তর থেকেই পরের প্রশ্ন আসে। লাতিন viva voce মানে “জীবন্ত কণ্ঠে”।যেখানে শিখবেন: পর্ব ৫৭
- Void elementভয়েড এলিমেন্ট
- যে element-এর content থাকে না, তাই end tag-ও লেখা হয় না — যেমন <br>, <img>, <meta>, <input>. HTML-এ এমন element মোট ১৩টিযেখানে শিখবেন: পর্ব ০৩পর্ব ০৪পর্ব ০৬
- VS Code (Visual Studio Code)ভিএস কোড
- Microsoft-এর তৈরি একটি বিনামূল্যের code editor; Windows, macOS আর Linux — তিনটিতেই চলে। HTML-CSS লেখার জন্য সবচেয়ে প্রচলিত editor-গুলোর একটিযেখানে শিখবেন: পর্ব ০২
W
- w descriptor (width descriptor)ডব্লিউ ডেসক্রিপটর
- srcset-এ ফাইলের পাশে লেখা 400w, 800w — ফাইলটির আসল চওড়া কত পিক্সেল। sizes-এর সাথে মিলিয়ে ব্রাউজার হিসাব করে কোন ফাইল নেবে।যেখানে শিখবেন: পর্ব ৩২
- W3Cডাব্লিউথ্রিসি
- World Wide Web Consortium — ১৯৯৪ সালে Tim Berners-Lee প্রতিষ্ঠিত সংস্থা, যা CSS, অ্যাক্সেসিবিলিটি (WCAG) সহ অনেক ওয়েব মানদণ্ড তৈরি করেযেখানে শিখবেন: পর্ব ০১পর্ব ১৬
- Watch modeওয়াচ মোড
- টুল চালু থেকে ফাইলের দিকে নজর রাখে; আপনি সেভ করলেই নিজে থেকে আবার compile করে — প্রতিবার কমান্ড লিখতে হয় নাযেখানে শিখবেন: পর্ব ৫০
- WCAGডব্লিউক্যাগ
- Web Content Accessibility Guidelines — W3C-র অ্যাক্সেসিবিলিটি নির্দেশিকা। বর্তমান সংস্করণ 2.2; নিয়মগুলো A, AA, AAA স্তরে ভাগ করা, আর বহু দেশের আইন ও প্রতিষ্ঠান AA স্তর মানতে বলে।যেখানে শিখবেন: পর্ব ১০পর্ব ১২পর্ব ১৩
- Web analyticsওয়েব অ্যানালিটিক্স
- সাইটে কতজন আসছেন, কোন পাতা বেশি পড়া হয়, কোথা থেকে আসছেন — এসব মাপার টুল, যেমন Google Analytics. ব্যক্তিগত তথ্য সংগ্রহের দায়িত্বও এর সাথে আসেযেখানে শিখবেন: পর্ব ৫৩
- Web Animations APIওয়েব অ্যানিমেশনস এপিআই
- JavaScript থেকে animation বানানো ও নিয়ন্ত্রণের ব্রাউজার-ব্যবস্থা — element.animate(keyframes, options), সাথে pause(), reverse(), playbackRate আর finished. CSS animation-এর মতো একই ইঞ্জিনে চলেযেখানে শিখবেন: পর্ব ৩৯
- Web Componentsওয়েব কম্পোনেন্টস
- ব্রাউজারের নিজস্ব কয়েকটি প্রযুক্তির দল — custom elements, Shadow DOM আর template/slot — যা দিয়ে কোনো লাইব্রেরি ছাড়াই নিজের পুনর্ব্যবহারযোগ্য HTML element বানানো যায়যেখানে শিখবেন: পর্ব ৫২পর্ব ৫৬পর্ব ৫৭
- Web fontওয়েব ফন্ট
- পাঠকের কম্পিউটারে না থাকলেও যে ফন্ট ওয়েবসাইট নিজে ডাউনলোড করিয়ে দেখায় — CSS-এর @font-face বা Google Fonts-এর লিংক দিয়েযেখানে শিখবেন: পর্ব ১৪পর্ব ২১পর্ব ৪৪
- Web hosting (হোস্টিং)ওয়েব হোস্টিং
- দিনরাত চালু থাকা একটি সার্ভারে আপনার সাইটের ফাইল রাখার ভাড়া করা বা বিনামূল্যের জায়গা — সাইটের “দোকানঘর”যেখানে শিখবেন: পর্ব ৫৩
- WebPওয়েবপি
- Google-এর আনা আধুনিক ছবির ফরম্যাট (২০১০), lossy ও lossless দুটোই পারে, স্বচ্ছতা ও অ্যানিমেশনও আছে। একই মানে সাধারণত JPEG/PNG-এর চেয়ে ছোট; সব আধুনিক ব্রাউজারে চলে।যেখানে শিখবেন: পর্ব ০৬পর্ব ৩২পর্ব ৪৯
- WebViewওয়েবভিউ
- অ্যাপের ভেতরে ওয়েব পাতা দেখানোর জন্য অপারেটিং সিস্টেমের দেওয়া ব্রাউজার-অংশ। Android-এ এটি Chromium-ভিত্তিক, iPhone-এ WebKit-ভিত্তিকযেখানে শিখবেন: পর্ব ৪৮
- WebVTTওয়েব-ভি-টি-টি
- ভিডিওর subtitle ও caption-এর লেখার ফাইলের ফরম্যাট (.vtt). প্রথম লাইনে WEBVTT, তারপর প্রতিটি অংশে সময় আর লেখা; <track> দিয়ে ভিডিওর সাথে জোড়া হয়।যেখানে শিখবেন: পর্ব ০৬পর্ব ৫৭
- WHATWGহোয়াটডাব্লিউজি
- Web Hypertext Application Technology Working Group — ২০০৪ সালে Apple, Mozilla, Opera মিলে গঠিত দল, যারা আজ HTML ও DOM-এর Living Standard রক্ষণাবেক্ষণ করেযেখানে শিখবেন: পর্ব ০১পর্ব ০৩পর্ব ৫৭
- Whitespace collapsingহোয়াইটস্পেস কোল্যাপসিং
- লেখার মাঝে পাশাপাশি অনেকগুলো space, tab বা নতুন লাইন থাকলে ব্রাউজার সেগুলো মিলিয়ে একটি space দেখায় — <pre> বা CSS-এর white-space বদলানো ছাড়াযেখানে শিখবেন: পর্ব ০৩পর্ব ০৪
- Wide gamut (প্রশস্ত রঙের পরিসর)ওয়াইড গ্যামাট
- sRGB-এর চেয়ে বেশি তীব্র রং দেখাতে পারা পর্দা বা রঙের জগৎ, যেমন Display P3. CSS-এ color(display-p3 …) বা বেশি chroma-র oklch() দিয়ে লেখা যায়যেখানে শিখবেন: পর্ব ২০
- will-changeউইল চেঞ্জ
- ব্রাউজারকে আগাম জানানোর CSS property যে কোন property শিগগিরই বদলাবে, যাতে সে প্রস্তুতি নেয় (যেমন আলাদা স্তর বানায়). শেষ উপায় হিসেবে, মেপে, অল্প element-এ ব্যবহার করুন — বেশি দিলে মেমরি নষ্ট হয়যেখানে শিখবেন: পর্ব ৩৮পর্ব ৩৯পর্ব ৫৭
- Wireframeওয়্যারফ্রেম
- রং ও সাজ ছাড়া, শুধু বাক্স আর রেখা দিয়ে আঁকা পাতার মোটা দাগের নকশা — কোন অংশ কোথায়, কোনটি কত বড়। কাগজে বা Figma-র মতো টুলে আঁকা হয়।যেখানে শিখবেন: পর্ব ৫৪পর্ব ৫৭
- WOFF2উফ-টু
- Web Open Font Format 2 — ওয়েবের জন্য বানানো সংকুচিত ফন্ট ফরম্যাট (ভেতরে Brotli সংকোচন); সব আধুনিক ব্রাউজারে চলে, আজ শুধু এটিই যথেষ্টযেখানে শিখবেন: পর্ব ২১পর্ব ৫৭
- Working directory (কাজের ফোল্ডার)ওয়ার্কিং ডিরেক্টরি
- আপনার প্রজেক্ট ফোল্ডারের যে ফাইলগুলো আপনি এখন খুলে লিখছেন। এখানের পরিবর্তন Git দেখে, কিন্তু নিজে থেকে সংরক্ষণ করে নাযেখানে শিখবেন: পর্ব ৫৩
- World Wide Web (ওয়েব)ওয়ার্ল্ড ওয়াইড ওয়েব
- Internet-এর ওপর চলা একটি ব্যবস্থা, যেখানে URL দিয়ে চেনা, লিংকে জোড়া পাতাগুলো HTTP দিয়ে এনে ব্রাউজারে দেখা হয়। ১৯৮৯–৯১ সালে Tim Berners-Lee তৈরি করেনযেখানে শিখবেন: পর্ব ০১
X
- X (Twitter) cardটুইটার কার্ড
- X-এ লিংক শেয়ারের কার্ডের জন্য <meta name="twitter:card"> (যেমন summary_large_image); শিরোনাম-ছবি আলাদা না দিলে X সাধারণত Open Graph ট্যাগ থেকে নেয়যেখানে শিখবেন: পর্ব ১৩
- x descriptor (density descriptor)এক্স ডেসক্রিপটর
- srcset-এ ফাইলের পাশে লেখা 1x, 2x, 3x — কোন ঘনত্বের পর্দার জন্য ফাইলটি। নির্দিষ্ট মাপের ছবিতে (লোগো, প্রোফাইল ছবি) ব্যবহার হয়।যেখানে শিখবেন: পর্ব ৩২
- x-heightএক্স-হাইট
- ফন্টের ছোট হাতের x অক্ষরের উচ্চতা; একই font-size-এ যে ফন্টের x-height বড়, সেটি চোখে বড় দেখায়যেখানে শিখবেন: পর্ব ২১
- XHTMLএক্স-এইচটিএমএল
- HTML-এর ট্যাগগুলোকে XML-এর কড়া নিয়মে লেখার রূপ (XHTML 1.0, W3C, ২০০০ সাল): ছোট হাতের ট্যাগ, প্রতিটি ট্যাগ বন্ধ, attribute-এ উদ্ধৃতি। XML হিসেবে পাঠালে একটি ভুলেই পাতা দেখানো বন্ধ হয়; আজকের HTML Living Standard-এ এর জায়গা নিয়েছে ক্ষমাশীল কিন্তু নির্দিষ্ট parsing নিয়মযেখানে শিখবেন: পর্ব ৫৭
Z
- z-axis (z-অক্ষ)জেড অক্ষ
- পর্দা ভেদ করে দর্শকের চোখের দিকে যাওয়া তৃতীয় অক্ষ। ধনাত্মক z মানে দর্শকের দিকে, ঋণাত্মক মানে পর্দার ভেতরে; translateZ() আর rotateX()/rotateY() এই অক্ষ ধরে কাজ করে।যেখানে শিখবেন: পর্ব ৪০
- z-indexজেড-ইনডেক্স
- যে CSS property ঠিক করে একে অপরের ওপর পড়া বাক্সগুলোর মধ্যে কে সামনে থাকবে; বড় সংখ্যা সামনে। এটি শুধু একই stacking context-এর ভেতরে তুলনা হয়, আর positioned element বা flex/grid item-এ কাজ করে।যেখানে শিখবেন: পর্ব ২৪পর্ব ২৭পর্ব ৪৭
- ZWJ (Zero Width Joiner)জিরো উইডথ জয়নার
- চোখে দেখা যায় না এমন একটি অক্ষর (U+200D), যা জোড়ার একটি বিশেষ রূপ চায়। বাংলায় র-এর পরে ZWJ, তারপর হসন্ত আর য লিখলে রেফের বদলে য-ফলা দেখায়, যেমন র্যাব।যেখানে শিখবেন: পর্ব ১৪
- ZWNJ (Zero Width Non-Joiner)জিরো উইডথ নন-জয়নার
- চোখে দেখা যায় না এমন একটি অক্ষর (U+200C), যা দুই অক্ষরকে জোড়া লাগতে দেয় না। বাংলায় হসন্তের পরে দিলে যুক্তাক্ষর না হয়ে স্পষ্ট হসন্ত দেখায়যেখানে শিখবেন: পর্ব ১৪
এই শব্দটি পাওয়া যায়নি। বানান বদলে বা বাংলায় লিখে দেখুন।