Langsung ke konten utama

Cara Mempercepat Loading Teks Huruf dan Postingan Pada Blog Website

Cara Mempercepat Loading Teks Huruf dan Postingan Pada Blog Website
Loading Teks


Menghindari menampilkan teks yang lama terlihat di situs

PeluangSukses.Com Font sering kali merupakan file besar yang membutuhkan waktu beberapa saat untuk dimuat. Beberapa browser menyembunyikan teks hingga font dimuat, menyebabkan kilatan teks tak terlihat (FOIT) .

Audit tampilan font Lighthouse gagal

Lighthouse menandai URL font apa pun yang mungkin menampilkan teks tak terlihat:

Cara termudah untuk menghindari menampilkan teks yang tidak terlihat saat font kustom dimuat adalah dengan menampilkan font sistem untuk sementara. Dengan termasuk font-display:swap dalam Anda @font-face style, Anda dapat menghindari FOIT di sebagian besar browser modern:

@font-face {

  font-family: 'Pacifico';

  font-style: normal;

  font-weight: 400;

  src: local('Pacifico Regular'), local('Pacifico-Regular'), url(https://fonts.gstatic.com/s/pacifico/v12/FwZY7-Qmy14u9lezJ-6H6MmBp0u-.woff2) format('woff2');

  font-display: swap;

}

The font-display API menentukan bagaimana font ditampilkan. swap memberitahu browser bahwa teks yang menggunakan font harus segera ditampilkan menggunakan font sistem. Setelah font kustom siap, itu menggantikan font sistem. (Lihat Hindari teks tak terlihat saat memuat posting untuk informasi lebih lanjut.)

  1. Pramuat font web # Gunakan <link rel="preload" as="font"> untuk mengambil file font Anda sebelumnya.
  2. Google Font # Tambahkan &display=swap parameter ke akhir URL Google Font Anda:

Tempatkan dibawah <head>

<link href="https://fonts.googleapis.com/css?family=Roboto:400,700&display=swap" rel="stylesheet">
Jika template tidak bisa disave bisa menggunakan kode dibawah:
<link display='swap' href='https://fonts.googleapis.com/css?family=Roboto:400,700' rel='stylesheet'/>

Dukungan browser peramban #

Perlu disebutkan bahwa tidak semua browser utama mendukung font-display: swap, jadi Anda mungkin perlu melakukan sedikit lebih banyak pekerjaan untuk memperbaiki masalah teks yang tidak terlihat.*

PeluangSukses.Com

5 Rekomendasi Private Pool Villa di Sekitar Purwokerto Tarif Mulai dari Perjam Hingga Perhari

6 Korean Movies With Historical Themes Insert Uncensored Sex Scenes

8 Situs Penyedia Iklan Crypto Selain Google Adsense Untuk Blog Publishers

10 AutoSurf Traffic Exchange Pertukaran Lalu Lintas Terbaik

Monetisasi Blog Dengan Iklan Native Ads 40 Terbaik Publishers Advertiser

Warung Makan Putri Gunung Baturaden ! Cerita Keluarga

10 Tempat Wisata Malam Purwokerto Bersama Pasangan atau Keluarga

Antara Prestasi Anies dan Prestasi Bank DKI

Kemenangan dan Kekalahan Politik Identitas di 2017 DKI Jakarta

5 Cara Tetap Sejuk di Cuaca Panas Tanpa AC Rumah

Support : Copyright © 2019. Peluang Sukses - Informasi Usaha, Bisnis dan Gaya Hidup - All Rights Reserved