Tugas 6 Rekayasa Web

1. Nama : Rima Fauziah
Nim : 1412510917
Kelompok : KI
Tugas 6

2. 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.

3. Contoh :
 1. Skinny Ties
 2. Folksy
 3. United Pixel Workers
 4. Tommy Hilfiger
 5. Currys

4. Contoh Responsive Web Design

5. Perbandingan Framework yang telah
Mengimplementasikan Responsive Web Design
 Bootstrap
 Foundation
 Semantic-UI
 Less Framework
 MQFramework
 Golden Grid System

6.  Bootstrap
Bootstrap telah menyediakan kumpulan komponen
class interface dasar yang telah di rancang
sedemikian rupa untuk menciptakan tampilan yang
menarik, bersih dan ringan. selain komponen class
interface, bootstrap juga memiliki fitur grid yang
berfungsi untuk mengatur layout pada halaman
website yang bisa digunakan dengan sangat mudah
dan cepat. dengan menggunakan bootstrap kita juga
di beri keleluasaan dalam mengembangkan tampilan
website yang menggunakanbootstrap yaitu dengan
cara mengubah tampilan bootstrap dengan
menambahkan class dan CSS sendiri.

7.  Foundation
framework untuk membuat disain web
responsive dengan cepat. Cepat disini bukan
berarti instan kayak popmie. Mengetahui
dasar HTML dan CSS akan sangat membantu
menggunakan framework ini. But fear not,
foundation ini cuma ready made CSS dan
javascript untuk membantu para disainer. Yep,
thats right, designer, not engineer. Belajar
foundation tidak akan memakan waktu lama.

8.  Semantic UI
Semantic-UI disebut sebagai pesaing ketat dari
Bootstrap karena framework yang satau ini
memberikan desain web yang sangat modern
pada pembaruan terbarunya Semantic UI sudah
terintegrasi dengan angular, ember, dan meteor
sehingga sangat cocok digunaka. pada proyek
yang besar dan kompleks.

9.  Less Framework
LESS adalah preprosesor CSS yang memberikan
sentuhan dinamis kepada CSS dengan fitur
variabel, mixin, serta operasi dan fungsi yang
dimilikinnya. Tujuan dibuatnya LESS sendiri adalah
untuk memberikan kemudahan dan keringkasan
dalam membangun tampilan website yang
menggunakan CSS. Proses kompilasi LESS menjadi
CSS dapat berjalan baik di sisi klien
dengan javascript maupun di sisi server dengan
bantuan Node.js dan Rhino. Berkas LESS yang
memiliki format *.less dan akan diubah menjadi file
berformat CSS oleh file javascript less.js pada sisi
klien atau melalui kompilasi pada sisi server.

10.  MQFramework
tersusun dari 12 kolom grid, yang telah
disusun sesuai dengan kebutuhan yang
berbeda, baik dari sebuah proyek baru ke
penyesuaian proyek yang sudah ada dengan
sedikit perubahan pada kode. Satu file CSS
mengimport file-file framework dan custom
stylesheet untuk desain situs kamu. Ini
menggunakan media properti @ untuk
memungkinkan kamu merancang situs yang
kamu bangun ke semua ukuran browser.

11.  Golden Grid System
membagi screen menjadi 18 kolom. Kolom
paling kiri dan paling kanan digunakan
sebagai margin luar dari grid, yang
meninggalkan 16 kolom untuk digunakan
dalam desain layout. 16 kolom dapat
dikombinasikan, atau dilipat menjadi 8 kolom
untuk ukuran tablet screen, dan menjadi 4
kolom untuk ukuran mobile screen.
 Dengan ini Golden Grid System dengan
mudah dapat menutupi setiap ukuran layar
dari 240 hingga 2560 pixel.