تاخیر اکران داده ها به چه معناست ؟
تاخیر اکران داده ها به چه معناست ؟
مرورگرها معمولا حتی در شرایطی‌که فونت‌های جانشین هم برای وبسایت تعریف و تمجید نمایید، حدود 3 ثانیه چشم به راه می مانند تا فونت اصلی دانلود و استعمال شود. فقط در حالتی که در برهه زمانی 3 ثانیه فونت بارگزاری نشود، از فونت جایگزین به کارگیری می‌نمایند.
فونت جایگزین به طور ذیل تعریف‌و‌تمجید میگردد:
font: 10pt/2 Example, sans-serif;
1
font: 10pt/2 Example, sans-serif;
در قطعه کد بالا فونت اصلی Example و فونت جایگزین sans-serif میباشد که یک خانواده فونت و قابل تعبیروتفسیر بوسیله مرورگرهای گوناگون می باشد.
این تاخیر 3 ثانیه‌ای منجر میگردد کاربرانی که تارنما شمارا گشوده می کنند، درین مقطع نتوانند متن‌های جان دار در ورقه را مشاهده نمایند. گوگل نیز در پایانی به‌روزرسانی‌ها، این تاخیر را احتساب مینماید و آن را در سئو تارنما شما در حیث میگیرد.
چاره تاخیر اکران محتوا چه است ؟
برای حل این خلل در هنگام تمجید فونت میتوانیم مشخص و معلوم کنیم که‌این فونت چه مقدار ضروری هست. مثلا ممکن هست یک فونت برای متن‌های عادی تارنما مستعمل باشد و فونتی دیگر برای تیتر‌ها و متن‌های جانور در اسلایدر وب سایت و یک فونت آیکون برای اکران تصویر کانال‌های اجتماعی.
بسته به اینکه اکران متن به استفاده کننده مهم‌خیس هست یا این که صورت گرافیکی حروف فونت، مورد‌های مختلفی با به کار گیری از فرمان font-display قابل تعریف‌و‌تمجید می باشد:
@font-face {
font-family: \"Example\";
font-display: auto;
src: local(\"Example\"), url( ... ) format( \"woff2\" );
}
1
2
3
4
5
@font-face {
font-family: \"Example\";
font-display: auto;
src: local(\"Example\"), url( ... ) format( \"woff2\" );
}
همانطور که مشاهده میکنید، وضعیت پیش‌فرض این امر auto میباشد که تصمیم‌گیری برای به کارگیری از فونت جایگزین را به مرورگر می دهد.
مورد‌های جانور برای font-display:
font-display: auto;
font-display: block;
font-display: swap;
font-display: fallback;
font-display: optional;
1
2
3
4
5
font-display: auto;
font-display: block;
font-display: swap;
font-display: fallback;
font-display: optional;
در موقعیت block که معمولا مساوی auto میباشد، مرورگر حدود 3 ثانیه متنظر میماند و درصورتی که فونت اصلی بارگزاری نشود، از فونت جایگزین به کار گیری می کند. بعد از آن هر زمانه که فونت اصلی بارگزاری شد آن را جایگزین می کند.
در وضعیت swap روزگار اکران فونت جایگزین بسیار کوتاه‌خیس از 3 ثانیه خواهد بود. فونت اصلی هر روزگار که در دسترس باشد، جایگزین میشود.
در موقعیت fallback فونت اصلی ممکن هست هیچ زمان بارگزاری نشود. این مورد وقتی که اهمیت فونت معدود باشد به کارگیری میشود و مرورگر ممکن می باشد به عارضه ها متعدد از پاراگراف کندی سرعت وب، از بارگزاری فونت اصلی دیده‌پوشی نماید.
در وضعیت optional اهمیت فونت در کمترین مقدار خویش جای دارد و احتمال اینکه به عوارض گوناگون فونت در اضافه مواقع بوسیله مرورگر بارگزاری نشود موجود هست.
پشتیبانی در مرورگرهای گوناگون
این خصوصیت در مرورگرهای امروزی مثل فایرفاکس و کروم پشتیبانی میگردد. اکنون مرورگرهای Edge و IE از font-display پشتیبانی نمیکنند. ولی تا دوران آخرین شدن این ضابطه در نگارش چهارم CSS پشتیبانی از آن گسترش بیشتری خواهد یافت.
با اعتنا به اینکه عدم پشتیبانی از این خصوصیت خلل مهمی به شمار نمی‌رود، می توانید فارغ از نگرانی از آن به کارگیری فرمایید.
تعدادی سفارش و نکته
در هنگام به کارگیری از فونت‌های سفارشی، بهتر میباشد از آیتم Local هم به کارگیری نمایید تا در‌صورتی‌که استفاده کننده تا قبل از این آن فونت را روی سیستم خویش نصب گردیده داراست، فونت مجددا دانلود نشود.
پیکربندی Cache مرتبط با فونت‌ها را به صحت انجام دهید تا دفعات دانلود فونت از سرور شما به دست کم رسد.
تا جایی که ممکن هست از فونت‌های جان دار در CDNهای همگانی به کار گیری نمائید، تا احتمال مو جود بودن فونت روی سیستم یوزرها به حداکثر رسد.
تعداد فونت‌های جان دار در صفحه های را به دستکم موردنیاز برسانید و آنها را به خیر فشرده نمائید.
فونت‌هایی که در رویت کرد نخستین وب سایت مصرف شده‌اند را طوری گزینش و تهیه و تنظیم نمائید که هنگام گشوده شدن تارنما، یوزرها هر چه زودتر متون را مشاهده نمایند.
برای فونت‌های آیکون از مورد font-display: block به کار گیری نمایید تا مطمئن گردید که مرورگر بیشترین کارایی را برای بارگزاری فونت به عمل میگیرد.