Anda di halaman 1dari 1

1.

Responsive
Secara umum responsive web design merupakan sebuha teknik yang digunakan
untuk membuat tampilan website dapat menyesuaikan diri dengan tampilan device
pengunjung (user), dapat diartikan bahwa tampilan desain dari web tersebut dapat
berubah sedemikian rupa mengikuti perubahan bentuk perangkat yang dipakai.
Pada kasus ini tampilan web yang diambil adalah web dari jurusan Teknik Elektro
Universitas Negeri Malang dengan kata lain script html dan css telah dibuat
sebelumnya, namun jika diperlukan untuk mendesain ulang dapat dibuat dari awal
tampilan web yang lebih menarik.
Jika keadaannya seperti ini, teknik yang digunakan untuk membuat responsive
web design adalah dengan menambahkan file css sendiri diluar dari file css yang telah
ada atau melakukan desain ulang dengan tampilan yang hamper sama.
Untuk perintah responsive yang diletakkan pada file css sendiri berlaku jika
responsive web design dilakukan pada web yang telah ada, sedangkan ketika dilakukan
desain ulang script mengenai responsive web design secara langsung dapat disatukan
dengan style dari file css tersebut. Namun, disamping itu pasti adanya kekurangan dalam
penggunaan kedua teknik tersebut. Pada penggunaan file css tambahan yang dikhususkan
bagi web responsive kekurangannya terdapat pada identitas penamaan dari masing-
masing elemen yang digunakan. Sedangkan untuk mendesain dari awal tampilan dari
sebuah web akan memakan waktu yang lebih lama meskipun responsive web dapat
dilakukan secara langsung pada script html maupun pada css itu sendiri.

2. Transisi
Penggunaan transisi pada perubahan desain tampilan device pengunjung bertujuan
memberikan durasi perpindahan dari sebuah titik awal tampilan menuju titik akhir
tampilan. Secara umum pendefinisian script css transisi sebagai berikut:

-webkit-transition: nama_properti durasi tipe_percepatan delay;


-moz-transition: nama_properti durasi tipe_percepatan delay;
-ms-transition: nama_properti durasi tipe_percepatan delay;
-o-transition: nama_properti durasi tipe_percepatan delay;
transition: nama_properti durasi tipe_percepatan delay;

Mengapa deklarasinya sangatlah banyak? Hal ini bertujuan agar efek transisi dapat
dibaca pada semua web browser. Misalnya untuk webkit digunakan pada chrome dan
safari, moz digunakan pada mozila firefox, ms digunakan pada internet explorer,
serta o digunakan pada opera.
Pada studi kasus yang telah kami buat, efek transisi pada perubahan tampilan web
sedikit terlihat kaku jika perubahan dilakukan dari ukuran dengan resolusi max 479 pixel
ke ukuran 700 pixel ke atas. Hal ini dikarenakan perubahan ukuran width dan lenght
terhadap tempat semula tidak sama sehingga ketika penempatan berubah maka masih
terlihat efek transisi yang kaku dari perpindahan konten tampilan web.

Anda mungkin juga menyukai

  • Tugas Teks Prosedur
    Tugas Teks Prosedur
    Dokumen4 halaman
    Tugas Teks Prosedur
    Putri Isti Arifah
    Belum ada peringkat
  • 5 6160987688255094801
    5 6160987688255094801
    Dokumen34 halaman
    5 6160987688255094801
    Putri Isti Arifah
    Belum ada peringkat
  • Cover Proposal
    Cover Proposal
    Dokumen4 halaman
    Cover Proposal
    Putri Isti Arifah
    Belum ada peringkat
  • Kunci Jawaban Soal PAS Kelas 6 Tema 3
    Kunci Jawaban Soal PAS Kelas 6 Tema 3
    Dokumen2 halaman
    Kunci Jawaban Soal PAS Kelas 6 Tema 3
    Putri Isti Arifah
    67% (3)
  • Print Soal
    Print Soal
    Dokumen87 halaman
    Print Soal
    Putri Isti Arifah
    Belum ada peringkat
  • Bab 1 2 3
    Bab 1 2 3
    Dokumen34 halaman
    Bab 1 2 3
    Putri Isti Arifah
    Belum ada peringkat
  • SOAL
    SOAL
    Dokumen2 halaman
    SOAL
    Putri Isti Arifah
    Belum ada peringkat
  • Protokol Routing
    Protokol Routing
    Dokumen7 halaman
    Protokol Routing
    Putri Isti Arifah
    Belum ada peringkat
  • Output
    Output
    Dokumen48 halaman
    Output
    Putri Isti Arifah
    Belum ada peringkat
  • Uts SBK
    Uts SBK
    Dokumen5 halaman
    Uts SBK
    Putri Isti Arifah
    Belum ada peringkat
  • DJFDK
    DJFDK
    Dokumen2 halaman
    DJFDK
    Putri Isti Arifah
    Belum ada peringkat
  • Tema Tik
    Tema Tik
    Dokumen5 halaman
    Tema Tik
    Putri Isti Arifah
    Belum ada peringkat
  • Ujian Asj Proprof Quiz
    Ujian Asj Proprof Quiz
    Dokumen24 halaman
    Ujian Asj Proprof Quiz
    Putri Isti Arifah
    Belum ada peringkat
  • Tema 4 Subtema 1
    Tema 4 Subtema 1
    Dokumen4 halaman
    Tema 4 Subtema 1
    Putri Isti Arifah
    Belum ada peringkat