Chrome 127-এ নতুন

আপনার যা জানা দরকার তা এখানে:

  • font-size-adjust আপনাকে ফলব্যাক ফন্টের স্পষ্টতা উন্নত করতে সাহায্য করে।
  • ব্যবহারকারীর অ্যাক্টিভেশনগুলি এখন পিকচার-ইন-পিকচার ডকুমেন্ট এবং তাদের ওপেনারের মধ্যে প্রচারিত হয়
  • স্ক্রোল কন্টেইনারগুলি এখন ডিফল্টরূপে কীবোর্ড ফোকাসযোগ্য।
  • এবং আরো অনেক আছে.

আমি আদ্রিয়ানা জারা। চলুন ডুব দিয়ে দেখি Chrome 127-এ ডেভেলপারদের জন্য নতুন কী আছে।

CSS font-size-adjust

আপনার সাইটের পাঠযোগ্যতা হ্রাস পেতে পারে যখন প্রথম-পছন্দের ফন্ট-ফ্যামিলি অনুপলব্ধ হয় এবং এর ফলব্যাক ফন্টের একটি উল্লেখযোগ্যভাবে ভিন্ন দিক মান থাকে।

নীচের চিত্রটি ভারদানা এবং টাইমস ফন্টের মধ্যে পার্থক্য দেখায় যদিও পাঠ্যটি একই আকারের।

টেক্সট লাইন যা পড়ে: 'এই টেক্সটটি ভার্দানা ফন্ট (14px) ব্যবহার করে, যার তুলনামূলকভাবে বড় হাতের অক্ষর রয়েছে' এবং 'এটি টাইমস ফন্ট (14px) ব্যবহার করে, যা ছোট আকারে পড়া কঠিন'

আপনার সাইট যদি টাইমস ফন্টে ফিরে যায় তবে এটি পড়া অনেক কঠিন হয়ে পড়ে।

font-size-adjust সিএসএস প্রপার্টি আপনাকে ফ্যালব্যাক ফন্টের ফন্টের আকার সামঞ্জস্য করতে সাহায্য করে দৃষ্টিভঙ্গি মান (ফন্টের আকার দ্বারা বিভক্ত ছোট হাতের অক্ষরের উচ্চতা) সামঞ্জস্যপূর্ণ রাখতে, যাতে টেক্সটটি একই রকম দেখা যায় তা নিশ্চিত করে, ব্যবহৃত ফন্ট নির্বিশেষে।

নিম্নলিখিত ছবিতে ফন্ট-সাইজ-অ্যাডজাস্ট ব্যবহার করে ভার্দানা এবং টাইমস ফন্টের মধ্যে সুস্পষ্টতা বজায় রাখে।

   font-size-adjust: 0.545;

টেক্সট লাইনগুলি যা পড়ে 'এই টেক্সটটি ভারদানা ফন্ট (14px) ব্যবহার করে, যাতে তুলনামূলকভাবে বড় ছোট হাতের অক্ষর রয়েছে', 'এটি টাইমস ফন্ট (14px) ব্যবহার করে, যা ছোট আকারে পড়া কঠিন' এবং 'এই পাঠ্যটি 14px টাইমস ফন্টে Verdana ফন্টের মত একই আকৃতির মানের সাথে সামঞ্জস্য করা হয়েছে, তাই ছোট হাতের হরফ দুটি ফন্ট জুড়ে স্বাভাবিক করা হয়েছে

ক্রোমে font-size-adjust চালু হওয়ার সাথে সাথে এই বৈশিষ্ট্যটি বেসলাইনে পরিণত হয়েছে নতুন উপলব্ধ CSS-এ বিস্তারিত পড়ুন ফন্ট-সাইজ-অ্যাডজাস্ট এখন বেসলাইনে রয়েছে

ডকুমেন্ট পিকচার ইন পিকচার: প্রোপাগেট ইউজার অ্যাক্টিভেশন

ডকুমেন্ট পিকচার-ইন-পিকচার API এখন ডকুমেন্ট পিকচার-ইন-পিকচার উইন্ডো এবং এর ওপেনারের মধ্যে ব্যবহারকারীর অ্যাক্টিভেশন প্রচার করে।

ব্যবহারকারীর অঙ্গভঙ্গি অ্যাক্টিভেশন প্রচার ডেমোতে যান এবং ব্যবহারকারীর সক্রিয়করণ শনাক্ত হলে পৃষ্ঠার পটভূমির রঙের পরিবর্তনগুলি দেখুন৷ ব্যবহারকারীর অঙ্গভঙ্গি উভয় উইন্ডোর জন্য পটভূমি পরিবর্তন করে উভয় প্রসঙ্গে প্রচারিত হয়।

এটি একটি ডকুমেন্ট পিকচার-ইন-পিকচার উইন্ডোতে ব্যবহারকারীর সক্রিয়করণকে এর ওপেনার উইন্ডোর ভিতরে এবং অন্যভাবে ব্যবহারযোগ্য করে তোলে। এই পরিবর্তনটি ব্যবহারকারী-অ্যাক্টিভেশন-গেটেড এপিআই ব্যবহার করে আরও অর্গোনমিক করে তোলে, যেহেতু প্রায়শই ডকুমেন্ট পিকচার-ইন-পিকচার উইন্ডোতে ইভেন্ট হ্যান্ডলারগুলি আসলে ওপেনারের প্রসঙ্গে চালানো হয়, তাই ওপেনারের প্রসঙ্গে ব্যবহারকারীর অঙ্গভঙ্গিতে অ্যাক্সেস প্রয়োজন।

আরো বিস্তারিত জানার জন্য শুধুমাত্র <video> নয়, যেকোনো উপাদানের জন্য পিকচার-ইন-পিকচার দেখুন।

কীবোর্ড ফোকাসযোগ্য স্ক্রল পাত্রে.

স্ক্রোল কন্টেইনারগুলি কীবোর্ড ফোকাসযোগ্য হয়ে উঠছে স্ক্রলার এবং স্ক্রলারের মধ্যে বিষয়বস্তু সমস্ত ব্যবহারকারীর কাছে আরও অ্যাক্সেসযোগ্য করে তোলার জন্য গুরুত্বপূর্ণ।

এখন থেকে স্ক্রোলারগুলি ডিফল্টরূপে প্রোগ্রামগতভাবে ফোকাসযোগ্য হবে। এই পরিবর্তনের আগে, একটি স্ক্রলার উপাদান শুধুমাত্র ট্যাব ফোকাস করা যেতে পারে যদি ট্যাবিনডেক্স স্পষ্টভাবে 0 বা তার বেশি সেট করা থাকে।

মনে রাখবেন যে এই আচরণ শুধুমাত্র তখনই ঘটে যখন স্ক্রলারের কোন ফোকাসযোগ্য শিশু না থাকে। উদাহরণস্বরূপ, যদি স্ক্রলারে ইতিমধ্যেই একটি বোতাম থাকে, তাহলে ট্যাব ফোকাস স্ক্রলারটিকে এড়িয়ে যাবে এবং সরাসরি বোতামে ফোকাস করবে।

অ্যাক্সেসযোগ্যতার সর্বোত্তম অনুশীলনগুলি সুপারিশ করে যে সমস্ত বৈশিষ্ট্য অবশ্যই একটি কীবোর্ড ব্যবহার করে উপলব্ধ থাকতে হবে। ডিফল্টরূপে কীবোর্ড ফোকাসযোগ্য স্ক্রোলারগুলি ব্যবহারকারীর জন্য স্ক্রলারগুলি অ্যাক্সেস করতে অনুক্রমিক ফোকাস নেভিগেশন ব্যবহার করা সহজ করে তোলে।

নোট করুন যে এই পরিবর্তনটি সময়ের সাথে সাথে ব্যবহারকারীদের জন্য খুব ধীরে ধীরে সক্রিয় করা হচ্ছে, তাই আমরা পরিবর্তনের কারণে সৃষ্ট সমস্যার জন্য নিরীক্ষণ করতে পারি। অতএব, কিছু ব্যবহারকারী এই বৈশিষ্ট্যটি 130 সংস্করণ বা তার পরেও সক্ষম নাও দেখতে পারেন৷

কীবোর্ড ফোকাসযোগ্য স্ক্রোলারগুলিতে আরও বিশদ দেখুন

এবং আরো!

অবশ্যই আরো অনেক আছে.

  • একটি প্রধান ফ্রেমে এবং একই-অরিজিন আইফ্রেমে সমসাময়িক একই-ডকুমেন্ট ভিউ ট্রানজিশন এখন উপলব্ধ।

  • CSS বিষয়বস্তু থেকে তৈরি Alt টেক্সট এখন একাধিক আর্গুমেন্ট সমর্থন করে।

  • DevTools পারফরম্যান্স প্যানেল এখন WebSocket বার্তা ইভেন্টগুলি ক্যাপচার করে এবং সেগুলিকে পারফরম্যান্স ট্রেসে দেখায়৷

সম্পূর্ণ রিলিজ নোট পড়ুন .

আরও পড়া

এটি শুধুমাত্র কিছু মূল হাইলাইট কভার করে। Chrome 127-এ অতিরিক্ত পরিবর্তনের জন্য নিম্নলিখিত লিঙ্কগুলি দেখুন।

সদস্যতা

আপ টু ডেট থাকার জন্য, Chrome Developers YouTube চ্যানেলে সাবস্ক্রাইব করুন , এবং যখনই আমরা একটি নতুন ভিডিও লঞ্চ করব আপনি একটি ইমেল বিজ্ঞপ্তি পাবেন৷

Yo soy Adriana Jara, এবং Chrome 127 রিলিজ হওয়ার সাথে সাথে, Chrome-এ নতুন কী আছে তা বলতে আমি এখানেই থাকব!

,

আপনার যা জানা দরকার তা এখানে:

  • font-size-adjust আপনাকে ফলব্যাক ফন্টের স্পষ্টতা উন্নত করতে সাহায্য করে।
  • ব্যবহারকারীর অ্যাক্টিভেশনগুলি এখন পিকচার-ইন-পিকচার ডকুমেন্ট এবং তাদের ওপেনারের মধ্যে প্রচারিত হয়
  • স্ক্রোল কন্টেইনারগুলি এখন ডিফল্টরূপে কীবোর্ড ফোকাসযোগ্য।
  • এবং আরো অনেক আছে.

আমি আদ্রিয়ানা জারা। চলুন ডুব দিয়ে দেখি Chrome 127-এ ডেভেলপারদের জন্য নতুন কী আছে।

CSS font-size-adjust

আপনার সাইটের পাঠযোগ্যতা হ্রাস পেতে পারে যখন প্রথম-পছন্দের ফন্ট-ফ্যামিলি অনুপলব্ধ হয় এবং এর ফলব্যাক ফন্টের একটি উল্লেখযোগ্যভাবে ভিন্ন দিক মান থাকে।

নীচের চিত্রটি ভারদানা এবং টাইমস ফন্টের মধ্যে পার্থক্য দেখায় যদিও পাঠ্যটি একই আকারের।

টেক্সট লাইন যা পড়ে: 'এই টেক্সটটি ভার্দানা ফন্ট (14px) ব্যবহার করে, যার তুলনামূলকভাবে বড় হাতের অক্ষর রয়েছে' এবং 'এটি টাইমস ফন্ট (14px) ব্যবহার করে, যা ছোট আকারে পড়া কঠিন'

আপনার সাইট যদি টাইমস ফন্টে ফিরে যায় তবে এটি পড়া অনেক কঠিন হয়ে পড়ে।

font-size-adjust সিএসএস প্রপার্টি আপনাকে ফ্যালব্যাক ফন্টের ফন্টের আকার সামঞ্জস্য করতে সাহায্য করে দৃষ্টিভঙ্গি মান (ফন্টের আকার দ্বারা বিভক্ত ছোট হাতের অক্ষরের উচ্চতা) সামঞ্জস্যপূর্ণ রাখতে, যাতে টেক্সটটি একই রকম দেখা যায় তা নিশ্চিত করে, ব্যবহৃত ফন্ট নির্বিশেষে।

নিম্নলিখিত ছবিতে ফন্ট-সাইজ-অ্যাডজাস্ট ব্যবহার করে ভার্দানা এবং টাইমস ফন্টের মধ্যে সুস্পষ্টতা বজায় রাখে।

   font-size-adjust: 0.545;

টেক্সট লাইনগুলি যা পড়ে 'এই টেক্সটটি ভারদানা ফন্ট (14px) ব্যবহার করে, যাতে তুলনামূলকভাবে বড় ছোট হাতের অক্ষর রয়েছে', 'এটি টাইমস ফন্ট (14px) ব্যবহার করে, যা ছোট আকারে পড়া কঠিন' এবং 'এই পাঠ্যটি 14px টাইমস ফন্টে Verdana ফন্টের মত একই আকৃতির মানের সাথে সামঞ্জস্য করা হয়েছে, তাই ছোট হাতের হরফ দুটি ফন্ট জুড়ে স্বাভাবিক করা হয়েছে

ক্রোমে font-size-adjust চালু হওয়ার সাথে সাথে এই বৈশিষ্ট্যটি বেসলাইনে পরিণত হয়েছে নতুন উপলব্ধ CSS-এ বিস্তারিত পড়ুন ফন্ট-সাইজ-অ্যাডজাস্ট এখন বেসলাইনে রয়েছে

ডকুমেন্ট পিকচার ইন পিকচার: প্রোপাগেট ইউজার অ্যাক্টিভেশন

ডকুমেন্ট পিকচার-ইন-পিকচার API এখন ডকুমেন্ট পিকচার-ইন-পিকচার উইন্ডো এবং এর ওপেনারের মধ্যে ব্যবহারকারীর অ্যাক্টিভেশন প্রচার করে।

ব্যবহারকারীর অঙ্গভঙ্গি অ্যাক্টিভেশন প্রচার ডেমোতে যান এবং ব্যবহারকারীর সক্রিয়করণ শনাক্ত হলে পৃষ্ঠার পটভূমির রঙের পরিবর্তনগুলি দেখুন৷ ব্যবহারকারীর অঙ্গভঙ্গি উভয় উইন্ডোর জন্য পটভূমি পরিবর্তন করে উভয় প্রসঙ্গে প্রচারিত হয়।

এটি একটি ডকুমেন্ট পিকচার-ইন-পিকচার উইন্ডোতে ব্যবহারকারীর সক্রিয়করণকে এর ওপেনার উইন্ডোর ভিতরে এবং অন্যভাবে ব্যবহারযোগ্য করে তোলে। এই পরিবর্তনটি ব্যবহারকারী-অ্যাক্টিভেশন-গেটেড এপিআই ব্যবহার করে আরও অর্গোনমিক করে তোলে, যেহেতু প্রায়শই ডকুমেন্ট পিকচার-ইন-পিকচার উইন্ডোতে ইভেন্ট হ্যান্ডলারগুলি আসলে ওপেনারের প্রসঙ্গে চালানো হয়, তাই ওপেনারের প্রসঙ্গে ব্যবহারকারীর অঙ্গভঙ্গিতে অ্যাক্সেস প্রয়োজন।

আরো বিস্তারিত জানার জন্য শুধুমাত্র <video> নয়, যেকোনো উপাদানের জন্য পিকচার-ইন-পিকচার দেখুন।

কীবোর্ড ফোকাসযোগ্য স্ক্রল পাত্রে.

স্ক্রোল কন্টেইনারগুলি কীবোর্ড ফোকাসযোগ্য হয়ে উঠছে স্ক্রলার এবং স্ক্রলারের মধ্যে বিষয়বস্তু সমস্ত ব্যবহারকারীর কাছে আরও অ্যাক্সেসযোগ্য করে তোলার জন্য গুরুত্বপূর্ণ।

এখন থেকে স্ক্রোলারগুলি ডিফল্টরূপে প্রোগ্রামগতভাবে ফোকাসযোগ্য হবে। এই পরিবর্তনের আগে, একটি স্ক্রলার উপাদান শুধুমাত্র ট্যাব ফোকাস করা যেতে পারে যদি ট্যাবিনডেক্স স্পষ্টভাবে 0 বা তার বেশি সেট করা থাকে।

মনে রাখবেন যে এই আচরণ শুধুমাত্র তখনই ঘটে যখন স্ক্রলারের কোন ফোকাসযোগ্য শিশু না থাকে। উদাহরণস্বরূপ, যদি স্ক্রলারে ইতিমধ্যেই একটি বোতাম থাকে, তাহলে ট্যাব ফোকাস স্ক্রলারটিকে এড়িয়ে যাবে এবং সরাসরি বোতামে ফোকাস করবে।

অ্যাক্সেসযোগ্যতার সর্বোত্তম অনুশীলনগুলি সুপারিশ করে যে সমস্ত বৈশিষ্ট্য অবশ্যই একটি কীবোর্ড ব্যবহার করে উপলব্ধ থাকতে হবে। ডিফল্টরূপে কীবোর্ড ফোকাসযোগ্য স্ক্রোলারগুলি ব্যবহারকারীর জন্য স্ক্রলারগুলি অ্যাক্সেস করতে অনুক্রমিক ফোকাস নেভিগেশন ব্যবহার করা সহজ করে তোলে।

নোট করুন যে এই পরিবর্তনটি সময়ের সাথে সাথে ব্যবহারকারীদের জন্য খুব ধীরে ধীরে সক্রিয় করা হচ্ছে, তাই আমরা পরিবর্তনের কারণে সৃষ্ট সমস্যার জন্য নিরীক্ষণ করতে পারি। অতএব, কিছু ব্যবহারকারী এই বৈশিষ্ট্যটি 130 সংস্করণ বা তার পরেও সক্ষম নাও দেখতে পারেন৷

কীবোর্ড ফোকাসযোগ্য স্ক্রোলারগুলিতে আরও বিশদ দেখুন

এবং আরো!

অবশ্যই আরো অনেক আছে.

  • একটি প্রধান ফ্রেমে এবং একই-অরিজিন আইফ্রেমে সমসাময়িক একই-ডকুমেন্ট ভিউ ট্রানজিশন এখন উপলব্ধ।

  • CSS বিষয়বস্তু থেকে তৈরি Alt টেক্সট এখন একাধিক আর্গুমেন্ট সমর্থন করে।

  • DevTools পারফরম্যান্স প্যানেল এখন WebSocket বার্তা ইভেন্টগুলি ক্যাপচার করে এবং সেগুলিকে পারফরম্যান্স ট্রেসে দেখায়৷

সম্পূর্ণ রিলিজ নোট পড়ুন .

আরও পড়া

এটি শুধুমাত্র কিছু মূল হাইলাইট কভার করে। Chrome 127-এ অতিরিক্ত পরিবর্তনের জন্য নিম্নলিখিত লিঙ্কগুলি দেখুন।

সদস্যতা

আপ টু ডেট থাকার জন্য, Chrome Developers YouTube চ্যানেলে সাবস্ক্রাইব করুন , এবং যখনই আমরা একটি নতুন ভিডিও লঞ্চ করব আপনি একটি ইমেল বিজ্ঞপ্তি পাবেন৷

Yo soy Adriana Jara, এবং Chrome 127 রিলিজ হওয়ার সাথে সাথে, Chrome-এ নতুন কী আছে তা বলতে আমি এখানেই থাকব!