Wednesday, 8 July 2015

Mengenal Responsive Web Design

Sampai saat ini website banyak yang di bangun dengan lebar tetap, misal 960 pixel, dengan lebar tetap tersebut diharapkan bahwa semua pengunjung website mempunyai pengalaman yang sama yaitu lebar tampilan situs yang tetap. Sayangnya lebar tetap ini tidak terlalu lebar untuk layar laptop. Dan pengguna dengan layar resolusi yang besar akan memiliki banyak sisa ruang kosong di samping sisi kiri dan kanan website.

Tapi saat ini kita mengenal smart phone. dan kita mengenal iPhone Apple yang pertama kali memperkenalkan pengalaman browsing menggunakan telepon, kemudian banyak lagi vendor smartphone lain yang mengikuti jejak dari Apple tersebut. Tidak seperti penerapan layar ukuran kecil yang terdahulu, yang diperlukan ketangkasan menggunakan ibu jari seperti pada kejuaraan dunia Tiddlywinks, masyarakat sekarang lebih nyaman menggunakan ponsel mereka untuk browsing website. Selain  itu ada sebuah perkembangan trend konsumen yaitu menggunakan perangkat dengan layar kecil (tablet da netbook misalnya) selain penggunaan perangkat dengan layar penuh untuk penggunaan di rumah rumah. Fakta yang tak terbantahkan adalah bahwa jumlah orang yang menggunakan perangkat dengan layar kecil untuk menggunakan internet ini tumbuh meningkat penggunaannya, sementara ada juga yang menggunakan layar dengan skala 27 inchi dan 30 inchi. Dan sekarang terjadi perbedaan tampilan antara menggunakan layar kecil dan layar besar dari sebelumnya.

Untungnya saat ini ada solusi untuk menyesuaikan antara penggunaan layar lebar dan layar kecil, yaitu sebuah desain web responsif yang dapat dibangun dengan HTML5 dan CSS3. Memungkinkan sebuah website untuk "hanya bekerja" pada beberapa perangkat dan layar. Dan kabar baiknya adalah semua teknik dapat  dilaksanakan tanpa menggunakan basis server/backend solusi.

Dan untuk artikel selanjutnya kita akan membahas :
  • Pentingnya mendukung perangkat layar kecil
  • Menentukan desain "Mobile Website"
  • Menentukan desain "Responsive Website"
  • Melihat contoh desain web responsif
  • Mempelajari perbedaan antara viewport dengan ukuran layar
  • Menginstal dan menggunakan viewport untuk mengubah ekstensi browse
  • Menggunakan HTML5 untuk membuat markup yang lebih bersih dan ramping
  • Menggunakan CSS3 untuk solusi tantangan website umum.

No comments:

Post a Comment