কম্পিউটার

কেন আপনার বড় হাতের/সমস্ত ক্যাপ টেক্সটে সম্ভবত কিছু লেটারস্পেসিং প্রয়োজন [টাইপোগ্রাফি]

আপনার বড় হাতের টেক্সট এলিমেন্টে সামান্য অক্ষর ব্যবধান ব্যবহার করে কেন আপনি প্রায়শই উপকৃত হবেন — এবং CSS-এর সাহায্যে এটি কীভাবে করবেন সে সম্পর্কে জানুন।

টাইপোগ্রাফিতে, আপনি যখন টেক্সট উপাদানগুলিতে বড় হাতের/সমস্ত ক্যাপ (ক্যাপিটাল অক্ষর) ব্যবহার করেন তখন আপনাকে সাধারণত অক্ষরগুলির মধ্যে কিছুটা শ্বাস-প্রশ্বাসের জায়গা যোগ করতে হবে, অন্যথায়, তারা আরামে পড়ার জন্য খুব টাইট হয়ে যায়।

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

আসুন কিছু উদাহরণ দেখি।

সাধারণ বনাম বড় হাতের অক্ষর

নিম্নোক্ত টেক্সট এলিমেন্ট, সাধারন কেস এবং সমস্ত ক্যাপ/বড়হাতের তুলনা করুন:

টাইপোগ্রাফি

টাইপোগ্রাফি

আপনি একটি সমস্যা দেখতে পাচ্ছেন?

আপনি না করলে ঠিক আছে। স্বাভাবিক/ডিফল্ট ফন্ট-ওজন ব্যবহার করার সময় এটি প্রায়শই একটি সমস্যা হয় না। এটা নির্ভর করে টাইপফেস ডিজাইনের উপর এবং কিভাবে এটি ব্যবহার করা হয়।

CSS-এ, একটি সাধারণ ফন্ট-ওজন হয় font-weight: normal; ব্যবহার করে ঘোষণা করা যেতে পারে। অথবা font-weight: 400; — এটা একই।

সাধারণ কেস বনাম বড় হাতের অক্ষর (গাঢ়)

এখন একই উদাহরণ তুলনা করা যাক, কিন্তু এই সময় আমরা একটি সাহসী font-weight:

যোগ করি

টাইপোগ্রাফি

টাইপোগ্রাফি

আপনি কি দেখতে পাচ্ছেন যখন আমরা মোটা অক্ষর স্ট্রোক (বোল্ড) ব্যবহার করি তখন সমস্ত ক্যাপ টেক্সট এখন কতটা টাইট দেখায়? এখন আপনি দেখতে পাচ্ছেন যে কিছু অক্ষর একে অপরকে স্পর্শ করছে।

CSS-এ, font-weight: bold; ব্যবহার করে একটি মোটা ফন্ট-ওজন ঘোষণা করা যেতে পারে। . আপনি সাংখ্যিক মানগুলিও ব্যবহার করতে পারেন, তবে নিশ্চিত করুন যে আপনি জানেন যে আপনার পছন্দের ফন্ট-পরিবার থেকে কতগুলি ফন্ট ওজন বিকল্প উপলব্ধ রয়েছে৷ 700 সাধারণত বোল্ডের সমতুল্য - কিন্তু সবসময় নয়।

লেটারস্পেসিং (ওরফে ট্র্যাকিং)

আসুন আগে থেকে বড় হাতের টেক্সট উপাদানের উদাহরণের একটি অনুলিপি তৈরি করি এবং এটিকে 4px অক্ষর স্পেসিং দিন এবং দেখুন কিভাবে দুটি তুলনা করে:

টাইপোগ্রাফি

টাইপোগ্রাফি

বাহ, কি পার্থক্য! প্রথম উদাহরণটি প্রায় একটি ক্লাস্ট্রোফোবিক প্রতিক্রিয়ার উদ্রেক করে, যখন দ্বিতীয়টি বিপরীত প্রভাব দেয়৷

CSS-এ, অক্ষর ব্যবধান ঘোষণা করা হয় letter-spacing দিয়ে সম্পত্তি, যেমন:letter-spacing: 4px; এটি হাইফেন (-) সহ বা ছাড়া বানান করা যেতে পারে ) নিয়মিত ভাষায়, কিন্তু CSS-এ এটি সর্বদা এর সাথে হয় একটি হাইফেন।

আমাকে পরিষ্কার হতে দিন. আমি প্রস্তাব করছি না যে যোগ করা অক্ষর স্থানের সাথে দ্বিতীয় পাঠ্য উপাদান উদাহরণটি সর্বদা উচ্চতর পছন্দ। এটা নির্ভর করে আপনার নির্দিষ্ট ব্যবহারের ক্ষেত্রে আপনি কোন ধরনের বায়ুমণ্ডল/মেজাজ স্থাপন করার চেষ্টা করছেন।

একটি পোস্টারে একটি চলচ্চিত্রের থিম প্রকাশ এবং শক্তিশালী করার সবচেয়ে শক্তিশালী সরঞ্জামগুলির মধ্যে একটি হল টাইপোগ্রাফি। একজন দক্ষ টাইপোগ্রাফার সাবধানে এই বিষয়ে সিদ্ধান্ত নেবেন:

  • টাইপফেস/ফন্ট-ফ্যামিলি
  • টাইপফেস শ্রেণীবিভাগ (সেরিফ, সান-সেরিফ, ইত্যাদি)
  • ফন্ট-সাইজ
  • অক্ষরের আবরণ (বড় হাতের, ছোট হাতের, ইত্যাদি)***
  • ফন্ট-ওয়েট (সাধারণ, গাঢ়, ইত্যাদি)
  • ফন্ট শৈলী (নিয়মিত/স্বাভাবিক/ইটালিক)

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

লেটারস্পেসিং শুধুমাত্র একটি, কিন্তু টাইপোগ্রাফির একটি শক্তিশালী উপাদান:

ক্যাপটিভিটি

স্বাধীনতা

আপনি পার্থক্য অনুভব করতে পারেন?

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

সারাংশে:

  • পাঠক-বন্ধুত্বের খাতিরে বড় হাতের লেখা সামান্য ব্যবহার করুন। এটি শিরোনাম বা ছোট শিরোনামের জন্য ভাল কাজ করতে পারে, কিন্তু সম্পূর্ণ বাক্য বা অনুচ্ছেদের জন্য নয়৷
  • একটি নিয়ম হিসাবে বড় হাতের/সব ক্যাপ টেক্সট টেক্সট সহজে হজম করার জন্য অক্ষরগুলির মধ্যে ব্যবধানে কিছুটা, কখনও কখনও প্রচুর, লাভ করে।
  • পাঠ্যটি আরও নান্দনিকভাবে আনন্দদায়ক হতে থাকে যখন আপনি অক্ষরগুলিকে একসাথে আটকে রেখেছেন বলে মনে হয় না৷ ভিজ্যুয়াল গুরুত্বপূর্ণ।
  • কখনও কখনও আঁটসাঁট ট্র্যাকিং/লেটারস্পেসিং সঠিকভাবে উপযুক্ত।

এটি কালো এবং সাদা নয়। প্রসঙ্গ মূল।


  1. কিভাবে আপনার CMOS রিসেট করবেন এবং কেন আপনার প্রয়োজন হতে পারে

  2. আপনার সমস্ত ক্রোম ট্যাবগুলি পরিচালনা করতে আপনার যা প্রয়োজন তা এখানে

  3. আপনার ওয়াইফাই কেন কাজ করছে না তার সমস্ত সম্ভাব্য কারণ

  4. Android সম্পর্কে আপনার যা জানা দরকার এবং কেন এটি গুরুত্বপূর্ণ?