Tugas 6 Rekayasa Web 0316 Kel. KI

5
REKAYASA WEB 0316 REKAYASA WEB 0316 KEL. KI KEL. KI NIM 1412511642 NAMA SRI SUSANTO TUGAS 6

Transcript of Tugas 6 Rekayasa Web 0316 Kel. KI

Page 1: Tugas 6 Rekayasa Web 0316 Kel. KI

REKAYASA WEB 0316 REKAYASA WEB 0316 KEL. KIKEL. KI

NIM 1412511642NAMA SRI SUSANTO

TUGAS 6

Page 2: Tugas 6 Rekayasa Web 0316 Kel. KI

Responsive Web Design

Responsive Web Design adalah sebuah teknik yang digunakan untuk membuat layout website menyesuaikan diri dengan tampilan device pengunjung, baik ukuran maupun orientasinya. Jadi tampilan yang berada di desktop komputer dengan tampilan yang diakses melalu SmartPhone misalnya, itu akan berbeda tampilannya. Responsive Web Design Untuk mengetes tampilan yang menggunakan teknik Responsive tersebut tidak harus mengaksesnya melalui mobile device ataupun device lainnya, namun cukup dengan meminimize browser saja ke dalam ukuran mobile device yang diinginkan, kita sudah dapat melihat tampilan website kita pada layar mobile device.

Page 3: Tugas 6 Rekayasa Web 0316 Kel. KI

KELEBIHAN DAN KEKURANGAN Responsive Web Design

Teknik ini sudah mulai banyak digunakan dikalangan web desainer luar maupun lokal dan memiliki beberapa keuntungan, salah satunya adalah penghematan penggunaan sub domain, yang tadinya kalau mengakses harus menggunakan kata “mobile” atau “m” didepan domainnya, sekarang cukup dengan mengetik nama domainnya saja dan tampilan akan menyesuaikan dengan device yang digunakan. Keuntungan yang paling utama tentu saja dapat mengurangi jumlah development menjadi satu saja untuk dipakai semua devices. Lalu kelemahan dari teknik ini adalah jika digunakan pada website yang bertujuan untuk menampilkan gambar saja, seperti website fotografi misalnya. Resource gambar yang diload oleh device kita akan sama dengan yang diload dikomputer kita. Untuk itu kita perlu memperhatikan apakah website yang kita buat cocok untuk dipakaikan teknik Responsive ini.

Page 4: Tugas 6 Rekayasa Web 0316 Kel. KI

Beberapa contoh web dengan karakter Responsive Web Design!

3200tigres.wwf.fr

stephencaver.com

spigotdesign.com

forefathersgroup.com foodsense.is

deren.me

colly.com

alistapart.com example

http://hiduptreda.com

Page 5: Tugas 6 Rekayasa Web 0316 Kel. KI

Bandingkan beberapa contoh framework yang telah mengimplementasikan Responsive web design, seperti Bootstrap, Foundation?Bootstrap

FoundationBootstrap merupakan framework HTML, CSS, dan JavaScript terpopuler untuk pengembangan website responsive, serta proyek mobile pertama kali yang digunakan di web. Fitur-fiturnya yang dikemas dengan baik yang sangat mendukung sekali bagi keperluan Anda untuk pengembangan situs yang responsive dan aplikasi.

Foundation merupakan framework front-end responsive terpopuler lainnya. Dengan framework HTML5 yang modern ini, Anda dapat mendekati desain web juga untuk mobile, atau menampilkan dari ukuran layar besar ke ukuran mobile.

Foundation ini bisa dipergunakan untuk situs yang responsive, email dan aplikasi sehingga terlihat begitu menakjubkan pada setiap perangkat. Sehingga foundation ini dapat dijadikan pilihan yang profesional bagi desainer, developer dan dikerjakan secara tim.

Bootstrap memiliki layout grid responsive dengan 12 kolom, komponen ikonik, kustom jQuery plugin, dan masih banyak lagi. Bootstrap telah terdokumentasi dengan baik sehingga mudah memandu Anda untuk menggunakannya. Framework ini adalah platform open source, jadi gratis untuk Anda gunakan, jangan khawatir sudah banyak tutorial yang tersedia.