SlideShare a Scribd company logo
NIM : 1311511354
Nama : Samsul Arifin
Mata Kuliah : Rekayasa Web
Penjelasan Responsive Web Design
Pengertian Responsive Web Design
Desain Web Responsif (bahasa Inggris:Responsive Web Design (RWD)) adalah sebuah metode atau
pendekatan sistem web desain yang bertujuan memberikan pengalaman berselancar yang optimal dalam
berbagai perangkat, baik mobile maupun komputer meja. Dengan metode ini, web akan beradaptasi jika
dibuka dari perangkat mobile berukuran kecil maupun perangkat komputer meja dengan ukuran monitor
besar. Ukuran huruf,user interface, gambar dan tata letak akan menyesuaikan dengan lebar layar
dan resolusilayar monitor yang tersedia. Hasilnya pengguna akan merasakan pengalaman mudah
membaca, nyaman dan melihat informasi web tersebut sama dengan jika ia melihat melalui perangkat
komputer meja.
Berawal sekitar tahun 2013, terjadi perubahan peningkatan penggunaan mobile device dengan munculnya
beragam perangkat cerdas yang terintegrasi denganponsel seperti iPhone. Koneksi internet menjadi
sebuah keharusan dalam masyarakat modern, dan tidak dapat dipungkiri kemajuan teknologi dan industri
ini menuntut setiap individual untuk bergabung dalam sebuah jaringan internet melalui
berbagai perangkat cerdas tersebut. Dengan menggunakan ponsel cerdas dan koneksi internet yang
mumpuni, berselancar di internet menjadi hal yang biasa. Individu dapat meng-update statusnya
di Facebook, membaca email, mengirim foto ataupun membaca berita melalui perangkat cerdasnya
kapanpun dan dimanapun dia berada. Namun terkadang keterbatasan teknologi web dengan HTML-nya
masih sering terjadi pada saat itu. Tidak semua web bisa dibuka atau berjalan secara baik di ponsel cerdas
dan Komputer tablet yang umumnya berukuran kecil dibanding perangkat Komputer meja. Bahkan
beberapa fitur terkadang tidak bisa beroperasi. Hal inilah yang membuat para web desainer dituntut
berfikir menggunakan cara baru dalam menyampaikan informasi di dalam web yang bersahabat dengan
perangkat mobile. Desain Web Responsif, membantu menjembatani hal tersebut, dengan menggunakan
teknologi baru HTML5 dan CSS3. Berlahan berbagai situs web besar seperti Google, Amazon.com,
Facebook, Portal berita BBC dan CNN mulai mengadaptasi metode tersebut.
Ciri Web dengan Responsive Web Design :
- User interface-nya beradaptasi di berbagai perangkat berbeda
- Ukuran huruf, tata letak dan gambarnya beradaptasi di berbagai ukuran layar yang berbeda
- Umumnya menggunakan scrolling dan swipe untuk bernavigasi di perangkat mobile
- Lintas Platform
Intinya, Responsive Web Design digunakan supaya tampilan sebuah website dapat dibuka disemua device
dengan berbagai resolusi monitor yang berbeda-beda.
Layar Monitor juga terbagi menjadi 2 jenis:
1. Potrait (Vertical)
2. Landscape (Horizontal)
Ukurannya pun bermacam-macam:
1. 800x600
2. 1024x768
3. 1024x600
4. 1280x1024
5. dan lain-lain
Bisa dikatakan Responsive Web Design sebuah teknik yang menunjukkan bahwa Desain dan
pengembangan harus menanggapi perilaku pengguna berdasarkan pada layar, platform ukuran dan
orientasi.
Dalam pengimplementasiannya, teknik Responsive Web Design terdiri dari campuran grid fleksibel ,
layout, images dan penggunaan query CSS media yang baik.

More Related Content

DOCX
Isfan fs
PDF
Penjelasan bootstrap
PDF
Penjelasan indexing database
PDF
Penjelasan JSON
PDF
Penjelasan json 141151850
PDF
Penjelasan indexing database 1411510850
DOCX
Penjelasan Git dan SVN
PPTX
Tugas rekayasa web 6
Isfan fs
Penjelasan bootstrap
Penjelasan indexing database
Penjelasan JSON
Penjelasan json 141151850
Penjelasan indexing database 1411510850
Penjelasan Git dan SVN
Tugas rekayasa web 6

Similar to Penjelasan Responsive Web Design (20)

PPTX
Tugas 6 rekayasa web 1312510231 rostarina
PPT
Tugas 6 – rekayasa web
PPTX
Desain - Rancangan Antar Muka (User Interface).pptx
PPTX
Resume kuliah tamu
PPTX
Tugas individu pertemuan 06 (19042016)
PPT
Tugas 6 rekayasa web
PPTX
tugas 6 - 0316 (individu)
PPTX
Review kuliah tamu
PPTX
Pengenalan Web Modern.pptx
PPTX
Tugas 6 rekweb 0316
PDF
Makalah Mobile Programming
PDF
Membuat Aplikasi dengan Framework Hybrid Flutter dengan Database Server Docker
PPTX
Tugas 6 rekayasa web
PPTX
PPTX
Tugas 6 rekayasa web
PPTX
Tugas 6 rekweb
DOCX
Tugas 2 Individu Rekayasa Web
PPT
Tugas 6 ku 0316 1311511529
PPT
Tugas 6 ku 0316 1311511529
PPTX
Tugas 6 individu rekayasa web 0316
Tugas 6 rekayasa web 1312510231 rostarina
Tugas 6 – rekayasa web
Desain - Rancangan Antar Muka (User Interface).pptx
Resume kuliah tamu
Tugas individu pertemuan 06 (19042016)
Tugas 6 rekayasa web
tugas 6 - 0316 (individu)
Review kuliah tamu
Pengenalan Web Modern.pptx
Tugas 6 rekweb 0316
Makalah Mobile Programming
Membuat Aplikasi dengan Framework Hybrid Flutter dengan Database Server Docker
Tugas 6 rekayasa web
Tugas 6 rekayasa web
Tugas 6 rekweb
Tugas 2 Individu Rekayasa Web
Tugas 6 ku 0316 1311511529
Tugas 6 ku 0316 1311511529
Tugas 6 individu rekayasa web 0316
Ad

Recently uploaded (9)

PDF
Rekomendasi Riset Lanjutan : perspektif_futurologis.pdf
PDF
Struktur Data - 4 Pointer & Linked List
PPTX
Materi_Array_Karakter_String untuk kelas XI sma.pptx
PDF
Struktur Data - 1 Kontrak Perkuliahan
PDF
Struktur Data - 2 Pengantar Struktur Data
PDF
Struktur Data - 3 Array: Konsep & Implementasi
PPTX
Fiber_expert_development_program_rev.1.pptx
PPTX
BAHASA MELAYU STANDARD kwjekqjeljwqelkqw
PPTX
Pengantar Kriptografi - Keamanan dan Data Privasi
Rekomendasi Riset Lanjutan : perspektif_futurologis.pdf
Struktur Data - 4 Pointer & Linked List
Materi_Array_Karakter_String untuk kelas XI sma.pptx
Struktur Data - 1 Kontrak Perkuliahan
Struktur Data - 2 Pengantar Struktur Data
Struktur Data - 3 Array: Konsep & Implementasi
Fiber_expert_development_program_rev.1.pptx
BAHASA MELAYU STANDARD kwjekqjeljwqelkqw
Pengantar Kriptografi - Keamanan dan Data Privasi
Ad

Penjelasan Responsive Web Design

  • 1. NIM : 1311511354 Nama : Samsul Arifin Mata Kuliah : Rekayasa Web Penjelasan Responsive Web Design Pengertian Responsive Web Design Desain Web Responsif (bahasa Inggris:Responsive Web Design (RWD)) adalah sebuah metode atau pendekatan sistem web desain yang bertujuan memberikan pengalaman berselancar yang optimal dalam berbagai perangkat, baik mobile maupun komputer meja. Dengan metode ini, web akan beradaptasi jika dibuka dari perangkat mobile berukuran kecil maupun perangkat komputer meja dengan ukuran monitor besar. Ukuran huruf,user interface, gambar dan tata letak akan menyesuaikan dengan lebar layar dan resolusilayar monitor yang tersedia. Hasilnya pengguna akan merasakan pengalaman mudah membaca, nyaman dan melihat informasi web tersebut sama dengan jika ia melihat melalui perangkat komputer meja. Berawal sekitar tahun 2013, terjadi perubahan peningkatan penggunaan mobile device dengan munculnya beragam perangkat cerdas yang terintegrasi denganponsel seperti iPhone. Koneksi internet menjadi sebuah keharusan dalam masyarakat modern, dan tidak dapat dipungkiri kemajuan teknologi dan industri ini menuntut setiap individual untuk bergabung dalam sebuah jaringan internet melalui berbagai perangkat cerdas tersebut. Dengan menggunakan ponsel cerdas dan koneksi internet yang mumpuni, berselancar di internet menjadi hal yang biasa. Individu dapat meng-update statusnya di Facebook, membaca email, mengirim foto ataupun membaca berita melalui perangkat cerdasnya kapanpun dan dimanapun dia berada. Namun terkadang keterbatasan teknologi web dengan HTML-nya masih sering terjadi pada saat itu. Tidak semua web bisa dibuka atau berjalan secara baik di ponsel cerdas dan Komputer tablet yang umumnya berukuran kecil dibanding perangkat Komputer meja. Bahkan beberapa fitur terkadang tidak bisa beroperasi. Hal inilah yang membuat para web desainer dituntut berfikir menggunakan cara baru dalam menyampaikan informasi di dalam web yang bersahabat dengan perangkat mobile. Desain Web Responsif, membantu menjembatani hal tersebut, dengan menggunakan teknologi baru HTML5 dan CSS3. Berlahan berbagai situs web besar seperti Google, Amazon.com, Facebook, Portal berita BBC dan CNN mulai mengadaptasi metode tersebut.
  • 2. Ciri Web dengan Responsive Web Design : - User interface-nya beradaptasi di berbagai perangkat berbeda - Ukuran huruf, tata letak dan gambarnya beradaptasi di berbagai ukuran layar yang berbeda - Umumnya menggunakan scrolling dan swipe untuk bernavigasi di perangkat mobile - Lintas Platform Intinya, Responsive Web Design digunakan supaya tampilan sebuah website dapat dibuka disemua device dengan berbagai resolusi monitor yang berbeda-beda. Layar Monitor juga terbagi menjadi 2 jenis: 1. Potrait (Vertical) 2. Landscape (Horizontal) Ukurannya pun bermacam-macam: 1. 800x600 2. 1024x768 3. 1024x600 4. 1280x1024 5. dan lain-lain Bisa dikatakan Responsive Web Design sebuah teknik yang menunjukkan bahwa Desain dan pengembangan harus menanggapi perilaku pengguna berdasarkan pada layar, platform ukuran dan orientasi. Dalam pengimplementasiannya, teknik Responsive Web Design terdiri dari campuran grid fleksibel , layout, images dan penggunaan query CSS media yang baik.