Muhammad Hafid

Blog Belajar Python atau Django

Muhammad Hafid

Tugas kita itu adalah bukan untuk berhasil, tugas kita adalah untuk mencoba, karena di dalam mencoba itulah kita menemukan dan belajar membangun kesempatan untuk berhasil.

Kegunaan Meta Tag viewport di HTML

Wah, biasanya kita sebagai developer web jarang memperhatikan hal-hal tag-ing semacam ini. Saya hampir saja dibuat pusing dengan permasalah di desain website yang saya bangun.


Website sudah disetup responsive desain sesuai dengan ukuran device, mau desktop ataupun mobile. Tetapi disini saya mengalami kendala, yaitu anehnya website yang saya bangun dapat masukan dari rekan saya, dikarenakan tidak bisa di zoom in dan zoom out.?? Saya baru mengalami kendala laporan ini.

Oke ini ternyata bisa menjadi sebuah pelajaran buat saya. Setelah saya googling ternyata ini yang membuat website tidak bisa di zoom in dan zoom out.
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
Wah waah, saya tidak kepikiran yah, hehehe. 
Oke disini saya mendapatkan sumber dari sebuah artikel Membuat tampilan web responsive: dengan meta tag ‘viewport’.

Coba kalian tambahkan tag ini di antara <head></head>
< meta name="viewport" content="width=device-width" >
Lalu kalian coba buka di desktop dan mobile
Coba berikan tag ini, jika kalian membangun website khusus iphone.
< meta name="viewport" content="initial-scale=1" >
Coba gunakan tag ini :
< meta name="viewport" content="maximum-scale=1" >
Berapapun ukuran resolusi browser, tampilan akan 100%. Pada kasus ipad rotation tadi, maka tampilan akan sedikit terpotong pada mode portrait karena skalanya tetap 980px. 

Coba gunakan tag ini :
< meta name="viewport" content="user-scalable=no" >
 User tidak bisa zoom-in dan zoom-out.

Semoga bermanfaat.



Labels: html

Thanks for reading Kegunaan Meta Tag viewport di HTML . Please share...!

0 Comment for "Kegunaan Meta Tag viewport di HTML"

Back To Top