Tampilan Mobile ukuran layar 240×320 piksel

Tampilan Smartphone ukuran layar 320×480 piksel

Tampilan Smartphone ukuran layar 480×320 piksel

Tampilan Tablet ukuran layar 768×1024 piksel

Tampilan Netbook ukuran layar 1024×600 piksel

Tampilan Laptop ukuran layar 1336×768 piksel

Tampilan Desktop ukuran layar 1600×992 piksel

Bagaimana?
Tampilan blog kalian sudah responsif apa belum? ^_^
Jika sudah BAGUS!! Jika ternyata masih belum, baiknya Anda ganti template saja! Hehehe..
Atau setidaknya Anda berusaha untuk memperbaiki tampilan yang sekarang agar lebih responsif. Sehingga situs Anda bisa tetep tampil prima jika diakses dari berbagai macam ukuran perangkat yang berbeda.

Tips Mudah Membuat Template Menjadi Responsif

Pertama, pastikan template Anda sudah terpasang meta tag viewport.

<meta content='width=device-width, initial-scale=1, maximum-scale=1' name='viewport'/>

Kedua, gunakan pengaturan media queries seperti berikut ini :

@media screen and (max-width:1600px) { .... }
@media screen and (max-width:1336px) { .... }
@media screen and (max-width:1024px) { .... }
@media screen and (max-width:768px) { .... }
@media screen and (max-width:480px) { .... }
@media screen and (max-width:320px) { .... }
@media screen and (max-width:240px) { .... }

Ketiga, jika kalian pengguna blogspot matikan opsi tampilan versi seluler.

*****

Untuk kalian yang tampilan templatenya sudah responsif, coba gunakan tools saya berikut ini:

responsive.chaidir.web.id

Kalian bisa screenshot hasilnya dan bagikan ke media sosial atau sebagai bahan untuk review template blog kalian.

Salam Semangat,
[email protected]