web desain hari ini
TRANSCRIPT
![Page 1: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/1.jpg)
WEB DESAINHARI INI
oleh @edypang
![Page 2: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/2.jpg)
Hi, sayaEDY PANG
D S A I N E R
![Page 3: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/3.jpg)
B R A N D I N GI D E N T I T Y
![Page 4: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/4.jpg)
M A G A Z I N EL A Y O U T
![Page 5: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/5.jpg)
INFOGRAPHICD E S I G N
![Page 6: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/6.jpg)
W E B S I T ED E S I G N
![Page 8: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/8.jpg)
echnology makes people’s life easier. But it only works when
it’s well designed.
For that reason, I constantly learn to synchronize products with human needs & behaviors, to build things that beautifully, functionally work”
MY VISION ON DESIGN
“T
![Page 9: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/9.jpg)
1/2
Saya harap Andasemua adalahweb desainer
![Page 10: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/10.jpg)
2/2
Jika bukan,berpura-puralah
demikian
![Page 11: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/11.jpg)
DEAL?
![Page 12: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/12.jpg)
WEB DESAINHARI INI
oleh @edypang
![Page 13: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/13.jpg)
SIAPAWEB DESAINER
![Page 14: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/14.jpg)
Pekerja Web:
WEB DESAINER
WEB DEVELOPER
![Page 15: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/15.jpg)
WEB DESAINER
![Page 16: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/16.jpg)
WEB DESAINER
“DESIGN”
![Page 17: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/17.jpg)
WEB DESAINER
Tampilan, Keindahan, Kenyamanan,
Kecepatan, Konsistensi, Brand, Image,
Mockup, Frontend Code
![Page 18: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/18.jpg)
WEB DEVELOPER
![Page 19: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/19.jpg)
WEB DEVELOPER
“ENGINE”
![Page 20: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/20.jpg)
WEB DEVELOPER
Server, Kualitas kode, Fungsi Aplikasi,
Kecepatan, Keamanan, Engine Code
![Page 21: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/21.jpg)
Hey, Web designer!Do you know what you do?
![Page 22: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/22.jpg)
ost people make the mistake of thinking design is what it looks
like. That’s not what we think design is. It’s not just what it looks like and feels like. Design is how it works”
Steve Jobs
“M
![Page 23: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/23.jpg)
designer who does not write markup and css is not designing
for the web, but drawing pictures”
Andy Rutledge
“A
![Page 24: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/24.jpg)
Hey, Web designer!Do you really know
what you do?
![Page 25: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/25.jpg)
Memikirkan Kembali tentang
Website
![Page 26: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/26.jpg)
Bagaimana Semestinya
Web Desainer Membuatnya
![Page 27: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/27.jpg)
Desainer =Partner Klien
1
![Page 28: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/28.jpg)
SAME VISION
![Page 29: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/29.jpg)
Bersikap sebagaipartner, bukan
pekerjanya
1 Desainer adalah Partner Klien
![Page 30: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/30.jpg)
Dengarkan,berhenti bilang“saya ahlinya”
1 Desainer adalah Partner Klien
![Page 31: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/31.jpg)
Usulkan danJelaskan Ide
1 Desainer adalah Partner Klien
![Page 32: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/32.jpg)
Website =Produk
2
![Page 33: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/33.jpg)
Website bukangrafik art
2 Website adalah Produk
![Page 34: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/34.jpg)
Web desainermembuat website berguna dan laku
2 Website adalah Produk
![Page 35: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/35.jpg)
Web desainer =produk desainer
2 Website adalah Produk
![Page 36: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/36.jpg)
Web desain =Kompleks
3
![Page 37: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/37.jpg)
Web desain =UI, UX, Visual performance
3 Web Desain itu Kompleks
![Page 38: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/38.jpg)
Spesialis UI, SpesialisUX, Spesialis Frontend
= Web Desainer
3 Web Desain itu Kompleks
![Page 39: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/39.jpg)
Para spesialis,Duduklah di depan
meja yang sama
3 Web Desain itu Kompleks
![Page 40: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/40.jpg)
3 Web Desain itu Kompleks
Tim webdesainer
UI
UX Front-end
![Page 41: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/41.jpg)
3 Web Desain itu Kompleks
Tim webdesainer
UI
UX Front-end
Copy-writer
![Page 42: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/42.jpg)
Jika bekerja sendiri,memiliki pengetahuan
tentang itu semuaadalah wajib
3 Web Desain itu Kompleks
![Page 43: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/43.jpg)
3 Web Desain itu Kompleks
Solo web desainer
UI
UXFront-end
![Page 44: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/44.jpg)
Cara lamaOwner (Brief) => Desainer (PSD)
=> Frontend developer (HTML/CSS)
=> Web Programmer
![Page 45: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/45.jpg)
Cara lamaSeringkali, dari satu proses ke proses
yang lain tidak ada sharing ide
![Page 46: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/46.jpg)
Cara lama
RESIKO: Owner => Desainer
Hasil kurang akurat karena desainer hanya
menggambar. Kurang dasar. Menjadi beban
sendiri.
![Page 47: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/47.jpg)
Cara lama
RESIKO: Desainer => Frontend Developer
Desainer kecewa karena hasil tidak sesuai
harapannya.
![Page 48: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/48.jpg)
Cara lamaAsal tidak ada kesalahpahaman,
proses akan berjalan aman
PROBLEM: HASILNYA TIDAK
AKAN JADI LUAR BIASA
![Page 49: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/49.jpg)
Rethink:
Hasil yang biasa saja
akan menjadikan kita
web desainer yang
biasa saja
![Page 50: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/50.jpg)
Cara seharusnyaIngatlah bahwa web desainer mendesain
produk. Bukan sekedar menjadi “pekerja”
![Page 51: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/51.jpg)
Cara seharusnyaSpesialis UI, Spesialis UX, Spesialis frontend
bekerjalah pada dalam pemahaman sama.
Pahami brief bersama.
![Page 52: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/52.jpg)
Cara seharusnyaBanyak kepala seharusnya lebih baik
daripada satu kepala
![Page 53: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/53.jpg)
Cara seharusnyaNo one is expert.
Dengarkanlah ide orang lain.
![Page 54: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/54.jpg)
Cara seharusnyaSampaikan ide. Ide desain kemungkinan akan
lebih dapat diterima karena telah dipikirkan
bersama dari berbagai sisi.
![Page 55: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/55.jpg)
Cara seharusnyaLanjutkan proses desain sesuai hasil yang
disepakati
![Page 56: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/56.jpg)
Cara seharusnyaBila bekerja sendiri, libatkan diri kita
ke semua spesialiasi tersebut
![Page 57: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/57.jpg)
Rethink:
Mendesain website
bersifat krusial.
Karena merupakan
proses awal.
![Page 58: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/58.jpg)
Akurasi tujuanwebsite = tanggungjawab web desainer
4
![Page 59: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/59.jpg)
Dengarkan klien
4 Akurasi Tujuan Website adalah Tanggung Jawab Web Desainer
![Page 60: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/60.jpg)
Gunakan pemahamankita dengan maksimal
untuk membuat desainyang sesuai tujuan
website
4 Akurasi Tujuan Website adalah Tanggung Jawab Web Desainer
![Page 61: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/61.jpg)
Jangan asalmengikuti tren
4 Akurasi Tujuan Website adalah Tanggung Jawab Web Desainer
![Page 62: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/62.jpg)
Setiap website =produk yang unik
4 Akurasi Tujuan Website adalah Tanggung Jawab Web Desainer
![Page 63: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/63.jpg)
Kenali sasaran(pengguna) website
4 Akurasi Tujuan Website adalah Tanggung Jawab Web Desainer
![Page 64: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/64.jpg)
Content is KingDesign is Queen
4 Akurasi Tujuan Website adalah Tanggung Jawab Web Desainer
![Page 65: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/65.jpg)
Web desainakan semakin
rumit
5
![Page 66: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/66.jpg)
Teknologiberkembang (pesat)
5 Web Desain akan Semakin Rumit
![Page 67: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/67.jpg)
Beragam devicedengan dimensi,
resolusi dan density yang berbeda
5 Web Desain akan Semakin Rumit
![Page 68: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/68.jpg)
Browser bersaingmenampilkan fitur
tercanggih
5 Web Desain akan Semakin Rumit
![Page 69: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/69.jpg)
Kecepatan dankemampuan browser mengadopsi “fitur & standar” yang baru
berbeda-beda
5 Web Desain akan Semakin Rumit
![Page 70: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/70.jpg)
Photoshop / Fireworks tidak menghasilkan
desain final
5 Web Desain akan Semakin Rumit
![Page 71: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/71.jpg)
Pixel perfect menjaditidak mungkin
5 Web Desain akan Semakin Rumit
![Page 72: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/72.jpg)
Animasi dan efekdiputuskan di browser,
dalam frontend development
5 Web Desain akan Semakin Rumit
![Page 73: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/73.jpg)
Web desainerdituntut terus belajar,
lebih cepat
5 Web Desain akan Semakin Rumit
![Page 74: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/74.jpg)
Haruskahwebsite
responsive?
6
![Page 75: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/75.jpg)
Responsive web bukantren, tapi kebutuhan
6 Haruskah Website Responsive?
![Page 76: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/76.jpg)
6 Haruskah Website Responsive?
![Page 77: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/77.jpg)
Variasi dimensi layarsangat banyak
6 Haruskah Website Responsive?
![Page 78: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/78.jpg)
6 Haruskah Website Responsive?
Android screens, 2012
![Page 79: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/79.jpg)
6 Haruskah Website Responsive?
Samsung phone & tablet screens, 2013
![Page 80: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/80.jpg)
Responsive web = wajib?
6 Haruskah Website Responsive?
![Page 81: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/81.jpg)
Mashable.comMedium.com
Theguardian.com/uk?view=mobile
6 Haruskah Website Responsive?
![Page 82: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/82.jpg)
Mashable.comMedium.com
Theguardian.com/uk?view=mobile
RESPONSIVE
6 Haruskah Website Responsive?
![Page 83: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/83.jpg)
Ebay.comAmazon.com
Facebook.com
6 Haruskah Website Responsive?
![Page 84: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/84.jpg)
Ebay.comAmazon.comFcebook.com
TIDAK RESPONSIVE
6 Haruskah Website Responsive?
![Page 85: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/85.jpg)
Responsive ataumobile version?
6 Haruskah Website Responsive?
![Page 86: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/86.jpg)
PertimbangkanPutuskan
Itu pilihan
6 Haruskah Website Responsive?
![Page 87: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/87.jpg)
RWD Tips#1 SIMPLE LAYOUT
Responsive Web Design Bagus
untuk layout yang simple
![Page 88: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/88.jpg)
RWD Tips#2 MOBILE FIRST
Develop website dimulai untuk layar
mobile, baru kemudian ke layar
yang lebih besar (desktop)
![Page 89: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/89.jpg)
RWD Tips#3 SATUAN RELATIF
Gunakan satuan % untuk layout
Satuan em / rem untuk tipografi
![Page 90: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/90.jpg)
RWD Tips#4 GAMBAR RESPONSIF
Aplikasikan teknik responsive images
agar load pada mobile bisa diperkecil
![Page 91: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/91.jpg)
7Kecepatan jugatanggung jawab
Web desainer
![Page 92: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/92.jpg)
W H A A A A T ?
7 Kecepatan Juga Tanggung Jawab Web Desainer
![Page 93: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/93.jpg)
7 Kecepatan Juga Tanggung Jawab Web Desainer
Struktur HTML/CSS yang buruk akanmemperlambat
website
![Page 94: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/94.jpg)
7 Kecepatan Juga Tanggung Jawab Web Desainer
Optimasikan file resource: Javascript,
CSS, Gambar
![Page 95: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/95.jpg)
![Page 96: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/96.jpg)
THAT’S ALL HAPPENING
TODAY
![Page 97: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/97.jpg)
2015?
![Page 98: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/98.jpg)
“Web will be more interesting”
![Page 99: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/99.jpg)
“Web will be more different”
![Page 100: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/100.jpg)
“Web design will be more challenging”
![Page 101: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/101.jpg)
2015Tren & Prediksi
![Page 102: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/102.jpg)
Seiring dengan web yang semakin
kompleks, akansemakin banyak
teknologi dangenerator yang
membantu
![Page 103: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/103.jpg)
![Page 104: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/104.jpg)
Akan lebih banyakwebsite dengan
tipografi dominan
![Page 105: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/105.jpg)
Akan lebih banyakwebsite dengan
tipografi dominan
![Page 106: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/106.jpg)
Website dengananimasi dan efek yang
semakin detail dankompleks
![Page 107: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/107.jpg)
Website dengananimasi dan efek yang
semakin detail dankompleks
![Page 108: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/108.jpg)
Website bertipeinfografis
![Page 109: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/109.jpg)
![Page 110: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/110.jpg)
Website dengangambar besar
![Page 111: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/111.jpg)
Website dengangambar besar
![Page 112: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/112.jpg)
OK, heroes!Let’s make
better websites
![Page 113: Web Desain Hari Ini](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55bde4e9bb61ebcb558b4785/html5/thumbnails/113.jpg)
alling yourself a learner is better than calling yourself an expert”“C