DIVISI

WEB DESIGN

N
E
X
T

DESIGN
WEB
HOME

ABOUT ME

MATERI

PROJECT

Komunitas Multimedia
Multimdia Amikom
Amikom@@2015
2015

KARYA

DESIGN
WEB
HOME

ABOUT ME

MATERI

PROJECT

PROFIL

i (Koor)

Tri Maretno A (Unit)

14.12.8150

13.12.7582

Arif Rusmandani

Tri Maretno

085702069611

085799333700

76B71E31

7596466D

Komunitas Multimedia
Multimdia Amikom
Amikom@@2015
2015

KARYA

DESIGN
WEB
HOME

ABOUT ME

MATERI

PROJECT

INDIKATOR KOMPETENSI
Anggota diharapkan bisa membuat karya desain website berbasis
gambar .
Anggota diharapkan bisa membuat karya desain website berbasis
HTML
Anggota diharapkan bisa memberikan kontribusi kepada KOMA.
Anggota bisa upload web ke internet menggunakan domain dan
hosting.
Anggota diharapkan bisa mengimplementasikan semua materi yang
diajarkan dalam pengaplikasiannya.

Komunitas Multimedia
Multimdia Amikom
Amikom@@2015
2015

KARYA

DESIGN
WEB
HOME

ABOUT ME

MATERI

PROJECT

SILABUS WEB DESIGN

HTML
Bahasa standar untuk membuat sebuah halaman web.
CSS

Untuk menstrukturkan komponen-komponen web yang beragam.

UI UX Desain
Merancang wireframe dan tampilan User Interface
DESAIN GRAFIS
Pembuatan element halaman web dengan gambar
JQUERY
Komponen/librari/framework yang dibuat dari javascript
JAVA SCRIPT
Untuk menuliskan fungsi pada HTML
BOOSTRAP
Paketan dari bahasa pemrograman : css, java script

Komunitas Multimedia
Multimdia Amikom
Amikom@@2015
2015

KARYA

DESIGN
WEB
HOME

ABOUT ME

MATERI

PROJECT

KARYA

Software tools
Text Editor :
NOTEPAD ++
SUBLIME TEXT

Web Browser :
Mozila Firefox
Google Chrome

Pendukung :
Web Editor :
ADOBE DREAMWEAVER ADOBE PHOTOSHOP
ADOBE ILLUSTRATOR
Komunitas Multimedia
Multimdia Amikom
Amikom@@2015
2015

DESIGN
WEB
HOME

ABOUT ME

MATERI

PROJECT

KARYA

Tentang Web
Definisi Website
Website atau situs dapat diartikan sebagai kumpulan halamanhalaman yang digunakan
untuk menampilkan informasi teks, gambar diam atau gerak, animasi, suara, dan atau
gabungan dari semuanya itu baik yang bersifat statis maupun dinamis yang membentuk satu
rangkaian bangunan yang saling terkait dimana masing-masing dihubungkan dengan
jaringan-jaringan halaman (hyperlink).
Unsur-Unsur Website
Domain name/URL (Uniform Resource Locator)
Hosting/Rumah tempat website
Scripts program
Desain Website

Komunitas Multimedia
Multimdia Amikom
Amikom@@2015
2015

DESIGN
WEB
HOME

ABOUT ME

MATERI

PROJECT

Fungsi web
Diantaranya :
Fungsi Komunikasi (Web Mail, Form Contact, Chatting Form)
seperti : Facebook, Twitter dll
Fungsi Informasi (news, profile company, library, reference)
seperti : Amikom, Detik, Okezone dll
Fungsi Entertaiment (game online, film online, music online)
seperti : Youtube, Soundcloud dll
Fungsi Transaksi (Trasnsaksi, Transfer)
seperti : Lazada, Berniaga
Dll.
Komunitas Multimedia
Multimdia Amikom
Amikom@@2015
2015

KARYA

DESIGN
WEB
HOME

ABOUT ME

MATERI

PROJECT

Kategori Web
Website Personal
Situs yang digunakan untuk
menceritakan tentang biografi diri,
pengalaman pribadi dll.
Contoh : Blog pribadi.

Komunitas Multimedia
Multimdia Amikom
Amikom@@2015
2015

KARYA

DESIGN
WEB
HOME

ABOUT ME

MATERI

PROJECT

Kategori Web
Website Instansi/Pemerintahan
situs jenis ini hanya boleh dipaki untuk keperluan
website pemerintahan yang resmi. Domain negara indonesia
.gov.id

Komunitas Multimedia
Multimdia Amikom
Amikom@@2015
2015

KARYA

DESIGN
WEB
HOME

ABOUT ME

MATERI

PROJECT

Kategori Web
Website
Komersial
(Company
Profile/Online Shop)
situs yang dipakai untuk
menunjukan produk atau jasa suatu
perusahaan atau juga dapat melakukan
transaksi penjualan online. Domain yang
digunakan .com, .co.id dll.

Komunitas Multimedia
Multimdia Amikom
Amikom@@2015
2015

KARYA

DESIGN
WEB
HOME

ABOUT ME

MATERI

PROJECT

Kategori Web
Website Non-Profit
website seperti ini biasanya
dipakai hanya untuk sekolahan, yayasan
dll. Domain yang digunakan .org, .edu dll.

Komunitas Multimedia
Multimdia Amikom
Amikom@@2015
2015

KARYA

DESIGN
WEB
HOME

ABOUT ME

MATERI

PROJECT

KARYA

Perbedaan Web Desain , Web Progamming, Web Develop & Web Master
WEB DESAIN
Seni untuk menciptakan suatu web dari segi tampilan (fisik)
WEB PROGRAMING
Membuat suatu program yang dapat berjalan di website (non fisik)
WEB DEVELOPER
Menciptakan aplikasi berbasis website dengan menggunakan bahasa pemograman
seperti Java, PHP, .NET, atau Python.
WEB MASTER
Bertugas untuk memelihara aplikasi web yang telah dibuat, memastikan website
selalu bisa diakses atau tidak down.

Komunitas Multimedia
Multimdia Amikom
Amikom@@2015
2015

DESIGN
WEB
HOME

ABOUT ME

MATERI

PROJECT

Aplikasi yang harus di pahami

Web Desainer
Client-side scripting: JavaScript
Server-Side scripting: PHP, ASP, dsb.
Cascading Style Sheets
HTML
Manipulasi image : Adobe Photosop, Corel Draw, dsb.
Animasi, biasanya berupa flash.
Web Developer
Client-side: JavaScript
Server side: ASP, ASP.NET, Java, Perl, PHP, Python, Ruby, dsb.
Databases: MySQL, Oracle, dsb.

Komunitas Multimedia
Multimdia Amikom
Amikom@@2015
2015

KARYA

DESIGN
WEB
HOME

ABOUT ME

MATERI

PROJECT

Contoh Web Desain

Komunitas Multimedia
Multimdia Amikom
Amikom@@2015
2015

KARYA

DESIGN
WEB
HOME

ABOUT ME

MATERI

PROJECT

Contoh Web Programing

Komunitas Multimedia
Multimdia Amikom
Amikom@@2015
2015

KARYA

DESIGN
WEB
HOME

ABOUT ME

MATERI

PROJECT

Perbedaan web statis dengan web dinamis

Web Statis
Website yang mana penggunanya tidak bias merubah kontent dari web
tersebut secara langsung menggunakan browser. Dengan pengertian lain web
statis adalah website yang kontennya tidak bisa dirubah oleh penggunanya
secara langsung menggunakan browser.
Ciri-cirinya :
Hanya menggunakan HTML dan bisa dilengkapi dengan CSS.
Tidak memiliki datasbase.
Kontennya hanya diberikan oleh pemilik web.
Jarang di-update.

Komunitas Multimedia
Multimdia Amikom
Amikom@@2015
2015

KARYA

DESIGN
WEB
HOME

ABOUT ME

MATERI

PROJECT

Perbedaan web statis dengan web dinamis

Web Dinamis
Website yang mana pengguna (client) bisa merubah kontendari halaman
tertentu menggunakan browser dan interaksi yang terjadi antara pengguna dan
server sangat kompleks. Permintaan dari pengguna dapat diproses oleh server
yang kemudian ditampilkan dengan isi yang berbeda-berbeda menurut alur
programnya.
Ciri-cirinya :
Menggunakan bahasa pemrograman web seperti PHP, ASP dll
Memiliki database.
Konten di dalamnya bisa dari pengunjung dan bisa juga dari database.
Lebih sering di-update.

Komunitas Multimedia
Multimdia Amikom
Amikom@@2015
2015

KARYA

DESIGN
WEB
HOME

ABOUT ME

MATERI

PROJECT

PROJECT
Hari Ibu (hari-hari besar lainnya)
CC Ultimated
Basskill

Komunitas Multimedia
Multimdia Amikom
Amikom@@2015
2015

KARYA

DESIGN
WEB
HOME

ABOUT ME

MATERI

PROJECT

Referensi pembelajaran

webdesign.tutsplus.com
developer.mozilla.org/id
reference.sitepoint.com/css
abduzeedo.com/tags/sites-week
tympanus.net/codrops
webdesignerdepot.com
1stwebdesigner.com
webdesignerindonesia.net
tutorialzine.com
css-tricks.com
web.appstorm.net
webappers.com
webresourcesdepot.com
blazrobar.com
pixeden.com

creattica.com/css/latest
thefwa.com
unmatchedstyle.com
dribbble.com
smashingmagazine.com
egrappler.com
Pixel2Life
Smasing Magazine Coding
W3Schools
WebMonkey
Sitepoint
Student Web Design Guide
Web Design From Scratch
Net Tuts+
Tutorialzine

Komunitas Multimedia
Multimdia Amikom
Amikom@@2015
2015

KARYA