Konsep Dasar Desain Web

Desain Untuk Sebuah Web

Dalam membuat atau mendesain sebuah web, harus memerhatikan beberapa hal seperti : 

A. Warna

Warna merupakan hal yang sangat penting dalam mendesain sebuah web agar membuat web tersebut menjadi lebih menarik. Pemilihan warna harus sangat diperhatikan dan disesuaikan dengan konsep website kamu. Menurut teori Brewster, untuk menyederhanakan warna  yang ada di alam, warna dibagi menjadi 4 kelompok, yaitu : 

    1. Warna Primer

    2. Warna Sekunder

    3. Warna Tersier

    4. Warna Netral

1). Warna Primer

Warna Primer ada 3 warna yaitu Merah, Kuning, dan Biru.

 2) Warna Sekunder

Warna sekunder ada beberapa warna seperti ungu, orange, dan hijau.

3) Warna Tersier

Berikut adalah warna yang tergolong dalam warna tersier :

4) Warna Netral

Berikut adalah warna yang tergolong dalam warna netral :

Psikologi Warna

Psikologi warna dapat kita pahami salah satunya dengan mengetahui perlambangan warna. Warna memiliki pengaruh yang kuat terhadap sikap dan emosi. Memahami psikologi warna akan membantumu merancang antarmuka yang efektif dan tepat sasaran.

Warna yang Disukai Wanita 

Dalam survei tentang warna dan gender : 

• 35% wanita suka warna biru
• 23% wanita suka warna ungu
• 14% wanita suka warna hijau
• 33% wanita tidak suka warna oranye
• 33% wanita tidak suka warna coklat
• 17% wanita tidak suka warna abu-abu

Warna yang Disuka Pria

Umumnya pria menyukai warna biru, hijau, dan hitam. Sedangkan warna yang tidak disukai kebanyakan pria adalah ungu, orange, coklat.

Makna-Makna Berbagai Warna 

• Biru Menumbuhkan Kepercayaan. 
• Kuning Memancing Rasa Waspada
• Hijau untuk Kesan Alami dan Kreatif
• Orange Melambangkan Kesenangan 
• Hitam Memberikan Kesan 

Palette Color

Color Palette adalah sekumpulan warna yang di mix and match sehingga menghasilkan kombinasi warna yang unik dan menarik. Contohnya : https://colorhunt.co/

RGB (Red, Green, Blue)

RGB adalah sebuah metoda dalam penggambaran warna. RGB (Red, Green, Blue) terdiri dari tiga warna, yaitu Merah, Hijau, dan Biru. Warna umum yang digunakan untuk sebuah website biasanya menggunakan model RGB. Kode RGB menggunakan bilangan Hexadecimal. Hexadecimal basis 16 ( 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F). Contoh Kode Warna RGB :

Type Font

Serif menggunakan tips atau flag dekoratif. Serif biasanya digunakan untuk dokumen atau layar yang mengandung banyak text. Sans Serif tidak menggunakan tips atau flag dekoratif. Sans Serif biasanya digunakan untuk komputer karena dianggap memiliki kontras yang lebih tajam

B. Tipografi

Tipografi adalah suatu teknik dalam memilih dan menata huruf dengan indah dalam suatu ruang yang tersedia. 

1. Judul (Heading)

Sesuai dengan nama nya Heading terletak dibagian atas Website sebagai judul dari website tersebut.

2. Body (Paragraf)

Body berisi paragraf-paragraf. Paragraf pada website hendaknya memiliki ketegasan dan keterbacaan sehingga nyaman untuk dibaca. 

3. Aksen (Penekanan)

Berbagai aksen dari penulisan website atau dalam tipografi website. Bold, Italic, Underline. 

Pemilihan Font

Pahami target pengunjung website

Perhatikan tingkat keterbacaan website

Perhatikan type font (serif & sans serif)

Perhatikan style font (B, I, U)

Perhatikan lowercase atau UPPERCASE font

Perhatikan pewarnaan font (Nyaman di lihat)

Tidak menggunakan terlalu banyak jenis font (Rekomendasi 2 font berbeda)

Perhatikan lisensi font (free atau tidak), disarankan font yang benar-benar gratis untuk apapun.

Jenis Layout Desain Website

• Static - Desain web memiliki ukuran tetap pada semua resolusi browser (pixel)
• Fluid - Desain web dapat menyesuaikan lebar layout sesuai dengan resolusi browser (%)
• Responsive – Desain web dapat berganti layout pada resolusi tertentu (desktop&mobile)
• Responsive fluid – Gabungan Responsive & Fluid (%)
• Horizontal Scrolling- Desain web dengan menampilkan konten Horizontal atau menyamping)
• Parallax Scrolling- Desain web dengan layer atau hanya 1 halaman (one page/single page)

Responsive Web Design

2010 Ethan Marcotte memperkenalkan istilah Responsive Web Design yaitu sebuah metode untuk mengoptimalkan pengalaman pengguna melakukan surfing internet di berbagai perangkat, baik mobile, tablet, maupun desktop.

Format Layout Web

One Column

Two Colums

Three Columns

Content (Gambar, Audio, Video)

• Ukuran gambar/audio/video sekecil mungkin dengan kualitas semaksimal mungkin (< 500 Kb)
• Resolusi gambar/audio/video disesuaikan dengan ukuran file gambar
• GIF - Cocok untuk menambahkan animasi singkat, cara menarik untuk mengambil perhatian pembaca web
• JPEG / JPG - Pas untuk ilustrasi yang kaya warna.
• PNG –Pilihan yang tepat untuk menampilkan logo, screenshot yang detail dan tipografi
• Format audio MP3, OGG dan WAP
• Format audio MP4, OGV dan upload ke YouTube)