EMS এখনও প্রাসঙ্গিক?

Question

মত থ্রেড পড়া থেকে আমার বোঝার এই এক যে EMS বিন্দু করে আপনার ওয়েব পেজ এ সব পরিমাপ সংজ্ঞায়িত করতে হয় বেস ফন্ট সাইজ , যা আপনার ব্রাউজার দ্বারা নির্ধারণ করা যাবে।

উদাহরণস্বরূপ, ক্রোমে আপনি যেতে গিয়ে এটি করতে পারেন settings -> show advanced settings -> web content -> font size: very large। আমি এটি করতে পারতাম যদি আমি একটি বড়, উচ্চ রেজোলিউশন মনিটর ব্যবহার করি যা খুব দূরে ছিল।

আমি একটি প্লাঙ্কার তৈরি করেছি যা সাইজিংয়ের ক্ষেত্রে ems এবং px এর মধ্যে পার্থক্য প্রদর্শন করে।

#div1 {
  width: 320px
}

#div2 {

  width: 20em;
}

যদি আমার ব্রাউজারে আমি ফন্টের আকার মাঝারিতে সেট করি, তবে এই ডিভগুলি একই আকার হবে, বেস ফন্টের আকার 16px হবে, তাই 20 এম = 320px।

যাইহোক, যখন আমি আমার ব্রাউজারের ফন্টের আকারটি খুব বড় আকারে পরিবর্তন করি, আমরা দেখতে পাব যে ইএমএসে পরিমাপ করা ডিভ আকারটি বৃদ্ধি পেয়েছে।

যাইহোক, আমি উদাহরণস্বরূপ বডি ট্যাগে ফন্টের আকারটি সংজ্ঞায়িত করলে এই প্রভাবটিকে তুচ্ছ করা হবে।

body {
  font-size: 16px;
}

কারণ এখন আমার সিএসএস ব্রাউজার দ্বারা সেট করা ফন্ট আকারকে ওভাররাইড করছে।

আমি পেয়েছি যে পুরানো ব্রাউজারগুলির দিনগুলিতে ইএমএস গুরুত্বপূর্ণ হত, যেখানে পৃষ্ঠায় জুম করা কেবল ফন্টগুলি স্কেল করে। তবে আজকালকার আধুনিক ব্রাউজারগুলি পিক্সেল এবং ফন্ট উভয়ই স্কেল করে, জুম ইস্যুটি মোটা করে।

ওয়েব জুড়ে খুঁজছি - ওয়েবসাইটের অনেক না তাদের শরীরের ট্যাগে সেট ফন্ট সাইজ।

ওভারফ্লো স্ট্যাক উদাহরণস্বরূপ, বডি ট্যাগে ফন্ট-আকার 13px এ সেট করে। আমার ব্রাউজারে ফন্টের আকার সেট করা খুব কম সময়ে স্ট্যাক ওভারফ্লো লেআউটকে প্রভাবিত করে না।

গুগল অনুসন্ধান ফলাফল এটি করে না।

(এই উভয় স্ক্রিনশট খুব বড় ক্রোম ফন্টের আকারের এবং 100% জুমের সাথে নেওয়া)।

সুতরাং সম্ভবত আপনি তর্ক করতে পারেন যে বডি ট্যাগে ফন্টের আকার নির্ধারণ করা একটি খারাপ ধারণা কারণ এটি ব্যবহারকারীর নিজস্ব অ্যাক্সেসযোগ্যতার সেটিংসকে বাধা দেয়। তবে প্রদত্ত যে ব্যবহারকারী মাপ বাড়ানোর জন্য জুম করতে পারে (যা আনুপাতিকভাবে সমস্ত পিক্সেলও বাড়িয়ে দেবে) - এটি বাস্তব সমস্যা বলে মনে হয় না।

Comments

একজন ব্যবহারকারী এখনও body { font-size: XYZ; }স্টাইলশীট ব্যবহার করে ওভাররাইড করতে পারেনbody { font-size: ZYX !important; }

— পিটার টেলর

Answer 1

যাইহোক, আমি উদাহরণস্বরূপ বডি ট্যাগে ফন্টের আকারটি সংজ্ঞায়িত করলে এই প্রভাবটিকে তুচ্ছ করা হবে।

body {
  font-size: 16px;
}

কারণ এখন আমার সিএসএস ব্রাউজার দ্বারা সেট করা ফন্ট আকারকে ওভাররাইড করছে।

আপনি অ্যাক্সেসযোগ্যতার কথা ভুলে যাচ্ছেন ।

সি 14 দেখুন : ওয়েব সামগ্রী অ্যাক্সেসিবিলিটি গাইডলাইনগুলি (ডাব্লুসিএজি 2.0) থেকে ফন্ট আকারের জন্য ইম ইউনিটগুলি ব্যবহার করুন ।

আপনার ব্রাউজারের ফন্ট আকারের বিকল্পটি খুব বড়তে সেট করুন । এখন W3C এর মতো একটি ওয়েবসাইটে যান । লেখাটি কেমন দেখাচ্ছে?

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

তবে আপনাকে বাধ্য করা হতে পারে (কিছু ওয়েবসাইটের আইন অনুসারে) বিভিন্ন সিদ্ধান্ত নিতে এবং ব্যবহারকারীদের তাদের ফন্টের আকার নির্বাচন করতে দিন। সেখান থেকে আপনার একটি পছন্দ আছে: হয় আপনি পিক্সেলগুলিতে চিত্রের আকার এবং পৃষ্ঠার বিভিন্ন অঞ্চল নির্ধারণ করুন, সেক্ষেত্রে ব্রাউজারের ফন্ট আকারের বিকল্পের বিন্যাসে মজাদার প্রভাব পড়বে, বা আপনি emসেই উপাদানগুলির জন্য হিসাবে ব্যবহার করবেন আমরা হব.

এছাড়াও নোট করুন যে আপনি যদি শরীরের স্তরে পিক্সেলগুলিতে ফন্টের আকারটি নির্দিষ্ট না করেন তবে emসর্বত্র ফন্টের আকারের জন্য কমপক্ষে থাকুন। উদাহরণস্বরূপ, গুগল হরফ আকারের ফন্টের আকার নির্দিষ্ট করেছে এবং তাদের অনুসন্ধান পৃষ্ঠাটি অদ্ভুত দেখাচ্ছে, বিশেষত শিরোনামগুলি সাধারণ পাঠ্যের চেয়ে ছোট দেখাচ্ছে। অন্যদিকে উইকিপিডিয়া emযখনই ফন্টের আকার নির্দিষ্ট করা হয়েছে তখন ব্যবহার করে একটি দুর্দান্ত কাজ করেছে । নীচে ফন্ট আকারের বিকল্পের সাথে ক্রোমিয়াম রেন্ডার করা উভয় সাইটের স্ক্রিনশটগুলি খুব বড়তে সেট করা হয়েছে :

সুতরাং সম্ভবত আপনি তর্ক করতে পারেন যে বডি ট্যাগে ফন্টের আকার নির্ধারণ করা একটি খারাপ ধারণা কারণ এটি ব্যবহারকারীর নিজস্ব অ্যাক্সেসযোগ্যতার সেটিংসকে বাধা দেয়। তবে প্রদত্ত যে ব্যবহারকারী মাপ বাড়ানোর জন্য জুম করতে পারে (যা আনুপাতিকভাবে সমস্ত পিক্সেলও বাড়িয়ে দেবে) - এটি বাস্তব সমস্যা বলে মনে হয় না।

এটি দুটি কারণে একটি আসল সমস্যা।

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

দ্বিতীয়ত, কোনও কোনও জুম করা হলে অনেকগুলি ওয়েবসাইট চাক্ষুষভাবে ভাল আচরণ করবে না। প্রতিক্রিয়াশীল ওয়েবসাইটগুলি ভাল করে, তবে প্রতিক্রিয়াবিহীন ওয়েবসাইটগুলি হয় অনুভূমিক স্ক্রোল বা কোনও ধরণের "আপনার স্ক্রিনটি খুব ছোট" আচরণ দেখায়।

বিকাশকারীর জন্য জুমিং এবং পাঠ্য স্কেলের মধ্যে একটি মৌলিক পার্থক্যও রয়েছে। এর emঅর্থ "ব্যবহারকারীর পাঠ্য আকারের পছন্দগুলিতে এটি সামঞ্জস্য করুন", জুমটি কেবল পাঠ্য নয়, পুরো পৃষ্ঠাটিকে উপরে বা নীচে স্কেল করার বিষয়ে।

সাইট মেনুর একটি উদাহরণ নিন (পৃষ্ঠার শীর্ষে, লিঙ্কগুলিকে একটি লাইনে অবস্থিত করে)। জুমিংয়ের সাথে আপনি জানেন যে মেনুটির উচ্চতা অন্যান্য উপাদানের সাথে আনুপাতিকভাবে পরিবর্তিত হবে। পাঠ্য আকারের বিকল্পের সাথে, আচরণটি নির্ধারণ করা আপনার পক্ষে। আপনি ধরে নিতে পারেন যে কোনও দৃষ্টি প্রতিবন্ধী ব্যক্তি 50pxসব ক্ষেত্রেই আপনার উঁচু মেনুটি দেখতে পাবে : সাদা ব্যাকগ্রাউন্ডে কেউ কালো মেনু মিস করবে না। অথবা আপনি সিদ্ধান্ত নিতে পারেন যে এর উচ্চতা পাঠ্যের সাথে সমানুপাতিক থাকতে হবে 1.5em।

Answer 2

ইএমএসের বিন্দুটি হ'ল বেস ফন্টের আকার দ্বারা আপনার ওয়েবপৃষ্ঠায় সমস্ত পরিমাপকে সংজ্ঞায়িত করা

এটি আমার পক্ষে শর্তাদির একটি ভুল বোঝাবুঝি হতে পারে তবে স্পষ্ট করে বলা: em"বর্তমান উপাদানটির" ফন্টের আকারের সাথে তুলনামূলক। remমূল ফন্টের আকারের সাথে সম্পর্কিত।

আমি পেয়েছি যে পুরানো ব্রাউজারগুলির দিনগুলিতে ইএমএস গুরুত্বপূর্ণ হত, যেখানে পৃষ্ঠায় জুম করা কেবল ফন্টগুলি স্কেল করে।

এজন্যই আমি ব্যবহার করি না em। আসলে, যখন আমি পরিমাপের তুলনামূলক ইউনিট ব্যবহার করি তখন আপনার জুমিং অভিজ্ঞতাটি আমার মনে সর্বশেষ জিনিস thing আমার উদ্বেগ দ্বিগুণ।

প্রথমত, আমি সাধারণত আমার লেআউটগুলি আপেক্ষিক পদগুলিতে সংজ্ঞায়িত করতে আগ্রহী। আমার উদ্বেগ হ'ল আমার পাতাগুলি একে অপরের সাথে তার ভিতরে থাকা পাঠ্যের সাথে ভাল দেখাচ্ছে। এবং যখন আমি ফন্টটি পরিবর্তন করি বা জিনিসগুলি শৃঙ্খলাবদ্ধ করে তুলি, আমি যে অনুপাতের জন্য শুটিং করছি তা বজায় রাখতে আমি হাতে সমস্ত কিছু পুনরায় গণনা এবং আপডেট করতে চাই না। ব্রাউজারটি গণিত করতে দিন ...

দ্বিতীয়ত, আমি কেবল ফন্টের আকারকে সহজ ভাষায় প্রকাশ করতে চাই যা আমি বুঝতে পারি। যদি আমি আমার বেস ফন্টগুলি ptএবং এর সমস্ত কিছুর মধ্যে remবা এর মধ্যে প্রকাশ করি তবে emএটি আমার পক্ষে সহজ। আপনার ডিভাইসের রেজোলিউশন আমাকে জানার দরকার নেই এবং আপনাকে জুম করতে হবে না। আপনার ব্রাউজারটি কত পিক্সেল ব্যবহার করতে হবে তা জানে; আমাদের উভয়েরই এটি সম্পর্কে চিন্তা করা উচিত নয়।