Pemodelan Desain Grafis Yang Diperlukan Dalam Memperindah Tampilan Web
Ada
beberapa hal yang perlu diperhatikan pada desain website, diantaranya adalah:
Penggunaan
warna yang tepat
Warna
sangat berpengaruh dalam sebuah desain. Seperti yang telah kita ketahui, masing
masing warna memiliki karakter tersendiri, dan mecerminkan suasana tertentu.
Skema warna (kombinasi warna) dalam desain harus bisa mewakili karakter yang
diinginkan. Tetapi perlu diingat, kombinasi warna yang berlebihan akan
mengalihkan pengunjung dari konten website.
Teks
yang mudah dibaca
Teks
harus mudah dibaca, hal ini bisa dicapai dengan mengatur kontras warna teks
dengan background. Selain itu penggunaan font yang tepat juga perlu
diperhatikan, jenis font, ukuran font, style dan konsistensinya dalam desain.
Selain itu pengaturan paragraf dan jarak antara teks dengan elemen lain juga
perlu diperhatikan. Whitespace atau ruang kosong antar elemen harus harmonis.
Semua hal tersebut bertujuan supaya Teks mudah dibaca.
Desain
visual yang harmonis
Image
atau gambar secara visual merupakan unsur atau elemen utama dalam desain. Image
bisa digunakan sebai pemanis, atau penyeimbang atau point of interest.
Sebaiknya pemilihan image sesuai dengan keseluruhan tema dan karakter desain
website. Komposisi image dengan elemen lain juga harus sesuai, adakalanya
sebuah website membutuhkan image yang besar (hampir fullscreen) untuk memberi
kesan tertentu, dan dikombinasi dengan teks yang lebih kecil porsinya, ada pula
website dengan komposisi teks yang lebih banyak dan image hanya sebagai unsur
tambahan. Komposisi antara image dengan teks tergantung dari tema dan karakter
yang ingin dibangun.
Yang
penting harus bijaksana dalam memilih, menempatkan, dan mengkomposisi image,
dan yang tidak kalah penting adalah kualitas image itu sendiri. Hal lain yang
harus menjadi pertimbangan adalah besarnya file. Kecepatan load sebuah halaman
website sebagian besar ditentukan oleh besarnya ukuran file, terutama image,
apalagi bagi kita di Indonesia yang kecepatan akses internetnya sebagian besar
dibawah rata-rata.
Layout
yang Simpel
Layout
atau tataletak desain diusahakan sesederhana mungkin, minimalisir elemen-elemen
yang tidak penting, maksimalkan whitespace (jarak antar elemen). Website dengan
layout yang baik, mudah untuk dijelajahi, pengunjung mudah untuk menemukan
sesuatu, dan dengan cepat menemukan apa yang dicarinya.
Layout
yang berantakan membuat pengunjung kesulitan dan membutuhkan waktu lebih lama untuk
menemukan sesuatu. Penempatan yang tidak sesuai, point of interest yang
menyesatkan, dan urutan tata letak yang acak, sangat tidak menguntungkan.
Alur
yang mudah dimengerti
Layout
desain website harus bisa menuntun pengunjung dan mengarahkan mereka ke sesuatu
yang kita inginkan, jadi kitalah yang menuntun alur perhatian pengunjung dari
titik a, ke titik b, ke titik C, dan seterusnya, sehingga tujuan kita dan misi
dari website bisa dicerna dengan baik oleh pengunjung. Hal ini tidaklah mudah,
berbeda dengan media lain seperti televisi, dan koran, audience dalam kendali
pemberi informasi, mereka menerima apa adanya dan pasif, dan tidak melakukan
tindakan aktif untuk memilah. Sedangkan pada website, pengunjung memiliki
kendali penuh, mereka aktif, dan oleh karena itu alur dari desain website harus
jelas dan mudah dipahami agar pengunjung tidak frustasi menemukan apa yang
mereka inginkan.
Menu
Navigasi yang jelas
Salah
satu elemen penting yang juga wajib diperhatikan adalah navigasi atau menu.
Menu navigasi adalah satu-satunya cara pengunjung berinteraksi dengan website.
Ada banyak cara dan banyak desain menu navigasi, tetapi yang tidak boleh
dilupakan adalah fungsi utamanya, sebagai alat interaksi pengunjung dengan
website.
Website
bisa saja mempunyai beberapa menu/navigasi, bisa diatas pada header, atau pada
sidebar, maupun dibawah pada footer. Tidak ada rumus yang mengharuskan dimana
kita menempatkan menu, yang penting harus menyatu dengan alur dan layout desain
sebuah website.
Ada dua hal penting yang membuat website Anda menjadi sukses dan mampu
mendapatkan trafik dalam jumlah tinggi: konten berkualitas dan desain yang unik
serta menarik. Desain website yang tidak rapi dan berantakan memengaruhi
kesempatan konten dibaca oleh pengunjung situs. Pastinya mereka tidak akan
melanjutkan membaca konten jika desain web yang Anda buat ‘merusak’ pandangan
mata. Kalau sudah begini, jumlah pengunjung yang mengakses web Anda akan
berkurang. Oleh karena itu, Anda harus berhati-hati dalam mengatur tata letak website.
Carilah informasi sebanyak mungkin tentang cara desain web guna membantu Anda
dalam menemukan style yang tepat.
Di
artikel ini kami akan membahas cara mendesain website dari
nol. Ada enam langkah yang wajib dilakukan, yakni:
1.
Mencari web hosting yang tepat dan andal.
2.
Memilih platform untuk membuat website.
3.
Menginstall tool yang dibutuhkan untuk
mengonlinekan website.
4.
Membuat mockup untuk desain website.
5.
Membuat prototipe desain.
6.
Mengecek apakah desain terlihat bagus di
perangkat mobile.
Meskipun
masih pemula, Anda tetap bisa membuat website dengan desain yang menarik dan
menakjubkan. Cukup simak tutorial cara mendesain web ini sampai selesai.
Langkah
1: Mencari Web Hosting yang Tepat dan Andal
Sebelum
membahas cara mendesain website lebih lanjut, ada hal paling penting yang tidak
boleh dilewatkan. Carilah web hosting berkualitas untuk mengonlinekan website
Anda.
Kebiasaan
kita adalah memilih sesuatu berdasarkan harga. Mana yang paling murah, itulah
yang punya ‘banyak penggemar’, dan ini juga berlaku ketika kita memilih
hosting. Sayangnya, tindakan ini salah besar. Provider web hosting A belum
tentu menyediakan layanan atau fitur yang sama dengan provider web hosting B.
Jadi, kami sarankan agar Anda melakukan riset singkat hingga menemukan web
hosting yang tepat untuk membuat dan mengonlinekan website.
Berikut
beberapa hal yang harus Anda perhatikan pada saat memilih provider hosting:
·
Memiliki layanan bantuan pelanggan yang
cepat tanggap.
·
Menawarkan performa tingkat tinggi untuk
setiap website yang dibuat di layanan hostingnya.
·
Menyediakan fitur tambahan untuk memudahkan
Anda dalam membuat website, misalnya backup otomatis.
·
Memiliki panduan, artikel, serta knowledge
base (pengetahuan dasar) yang memuat pertanyaan dan jawaban teknis sehingga
Anda bisa dengan cepat menemukan informasi yang dibutuhkan.
·
Kompatibel dengan platform yang akan Anda
gunakan untuk membuat website.
Hampir
sebagian besar provider web hosting mengklaim memiliki semua kriteria di atas.
Anda bebas memilih dan menentukan penyedia hosting yang akan digunakan. Baca
juga review atau ulasan yang ditulis oleh para penggunanya baik di
blog maupun komunitas forum. Di Hostinger, Anda akan menemukan paket hosting yang menawarkan berbagai fitur serta
layanan yang canggih dan berkualitas dengan harga terjangkau:
Apabila
membeli paket hosting Bisnis dan Premium, maka saat itu juga Anda akan
mendapatkan domain gratis. Syaratnya mudah, belilah salah satu paket hosting
tersebut dengan durasi 12 bulan (atau kelipatannya). Jangan lupa selesaikan
prosesnya hingga checkout, ya!
Langkah
2: Memilih Platform untuk Membuat Website
Setelah
mendapatkan layanan hosting yang diinginkan, langkah selanjutnya adalah memilih
platform untuk membuat website. Sebenarnya, Anda bisa membuat website dengan
menerapkan coding. Hanya saja, metode ini terdengar sulit bagi para
pemula. Metode pembuatan website dengan menerapkan berbagai ragam coding atau
bahasa pemrograman hanya untuk para developer yang sudah berpengalaman.
Jika
mengikuti blog kami dari awal, pasti Anda sudah paham bahwa kami sering
menyebutkan Sistem Manajemen Konten (CMS) sebagai salah satu platform terbaik
untuk membuat dan mengonlinekan website. Tool ini memungkinkan Anda untuk
membuat website dengan tampilan profesional serta mengelola sejumlah konten.
Kedengarannya rumit, tapi tool ini benar-benar beginner-friendly alias
mudah digunakan oleh para pemula di bidang pengembangan website.
Ada banyak pilihan CMS yang bisa Anda pilih, misalnya WordPress:
Platform
ini menjadi ‘rumah’ bagi lebih dari 30% website. Sungguh
suatu bukti yang bisa mengklaim bahwa WordPress akan membantu Anda dalam meraih
kesuksesan online. Selain menawarkan kemudahan dalam penggunaan, WordPress juga
menyediakan sejumlah opsi kustomisasi berkat adanya sistem plugin dan tema.
Langkah
3: Menginstall Tool yang Dibutuhkan
Setelah install WordPress, Anda
juga wajib mengaktifkan tool tambahan yang dibutuhkan untuk desain web. Hal
pertama dan paling utama, Anda memerlukan tema yang sesuai dengan style website
yang sudah dikonsepkan sebelumnya.
WordPress memiliki ribuan tema sehingga
Anda tidak akan kehabisan pilihan. Jika ini pertama kalinya menggunakan
WordPress, kami sarankan agar Anda memilih tema gratis untuk membiasakan diri
dengan platform ini. Kunjungi repositori resmi WordPress.org untuk
memilih tema gratis terbaik:
Supaya
Anda tidak ‘tersesat’ dan akhirnya menginstall tema yang salah, sebaiknya baca
terlebih dulu berbagai ulasan atau review dari user dan cek apakah tema
tersebut selalu diupdate. Jangan memilih tema yang terlalu banyak menuai review
negatif dan sama sekali atau jarang diperbarui. Bersikeras memakai tema yang
tidak memenuhi kriteria hanya akan membuat Anda sakit kepala. Jika sudah
menemukan tema yang tepat, segera install dan aktifkan.
Install
pula plugin WordPress page builder.
Dengan plugin ini, Anda bisa lebih mudah desain website. WordPress memang
menawarkan kemudahan penggunaan, tapi dari segi cara mendesain web, dibutuhkan
keahlian dan kreativitas. Menginstall dan mengaktifkan plugin website builder
memberikan Anda kesempatan untuk memodifikasi tampilan web.
Langkah
4: Membuat Mockup untuk Desain Website
Sampai
di sini, Anda sudah punya website berbasis WordPress, tema yang diaktifkan, dan
plugin page builder yang siap dijalankan. Sekarang siapkan kertas dan pensil
atau pulpen (yap, kita akan menggunakan cara tradisional). Anda akan buat
sketsa tampilan website yang diinginkan. Pembuatan sketsa inilah yang kemudian
disebut sebagai mockup.
Anda
tidak harus sebegitu detailnya untuk membuat mockup desain web. Cukup masukkan
semua elemen yang ingin Anda tampilkan ke website. Tentu saja Anda bisa
menambahkan sebanyak mungkin detail elemen yang diinginkan. Nantinya mockup
akan berperan sebagai referensi visual ketika Anda mulai desain website di
WordPress.
Buatlah mockup di komputer jika
Anda lebih suka sketsa digital alih-alih menggoreskan pensil di atas kertas.
Sayangnya membuat mockup di komputer tidak semudah yang dibayangkan. Ada
berbagai proses yang harus dilalui dan tidak bisa dilakukan hanya dalam waktu
semenit.
Silakan
edit dan revisi mockup desain website berulang-ulang kali sampai akhirnya
Anda sreg dengan tata letak dan tampilan.
Langkah
5: Membuat dan Mempertajam Prototipe Desain
Jika
sudah selesai dengan mockup desain web, maka langkah selanjutnya adalah
‘memindahkannya’ ke dalam bentuk digital. Dengan kata lain, Anda akan melakukan
prototipe desain website.
Buka
website builder yang telah diinstall dan diaktifkan dengan menggunakan editor
WordPress. Tambahkan elemen yang Anda inginkan ke halaman website dan mulailah
mengaturnya seperti yang telah dibuat di mockup sebelumnya.
Proses
prototipe desain tergantung dari jenis plugin yang diinstall. Akan ada berbagai
detail di sana, tapi jangan terlalu dipikirkan, misalnya memilih warna atau
ukuran font yang hendak digunakan. Setelah prototipe ini selesai, Anda bahkan
masih punya waktu untuk mengatur hal-hal tersebut.
Hal
terpenting yang sebaiknya dilakukan sekarang adalah menyelesaikan prototipe
website, yang di dalamnya memuat semua elemen yang telah Anda rencanakan
sebelumnya di mockup. Dengan prototipe, Anda bisa mengetahui mana layout yang
tepat dan mana layout yang tidak perlu dimasukkan serta membuat beberapa
perubahan untuk memperbaiki desain website. Poin inilah yang harus Anda
perhatikan dengan saksama.
Ketika
ditransisikan ke prototipe, terkadang Anda akan sedikit ‘melenceng’ dari mockup
yang asli. Sebenarnya, ini hal yang wajar. Bahkan Anda membutuhkan waktu yang
tak sedikit untuk desain web, tergantung pada seberapa perfeksionisnya Anda.
Anda diberikan beragam elemen untuk dikustomisasikan serta opsi layout untuk
digunakan. Jadi, tidak perlu terburu-buru.
Kami
tekankan sekali lagi bahwa untuk saat ini Anda tidak perlu khawatir dengan teks
website dan tipe konten lainnya. Jika ingin proses prototipe dilakukan lebih
cepat, silakan gunakan text placeholders dan stock images. Apabila layout sudah selesai
diatur dan hal lain yang diinginkan telah dimanajemen sesuai dengan keinginan,
maka itulah saatnya Anda menggantikan prototipe dengan konten yang hendak
digunakan.
Langkah
6: Mengecek Apakah Desain Website Terlihat Bagus di Perangkat Mobile
Anda
sudah mempelajari cara desain web. Langkah terakhir, mengecek apakah tampilan
desain sudah terlihat bagus dan berfungsi sebagaimana mestinya di perangkat
mobile atau belum.
Belakangan
ini mobile traffic memberi pengaruh dan dampak yang sangat
signifikan. Karena itulah, Anda harus memastikan bahwa desain web
terlihat mulus bahkan dalam resolusi rendah sekalipun. Apabila seseorang
membuka website Anda melalui smartphone tapi sedetik kemudian hanya tampilan
rusak yang didapat, maka besar kemungkinan dia tidak akan pernah kembali lagi.
Keadaan ini hanya mengakibatkan meningginya bounce rate, sesuatu
yang sebaiknya harus Anda hindari.
Untungnya,
beberapa page builder WordPress (termasuk Beaver Builder) mobile-friendly.
Ini berarti desain website yang Anda buat dengan menggunakan plugin tersebut
akan terlihat ciamik di perangkat mobile.
Meski
telah menggunakan plugin yang mobile-friendly, sebaiknya tetap
lakukan pengecekan mengenai tampilan website di perangkat mobile. Ada banyak
cara atau metode pengecekan. Misalnya, coba akses website Anda melalui
smartphone atau perangkat mobile lainnya. Cara lain yang bisa dicoba adalah
dengan menggunakan Chrome’s Dev Tools, tool
yang memungkinkan Anda untuk memvisualisasikan website di berbagai resolusi.
Untuk
menggunakan dev tool browser, hal pertama yang harus dilakukan adalah akses
website Anda dan klik di area mana saja, kemudian pilih Inspect.
Lihat bagian atas layar. Ada beberapa kolom (field) di mana Anda bisa
menentukan resolusi. Dengan pilihan resolusi inilah Anda bisa melihat bagaimana
tampilan website:
Kami
sarankan untuk mencoba semua pilihan resolusi yang disediakan. Dengan begini,
Anda bisa tahu di resolusi berapa desain web Anda tidak tampil dengan baik.
Jika ada masalah atau error, kembali ke prototipe dan gunakan website builder
untuk mengubah atau memperbaikinya. Apabila sudah tidak ada lagi error, website
siap dionlinekan.
Kesimpulan
Untuk
menarik trafik yang tinggi, Anda harus membuat desain website yang menarik
serta profesional. Dengan desain web yang apik, orang-orang akan lebih betah
dalam membaca konten yang Anda sediakan. Tak jarang konversi pun akan naik.
Anda
tidak perlu menjadi developer untuk membuat tampilan yang cantik. Cari saja
informasi sebanyak mungkin tentang cara mendesain web. Banyak tutorial
(termasuk artikel ini) yang menyampaikan langkah serta cara mendesain website
hingga detailnya. Berlatihlah dengan mengikuti langkah-langkah yang ada pada
panduan tersebut. Dalam beberapa saat, website dengan desain yang menarik
berhasil Anda wujudkan.
Komentar
Posting Komentar