Proses Web Design

posted in: Tutorial Membuat Website | 0

Membuat Arsitektur Informasi

Dalam mendesain sebuah web, langkah pertama adalah mendesain arsitektur informasi. Arsitektur informasi adalah memecah materi web menjadi potongan informasi yang lebih kecil kemudian disusun dalam bentuk struktur. Contoh struktur informasi yang bisa kita buat adalah sebagai berikut:

arsitektur informasi untuk web yang berbasis produk

Gambar 1. Contoh arsitektur informasi untuk web yang berbasis produk

arsitektur informasi untuk web yang berbasis layanan

Gambar 2. Contoh arsitektur informasi untuk web yang berbasis layanan

Ada baiknya kita melakukan riset kecil dengan melihat web-web lain yang memiliki jenis bisnis yang sama/mirip dengan web yang ingin kita buat.

Navigasi dan alur informasi

Umumnya orang hanya berfokus pada navigasi yang ada di bagian atas web, atau yang disebut MENU. Padahal navigasi akan sangat ‘powerfull’ jika kita memikirkan juga bagaimana alur informasi bisa diikuti dengan mudah oleh pengunjung. Sehingga bermanfaat untuk menjaga pengunjung tetap berada di situs kita, melihat lebih banyak informasi yang disediakan, dan menurunkan tingkat “bouncing”. Misalnya dengan meletakan menu di bagian footer dan menampilkan link tambahan untuk artikel-artikel terkait pada bagian bawah halaman web

contoh-dari-detikcom-tentang-merk-suzuki

Gambar 3. Contoh yang dibuat oleh detikcom untuk navigasi yang baik.

Menentukan Layout

Berikutnya adalah mendesain layout. Layout adalah bagaimana blok informasi disusun pada halaman web. Untuk melakukan hal tersebut lebih mudah jika dibuat sketsa. Berikut adalah contoh untuk situs yang berbasis layanan/service:

contoh layout web

Gambar 4. Contoh layout web untuk situs yang berbasis layanan, dengan content portofilio.

Design Grafis dan Warna

Berikutnya adalah membuat desain grafis, menentukan warna, dan mamasukan gambar-gambar. Pada tahap ini, sebaiknya kita melibatkan seorang desain grafis yang ahli dan berpengalaman. Selain karena membutuhkan keahlian dalam penguasaan aplikasi desain grafis seperti Adobe Photoshop atau Illustrator, mereka juga telah terlatih untuk mendapatkan ‘feeling’ desain yang bagus. Untuk penentuan warna kita bisa meminta disesuaikan dengan warna perusahaan/bisnis kita.

Membuat web

Seperti pernah di singgung sebelumnya, proses pembuatan halaman web ini bisa dilakukan dengan 2 cara, membuat langsung dari nol atau menggunakan CMS. Untuk membuat web dari nol, tentu dibutuhkan keahlian tertentu terkait dokumen web seperti HTML, CSS, dan pemrograman web, dan berbagai tools yang dibutuhkan.

Untuk yang menggunakan CMS seperti WordPress, Anda bisa mencari theme atau template dari WordPress atau Joomla yang bisa mendukung baik layout maupun design grafis yang mendekati, untuk kemudian bisa langsung membuat web dan fokus pada isi web. Jika benar-benar ingin membuat web dengan tampilan yang sama persis dengan layout dan desain grafis yang diinginkan, Anda bisa mencari orang biasa melakukan konversi dari desain ke theme WordPress/Joomla tersebut. Atau Anda tertarik untuk belajar sendiri melakukan konversi ini?

Contoh sebuah buku yang bagus tentang desain web adalah “Head First Web Design“, karya Ethan Watrall & Jeff Siarto, penerbit O’Reilly. Dalam buku tersebut dibahas proses web design dengan langkah-langkah yang terstruktur.

Leave a Reply