আমি কীভাবে বিভিন্ন ওয়েব ব্রাউজারগুলিতে ফন্টগুলি একইভাবে রেন্ডার করতে পারি?


11

আমি একটি ক্লায়েন্টের জন্য একটি ওয়েবসাইট তৈরি করছি, এবং আমরা নেভিগেশন বারে চিত্রগুলি নয়, সরল পাঠ্যটি ব্যবহার করার আশা করেছি। আমরা যে ফন্টটি ব্যবহার করছি তা হ'ল সেঞ্চুরি গথিক (আমি বিশ্বাস করি যে এই ফন্টটি বেশিরভাগ পিসি এবং ম্যাকের জন্য উপলব্ধ)) সমস্যাটি হ'ল বিভিন্ন ব্রাউজারে হরফ উল্লেখযোগ্যভাবে পৃথক হয়। ক্রোমে আমরা এটি আমাদের মতো করে দেখতে পেয়েছি তবে ফায়ারফক্সে পাঠ্যটি আরও ছোট এবং সাহসী।

ফন্টের বৈশিষ্ট্যগুলি পরিবর্তন করতে ব্রাউজারের নির্দিষ্ট জাভাস্ক্রিপ্ট লেখার পাশাপাশি, হরফ ক্রস-ব্রাউজারটি যেভাবে দেওয়া হয় তা মানক করার জন্য অন্য কোনও বিকল্প নেই। সম্ভবত কিছু গ্রন্থাগার বা এপিআই? ফন্টের বৈশিষ্ট্য ঘোষণার ক্ষেত্রে এটি আরও নির্দিষ্ট হওয়ার বিষয় হতে পারে? সত্যিই আমি আটকা পড়েছি এবং সাহায্যের প্রয়োজন।

উত্তর:


13

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


হ্যাঁ, মনে হচ্ছে এটি দুর্ভাগ্যজনক বাস্তব। তবে মনে হচ্ছে যে কেউ জাভাস্ক্রিপ্টের একটি টুকরো লিখতে পারা সম্ভব ছিল যা জিনিসকে কিছুটা স্বাভাবিক করে তুলবে।
জাচ লিসোবেই

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

1
এই নিবন্ধটি (এবং একই সিরিজের অন্যান্য) বিষয়গুলি খুব বিস্তারিতভাবে ব্যাখ্যা করেছে, আপনার কি কৌতূহল হওয়া উচিত। blog.typekit.com/2010/12/17/…
পলমোরিস

আপনার উত্তরটি সেরা হিসাবে নির্বাচন করেছেন। আপনি বলছেন এটি কোনও কোডের সমস্যা নয়, তবে অবশ্যই কেউ কোড লিখতে পারে যাতে পাঠের একটি একক লাইন পিক্সেলের সর্বনিম্ন প্রস্থে প্রসারিত হয়। এটি নিজেই এই পরিস্থিতির উন্নতি করবে। এটি রেন্ডার করা <p> প্রস্থ এবং সেই অনুযায়ী বর্ণের ব্যবধান বাড়িয়ে পরীক্ষা করতে পারে। হতে পারে?
জ্যাচ লিসোবেই

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

1

আসলে আপনার সিএসএসে ফন্টগুলি এম্বেড করার একটি পদ্ধতি রয়েছে। এটি অত্যন্ত সহজ। পড়ুন http://randsco.com/index.php/2009/07/04/p680 এই কিভাবে করতে হবে আরও তথ্যের জন্য। এর নেতিবাচক দিকটি হ'ল পুরানো ব্রাউজারগুলি (প্রাক ei 7 এবং ff 3 আমি মনে করি ...) এটি সমর্থন করে না। তবে এই পুরানো ব্রাউজারগুলি ব্যবহার করে এমন লোকের সংখ্যা দ্রুত হ্রাস পাচ্ছে এবং বিকল্প ফন্টগুলি নির্দিষ্ট করা এখনও সম্ভব যা কার্যকরভাবে কাজ করবে এবং বেশিরভাগ পিসির ক্ষেত্রে কেবল এটির ক্ষেত্রেই রয়েছে।

আমি ব্যবহার করি নি যে অন্য পদ্ধতির ফ্ল্যাশ ব্যবহার জড়িত। আমার জানা ব্যতীত আমার এ বিষয়ে খুব বেশি তথ্য নেই।


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

ফ্ল্যাশ পদ্ধতিটি বলা হয় এসআইএফআর । এটির পাশাপাশি এটির পক্ষেও ভাল-মন্দ।
জন কনডে

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

1

অন্যরা ইতিমধ্যে উল্লেখ করেছে যে, আমাদের সম্পূর্ণ নিয়ন্ত্রণ নেই। তবে আমি মনে করি এটি সামগ্রিকভাবে সামগ্রীতে রেন্ডার করতে ব্রাউজারগুলি পেতে সহায়ক বলে মনে করি এমন কয়েকটি বিষয় উল্লেখ করা ভাল। উভয়ই "ব্যাক টু বেসিক" ধরণের জিনিস যা আপনারা অনেকেই ইতিমধ্যে করছেন, তবে আমি তাদের উল্লেখযোগ্য মনে করেছি যেহেতু আপনি যে ভিত্তিটি তৈরি করেন তা আপনাকে সাফল্য বা ব্যর্থতার জন্য সেট করে তোলে ...

সিএসএস রিসেট। ধারণাটি সহজ, আপনি HTML রেন্ডারিংয়ের জন্য একটি সাধারণ প্রারম্ভিক পয়েন্ট সেট করতে স্টাইলশিটে এইচটিএমএল ট্যাগ ডিফল্ট সেট করেন। এখানে একটি নিবন্ধ এবং উদাহরণ দেওয়া হয়েছে: http://meyerweb.com/eric/tools/css/reset/

ডক্টাইপ ঘোষণা http://htmlhelp.com/tools/validator/doctype.html

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.