একটি কারণ হ'ল ওয়েব ডিজাইনাররা আজকাল ওয়েব ফন্টগুলি (সাধারণত ডাব্লুএফএফ ফরম্যাটে) ব্যবহার করতে পছন্দ করেন , যেমন গুগল ওয়েব ফন্টের মাধ্যমে ।
পূর্বে, একমাত্র ফন্টগুলি কোনও সাইটে প্রদর্শিত হতে সক্ষম হয়েছিল সেগুলি হ'ল ব্যবহারকারীরা স্থানীয়ভাবে ইনস্টল করেছিলেন। যেহেতু ম্যাক এবং উইন্ডোজ ব্যবহারকারীদের অগত্যা একই ফন্টগুলি না থাকায় ডিজাইনাররা সহজাতভাবে সর্বদা নিয়ম হিসাবে সংজ্ঞায়িত হন
font-family: Arial, Helvetica, sans-serif;
যেখানে, সিস্টেমে যদি প্রথম ফন্টটি না পাওয়া যায়, তবে ব্রাউজারটি দ্বিতীয়টির সন্ধান করবে এবং শেষ পর্যন্ত একটি ফ্যালব্যাক "সানস-সেরিফ" ফন্টটি সন্ধান করবে।
এখন, ব্রাউজারটি কোনও ফন্ট ডাউনলোড করার জন্য একটি সিএসএস বিধি হিসাবে একটি ফন্ট URL দিতে পারে:
@import url(http://fonts.googleapis.com/css?family=Droid+Serif:400,700);
এবং তারপরে একটি নির্দিষ্ট উপাদানের জন্য ফন্টটি লোড করুন যেমন:
font-family: 'Droid Serif',sans-serif;
এটি কাস্টম ফন্টগুলি ব্যবহার করতে সক্ষম হওয়ার জন্য খুব জনপ্রিয়, তবে এটি ব্রাউজারের মাধ্যমে সংস্থানটি লোড না হওয়া পর্যন্ত কোনও পাঠ্য প্রদর্শিত হবে না, যার মধ্যে ডাউনলোডের সময়, ফন্ট লোডিং সময় এবং রেন্ডার সময় অন্তর্ভুক্ত রয়েছে। আমি প্রত্যাশা করি যে এটি আপনি নিখুঁতভাবে অভিজ্ঞতা করছেন।
উদাহরণ হিসাবে: আমার একটি জাতীয় সংবাদপত্র ডাগেনস ন্যহেইটার তাদের প্রধান শিরোনামগুলির জন্য ওয়েব ফন্টগুলি ব্যবহার করে তবে তাদের নেতৃত্ব নয়, তাই যখন সাইটটি লোড করা হয় আমি সাধারণত প্রথমে শীর্ষস্থানগুলি দেখি এবং আধা সেকেন্ড পরে উপরের সমস্ত ফাঁকা স্থান জনবহুল হয় শিরোনাম সহ (এটি ক্রোম এবং অপেরাতে সত্য, কমপক্ষে others অন্যদের চেষ্টা করেননি)।
(এছাড়াও, ডিজাইনাররা এই দিনগুলিতে একেবারে যেকোন জায়গায় জাভাস্ক্রিপ্ট ছিটিয়েছেন, তাই সম্ভবত কেউ পাঠ্যটি দিয়ে চালাক কিছু করার চেষ্টা করছেন, যার কারণে এটি বিলম্বিত That এটি খুব নির্দিষ্ট সাইট সুনির্দিষ্ট হবে, যদিও: পাঠ্যগুলির জন্য সাধারণ প্রবণতাগুলি এগুলিতে বিলম্বিত হবে) সময়গুলি উপরে বর্ণিত ওয়েব ফন্টের বিষয়, আমি বিশ্বাস করি))
সংযোজন
এই উত্তরটি খুব উজ্জীবিত হয়ে উঠল, যদিও আমি খুব বেশি বিশদে যাইনি, বা সম্ভবত এই কারণে । প্রশ্ন থ্রেডে অনেক মন্তব্য হয়েছে, তাই আমি কিছুটা প্রসারিত করার চেষ্টা করব (বিষয়টি সুরক্ষিত হওয়ার পরে অনেক মন্তব্য অনেক পরে অদৃশ্য হয়ে গেছে বলে মনে হচ্ছে - কিছু মডারেটর সম্ভবত ম্যানুয়ালি সেগুলি পরিষ্কার করেছিলেন)। এছাড়াও, এই থ্রেডে অন্যান্য উত্তরগুলি পড়ুন কারণ সেগুলি তাদের নিজস্ব উপায়ে প্রসারিত হয়।
ঘটনাটি স্পষ্টতই "আনস্টাইলযুক্ত সামগ্রীর ফ্ল্যাশ" এবং বিশেষত "আনস্টাইলযুক্ত পাঠ্যের ফ্ল্যাশ" হিসাবে পরিচিত। "FOUC" এবং "FOUT" অনুসন্ধান করা আরও তথ্য দেয়।
আমি ওয়েব ফন্টের সাথে ওয়েব ডিজাইনার পল আইরিশের পোস্টকে FOUT এ সুপারিশ করতে পারি ।
এক যেটি খেয়াল করতে পারে তা হ'ল বিভিন্ন ব্রাউজারগুলি এটিকে আলাদাভাবে পরিচালনা করে। আমি উপরে লিখেছি যে আমি অপেরা এবং ক্রোম পরীক্ষা করেছি, যারা উভয়ই একই রকম আচরণ করেছিল। সমস্ত ওয়েবকিট ভিত্তিক (ক্রোম, সাফারি ইত্যাদি) ওয়েব ফন্ট লোডিংয়ের সময় একটি ফ্যালব্যাক ফন্টের সাথে ওয়েব ফন্টের পাঠ্যকে রেন্ডার না করে FOUT এড়াতে পছন্দ করে। এমনকি যদি ওয়েব ফন্ট ক্যাসে নিয়ে যাওয়া হয়, সেখানে হবে বিলম্ব রেন্ডার হতে । এই প্রশ্ন থ্রেডে অনেক মন্তব্য রয়েছে অন্যথায় বলেছে এবং ক্যাশেড ফন্টগুলি এ জাতীয় আচরণ করে তা ভুল বলা যায় তবে উদাহরণস্বরূপ উপরের লিঙ্কটি থেকে:
কোন ক্ষেত্রে আপনি একটি ফাউট পাবেন
- উইল: ডাউনলোড এবং রিমোট টিটিএফ / ওটিএফ / ওয়াফ প্রদর্শন করা হচ্ছে
- উইল: একটি ক্যাশেড টিটিএফ / ওটিএফ / ওয়াফ প্রদর্শন করা হচ্ছে
- উইল: ডাউনলোড এবং একটি ডেটা-uri ttf / otf / woff প্রদর্শন
- উইল: একটি ক্যাশেড ডেটা প্রদর্শন করা হচ্ছে - uri ttf / otf / woff
- হবে না: এমন একটি ফন্ট প্রদর্শন করা হচ্ছে যা ইতিমধ্যে আপনার andতিহ্যবাহী ফন্ট স্ট্যাকটিতে ইনস্টলড এবং নাম রয়েছে
- হবে না: স্থানীয় () অবস্থান ব্যবহার করে ইনস্টল করা এবং নামযুক্ত একটি ফন্ট প্রদর্শিত হচ্ছে
যেহেতু ক্রোম রেন্ডারিংয়ের আগে FOUT ঝুঁকি না শেষ হওয়া পর্যন্ত অপেক্ষা করে, এটি বিলম্ব দেয়। যে পরিমাণে প্রভাব দৃশ্যমান (বিশেষত ক্যাশে থেকে লোড করার সময়) অন্যান্য বিষয়ের মধ্যে নির্ভর করে বলে মনে হয় যে পাঠ্যটি যে পরিমাণ রেন্ডার করা প্রয়োজন এবং সম্ভবত অন্যান্য কারণগুলির মধ্যে রয়েছে, কিন্তু ক্যাশে প্রভাব পুরোপুরি সরিয়ে দেয় না।
আইরিশ-এর পোস্টের নীচে 2011-04–14 হিসাবে ব্রাউজার আচরণ সম্পর্কিত কিছু আপডেট রয়েছে:
- ফায়ারফক্সের (এফএফবি 11 এবং এফএফ 4 ফাইনাল হিসাবে) আর কোনও FOUT নেই! Wooohoo! http://bugzil.la/499292 মূলত পাঠটি 3 সেকেন্ডের জন্য অদৃশ্য থাকে এবং তারপরে এটি ফ্যালব্যাক ফন্টটি ফিরিয়ে দেয়। ওয়েবফন্ট সম্ভবত এই তিন সেকেন্ডের মধ্যে লোড হবে যদিও ... আশা করি ..
- আইই 9 ডাব্লুওএফএফ এবং টিটিএফ এবং ওটিএফ সমর্থন করে (যদিও এটি এম্বেডিং বিট সেট জিনিস প্রয়োজন - বেশিরভাগ আপনি ডাব্লুওএফএফ ব্যবহার করেন তবে মোট করুন)। যাহোক!!! আইই 9 এর একটি ফাউট আছে। :(
- ওয়েবকিটের একটি প্যাচ রয়েছে 0.5 সেকেন্ডের পরে ফ্যালব্যাক পাঠ্য প্রদর্শন করতে অবতরণের জন্য। এফএফ এর মতো একই আচরণ তবে 3 এস এর পরিবর্তে 0.5 সে।
- সংযোজন : এটির জন্যও ব্লিঙ্ক একটি ত্রুটি নিবন্ধভুক্ত রয়েছে , তবে এটি কী করবে সে সম্পর্কে এটি একটি চূড়ান্ত sensক্যমত্যে পৌঁছেছে না বলে মনে হচ্ছে - বর্তমানে ওয়েবকিটের মতো একই বাস্তবায়ন।
এটি যদি ডিজাইনারদের উদ্দেশ্যে লক্ষ্য করা একটি প্রশ্ন ছিল তবে এই ধরণের সমস্যা যেমন এড়ানো যায় এমন উপায়গুলির মধ্যে কেউ যেতে পারে webfontloader
তবে তা অন্য প্রশ্ন। পল আইরিশ লিঙ্কটি এই বিষয়ে আরও বিশদে যায়।