Bagaimana mengatur tampilan website di android ?

saya mencoba sebuah aplikasi m-learning berbasis android sederhana.. namun ketika diinstal ke android tampilan nya kurang pas

Bagaimana mengatur tampilan website di android ?

Bagaimana mengatur tampilan website di android ,terimakasih

 

SMA Ditanyakan on 11 April 2016 pada Teknologi.
Tambah Komentar
4 Jawaban

Mengatur tampilan atau membuat responsive website pada perangkat mobile bisa di lakukan dengan mengecek terlebih dahulu tampilannya di situs developer ini

  • https://www.google.com/webmasters/tools/mobile-friendly/

Langkah pertama membuat desain Web Responsive

  • Mengindentifikasi Meta Tag

Kebanyakan browser mobile mengatur skala selebar viewport, Anda bisa menggunakan Tag meta viewport untuk mereset ini. Sertakan meta tag ini di bagian <Head>

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

  • Membuat Media Query

CSS memberikan kondisi bagaimana browser harus merender halaman untuk viewport yang telah di setting lebarnya.
Siapkan CSS Internal seperti dibawah ini sebelum kode </head>

<style>
/* CSS Media Queries */

@media (max-width:769px) { /* Setting Pada Ukuran Layar 769pixel Disini */
#outer-wrapper { max-width:950px; width:100%; }
}

@media (max-width:600px) { /* Setting Pada Ukuran Layar 600pixel Disini */
#main-wrapper { margin:10px!important; }
#sidebar-wrapper { margin:10px!important; position:relative; height:auto; width:auto; }
}
</style>

Megister Terjawab on 11 April 2016
Tambah Komentar

saya make php pak

SMA Terjawab on 12 April 2016
Tambah Komentar

Iya, silahkan cari dokumen HTML di Kode PHP anda. Lalu buat Media Query dan Meta Tag

Megister Terjawab on 12 April 2016
Tambah Komentar

Jika masih belum bisa menjadi responsive. Cara yang cepat dan instant tanpa direpotkan dengan menulis code dari awal, disini saya akan memberikan refrensi tentang framework yang bisa digunakan pada proyek desain web responsif anda

  • Bootstrap
  • Foundation
  • Metro UI
Megister Terjawab on 12 April 2016
Tambah Komentar
  • Jawaban Anda

    Dengan memposting jawaban, anda setuju dengan Kebijakan Privasi dan ketentuan layanan.