Point Penting untuk Membangun Design Web

Haii.. Assalamu'alaikum Wr.Wb

Pada Postingan kali ini, masih berhubungan dengan mata kuliah "Pengantar Web Science", tapi dengan pembahasan yang berbeda. postingan kali ini merupakan tugas ke 2 pada mata kuliah tersebut. pada pembahasan kali ini mengenai apa saja si point penting untuk membangun desain pada sebuah web yang akan kita buat sendiri. jika kalian ingin mengetahuinya, yukk mari sama-sama kita belajar !!!

1. LAYOUT

Dalam dunia desain, Layout berbicara mengenai bagaimana penataan elemen-elemen dalam sebuah halaman dengan benar. Sama seperti tipografi, terdapat sangat banyak elemen-elemen pada layout, yang tentunya tidak akan dapat dibahas pada bagian ini sendiri. Pembahasan layout secara menyeluruh akan memerlukan bukunya tersendiri. Kita akan hanya melihat elemen-elemen layout yang umumnya ditemukan pada dokumen web, dan bagaimana membuat elemen-elemen tersebut dengan HTML dan CSS.

Sebuah dokumen web umumnya memiliki elemen-elemen sebagai berikut:

Elemen-elemen Layout pada Dokumen Web :

Elemen Header

Seperti namanya, merupakan elemen yang berisi judul dan penjelasan lain dokumen. Biasanya elemen ini diisikan dengan logo website, menu-menu global (seperti login dan logout), maupun nama halaman yang sedang ditampilkan.

Elemen Navigation

Elemen navigasi, yang memberikan akses navigasi ke halaman-halaman lain dalam web.

Elemen Sidebar

Elemen pendukung konten, dapat berupa pembantu navigasi konten, ataupun berbagai hal lain seperti daftar konten lain, iklan, atau menu tambahan. Sidebar dapat berada di kiri atau kanan konten, atau bahkan di kiri dan kanan konten, sesuai dengan kreatifitas perancangnya.

Elemen Konten

Isi utama dari dokumen web. Pengguna biasanya datang ke web untuk melihat teks yang berada pada bagian ini.

Elemen Footer

Bagian penutup dari website, yang dapat saja berisi informasi lain tentang website, seperti lisensi pengunaan, sitemap, ataupun link ke website lain.

Tips membuat Layout Situs yang Baik :

• Pengunjung merasa nyaman dengan tampilan (layout) situs, tetapi tetap dapat fokus pada isi (conten)
• Desain situs tidak mengganggu kejelasan bagian isi.
• Pengunjung dapat berpindah ke halaman lain dengan mudah melalui navigasi yang baik, mudah dan informatif.
• Pengunjung merasa bahwa setiap halaman dari situs merupakan satu kesatuan. Setiap halaman memiliki posisi dan kesamaan tampilan (layout), yang berbeda hanya isi (content).  

2.       FONT

font adalah salah satu komponen penting dalam menciptakan harmonisasi dan keindahan sebuah website. Sebaiknya Anda perlu memahami jenis-jenis font yang merupakan hal mendasar sebelum menentukan kombinasi font yang tepat untuk sebuah website maupun keperluan lainnya. Secara umum jenis font dapat dikelompokan dalam beberapa keluarga huruf. Pahami jenis font sebelum menentukan kombinasi font yang tepat

Fungsi Font Menjadi Penting untuk Sebuah Website

•          Dapat mempengaruhi minat baca pengunjung
•          Menciptakan harmonisasi tampilan website
•          Mempermudah pengunjung mengakses website
•          Memperkuat pengalaman pengguna
•          Merefleksikan profesionalisme usaha Anda

Berikut adalah Tips Cara Menentukan Font Sebuah Website

•          Pahami Target Konsumen Anda
•          Perhatikan Tingkat Keterbacaan Website Anda
•          Batasi Pilihan
•          Perbanyak Referensi
•          Manfaatkan Situs Penyedia Kombinasi Font

Beberapa Referensi Website Penyedia Kombinasi Font yang Dapat Anda Gunakan

•          Google Web Fonts Directory
•          Typ.io
•          Type Genius
•          Typewolf

3.       WARNA

Warna merupakan hal penting dan unik dalam dunia desain visual. Warna tidak memiliki bentuk, ukuran maupun simbol untuk menyampaikan pesan secara langsung. Akan tetapi, warna mampu berbicara melalui emosi alam bawah sadar manusia, sehingga dapat mempengaruhi pikiran serta suasana hati orang yang melihatnya.

Tidak ada jumlah yang pasti berapa warna yang efektif dalam sebuah desain website. Penggunaan warna menjadi kebutuhan masing-masing website dan berpegang pada branding perusahaan. Namun tetap disarankan untuk menggunakan kombinasi warna yang minimalis, karena akan lebih mudah dalam memadu warna dengan keseluruhan isi website.

Untuk mempermudah mendapatkan kombinasi warna yang efektif. Gunakan prinsip sederhana 60-30-10 (60%, 30%, 10%), yaitu prinsip warna yang sering dipakai dalam desain interior. Namun sangat membantu untuk kombinasi warna desain website Anda.

Tips Menerapkan Warna Efektif ke dalam Website :

•          Gunakan warna brand Anda
•          Terapkan psikologi warna
•          Sesuaikan warna dengan target pasar
•          Pastikan warna teks kontras dengan background

4.       GAMBAR

·       Gambar yang Berkualitas

Large Foto, Pixelperfect, gambar beresolusi tinggi selalu menjadi pilihan terbaik. Karena merupakan cara termudah untuk membuat website Anda benar-benar terlihat menonjol, terlihat lebih profesional dengan gambar yang tajam dan tidak blur serta dapat meningkatkan perhatian penggunjung terhadap produk atau jasa yang Anda tawarkan. Memasang foto beresolusi tinggi serta memiliki nilai keindahan merupakan cara paling efektif yang dapat Anda tempuh.

·        Sesuai dengan Brand Anda

Gambar yang Anda gunakan harus relevan dengan brand (identitas) merek Anda. Misalkan Anda menjual sebuah produk furnitur berkualitas tinggi. Maka foto-foto yang digunakan pada website harus sesuai dengan produk yang Anda jual. Foto juga harus bisa memberikan kesan kepada pengunjung website bahwa produk yang Anda tampilkan di website memang benar-benar berkualitas tinggi, sebagai contoh, TIDE Design.

·         Actionable

Maksudnya, gambar atau foto yang digunakan harus bisa membujuk/mengarahkan pengunjung website melakukan tindakan pada Call to Action yang terdapat dalam website Anda.

·         Mewakili Sebuah Produk

Foto/gambar yang membantu penjualan suatu produk tentulah yang berkaitan dengan produk tersebut. Untuk membuat kesan lebih menarik kepada pengunjung website Anda gunakanlah foto nyata ketika memakai produk tersebut. Untuk membuat foto produk terlihat hidup pada website.

beberapa tips yang dapat membantu Anda antara lain:

• Menggunakan beberapa gambar untuk menunjukkan produk dari berbagai sudut.
• Pikirkan konteks bagaimana produk harus ditampilkan ke pembeli potensial.
• Pastikan Anda mengizinkan pengunjung untuk melihat gambar produk dengan ukuran besar.
• Jika produk tersedia dalam berbagai ukuran dan warna, pastikan Anda telah menunjukkan semua variasi.

·       Menggunakan Foto Real People

Menggunakan foto orang nyata (real people) memiliki potensi untuk meningkatkan rasio konversi website Anda. Akan tetapi, ada satu aturan dasar yang perlu Anda perhatikan.

·       Unik

Bagaimana jika layanan/produk Anda hanya tersedia untuk pasar yang terbatas, namun masih ingin terlihat menonjol di antara para pesaing Anda? Dalam kasus seperti ini, Anda harus menggunakan gambar yang dapat mendukung dan membedakan merek Anda dari para pesaing. Pikirkan sesuatu yang benar-benar berbeda dari pesaing Anda.


Sumber :
- https://bertzzie.com/knowledge/desain-web-dasar/Layout.html

- https://www.niagahoster.co.id