Mengatur Spasi Antar Huruf di Blog

Pada tutorial kali ini, saya akan menjelaskan cara mengatur jarak (spasi) antar huruf pada artikel atau postingan di Blog. Ketika kita membuat blog, selain konten yang menarik juga dibutuhkan rancangan blog yang membuat pengunjung betah. Diantara hal yang menyebabkan tidak betahnya pengunjung yaitu dengan melihat tampilan blog yang tidak tertata rapih.

Beberapa huruf, apalagi menggunakan google font, terkadang terlihat terlalu rapat atau sebaliknya terlalu renggang. Untuk pengaturannya kita perlu menambahkan sedikit kode CSS. Kode CSS ini diberi nama Letter Spacing.

Letter Spacing CSS

Apabila ingin merenggangkan spasi antar huruf, maka kode CSS nya

letter-spacing:1px; /* atur kerenggangan dengan menambah px */

maka hasilnya seperti ini :
Contoh spasi renggang

Apabila ingin merapatkan spasi antar huruf, maka kode CSS nya

letter-spacing:-1px; /* atur kerapatan dengan mengurangi px */

maka hasilnya seperti ini :
Contoh spasi rapat

Contoh Penggunaan

Sebagai contoh, Anda ingin merenggangkan huruf pada Judul Artikel, maka langkah detailnya seperti ini :

1. Login ke Blogger
2. Dari dasboar klik Template --> Edit HTML --> Lanjutkan
3. Cari .post h2 atau sejenisnya, tambahkan kode letter-spacing:1px; misalkan hasilnya seperti ini :

.post h2{
font-size:22px;
font-family: Arial, sans-serif;
color:#333;
margin:10px;
letter-spacing:1px
}

4. Simpan Template

Apabila masih ada pertanyaan tentang cara mengatur spasi antar huruf, silahkan isi kolom komentar...