Cara Mengatasi Pastikan Teks Tetap Terlihat Selama Pemuatan Font Web

Rafiqi, S.Kom.
Rafiqi, S.Kom.
Mei 28, 2021
2

Hi web developer!, kembali lagi bersama guru design. Kali ini kita akan membahas bagaimana Cara Memperbaiki Pastikan Teks Tetap Terlihat Selama Pemuatan Font Web. Mungkin kalian pernah pernah menggalami hal seperti ini setelah mengecek speed blog di PageSpeed Gtmetrix maupun Insights muncul pesan "Pastikan teks tetap terlihat selama pemuatan font web" atau "Ensure text remains visible during webfont load" di bagian diagnostik.

Pasti kalian diamkan saja tanpa melakukan perbaikan karena tidak tau cara memperbaikinya. Tapi tenang, disini kita akan membahas cara memperbaikinya, sebenarnya cara yang akan kita bahas ini dapat anda baca di Forum Pengembangan seperti Google Developers dll.

Jadi, maksudnya dari Pastikan Teks Tetap Terlihat Selama Pemuatan Font Web yaitu saat anda atau pengunjung masuk ke blog atau website maka ada beberapa font yang tidak terlihat saat sedang pemuatan (load) blog tersebut berlangsung, disini google menyarankan kita agar font tersebut tetap terlihat.

Lalu apa yang harus lakukan untuk mengilangkan notif tersebut pada blog tanpa mengurangi fungsi dan kinerja webnya? disini kita akan menggunakan satu cara, padahal banyak cara yang bisa kita lakukan tapi cara ini yang menurut saya paling simpel.

Cara Memperbaiki Pastikan Teks Tetap Terlihat Selama Pemuatan Font Web

Pertama, anda buka Menu Tema >> Edit HTML.

Kemudian cari kode @font-face seperti dibawah ini atau yang mirip.

@font-face {
  font-family: 'Arvo';
  src: local('Arvo'), url(https://fonts.gstatic.com/s/arvo/v9/rC7kKhY-eUDY-ucISTIf5PesZW2xOQ-xsNqO47m55DA.woff2) format('woff2');
}

Setelah ketemu, tambahkan kode font-display seperti ini hasil akhirnya.

@font-face {
  font-family: 'Arvo';
  font-display: swap;
  src: local('Arvo'), url(https://fonts.gstatic.com/s/arvo/v9/rC7kKhY-eUDY-ucISTIf5PesZW2xOQ-xsNqO47m55DA.woff2) format('woff2');
}
Pastikan tambahkan kode font-display disetiap font yang muncul dipesan "Pastikan teks tetap terlihat selama pemuatan font web".

Simpan Tema.

Trimakasi suda menyimak pembahasan kita hari ini semoga berhasil

Sekian tutorial Cara Mengatasi Pastikan Teks Tetap Terlihat Selama Pemuatan Font Web Semoga bermanfaat.
Rafiqi, S.Kom.