Prinsip Dasar Desain Situs Web

Anda tahu bahwa Anda memerlukan situs web atau mungkin Anda memerlukan desain ulang situs web tetapi Anda berteriak pada kata-kata HTML, CSS, dan Java. Lagi pula, itu bukan kata-kata bahasa Inggris. Itu adalah nama-nama bahasa yang sama sekali berbeda yang terlihat seperti sup alfabet bagi yang belum tahu. Yah, santai. Karena prinsip desain situs web yang dibahas di sini tidak ada hubungannya dengan pengkodean.

Pedoman ini Mereka akan mengarahkan Anda ke templat, gambar, dan aturan terbaik untuk diingat.

Artikel ini mencakup:

• Hirarki visual
• Tata letak Gutenberg, Z, dan F
• Rasio emas
• Aturan sepertiga
• Teori warna
• Teori Gestalt
• Ruang negatif dan minimalis
• Desain yang dioptimalkan untuk seluler

Apakah Anda ingin membuat situs web pribadi yang mengembangkan merek Anda atau Anda ingin penyegaran dalam desain situs web untuk usaha kecil, ingatlah prinsip-prinsip ini. 

Hirarki visual

Hirarki visual adalah kepentingan relatif yang diberikan pemirsa ke sekumpulan objek yang dibedakan secara visual.

Itu cara yang bagus untuk mengatakan bahwa ketika Anda melihat banyak hal, Anda cenderung fokus pada hal-hal yang menonjol. Anda lebih memperhatikan objek yang menonjol.

Bagaimana cara bermainnya? Nah, jika Anda melihat sekelompok gambar dengan berbagai ukuran, Anda secara alami akan menetapkan pentingnya gambar yang lebih besar daripada yang lebih kecil. Jika Anda melihat sekumpulan kata yang berwarna hitam dan satu ditulis dalam warna magenta, Anda akan tertarik pada kata magenta.

Anda dapat bermain dengan beberapa elemen berbeda untuk membuat hierarki visual dan menarik perhatian pemirsa di tempat yang Anda inginkan. Ini termasuk:

• Ukuran dan skala. Ukuran relatif penting, tetapi begitu juga skala. Jika ada sesuatu yang jelas lebih besar atau lebih kecil dari yang "seharusnya", Anda akan menyadarinya.
• Fokus. Gambar dan font di luar fokus terasa lebih jauh daripada yang fokus tajam.
• Warna. Perubahan warna, bayangan, atau intensitas semuanya bisa menarik perhatian.
• Jenis huruf. Ukuran teks, font, dan efek membantu Anda menentukan peringkat informasi pada halaman.
• Pergerakan. Jika satu gambar memantul ke halaman yang statis, Anda akan melihat gambar yang bergerak tapi hati-hati. Terlalu banyak gerakan bisa membingungkan.
• Ruang negatif. Anda dapat mengisolasi elemen kunci untuk membuatnya menonjol dari area halaman yang lebih padat.

Anda akan melihat bahwa banyak dari prinsip desain situs web ini dimulai dari tempat yang intuitif. Manfaatkan hierarki visual dengan menyoroti informasi dan visual penting.

Tata letak Gutenberg, Z, dan F

Organisasi adalah cara lain untuk membangun hierarki. Anda dapat memanfaatkan kebiasaan menonton yang alami untuk menempatkan informasi dan peluang terpenting Anda seperti formulir pendaftaran email yang penting untuk strategi pemasaran e - niaga di mana browser cenderung berhenti.

The tiga layout yang paling umum digunakan adalah tata letak Gutenberg, tata letak Z, dan tata letak F. Masing-masing menggunakan prinsip desain situs web yang berbeda.

Tata letak Gutenberg

Yang paling sederhana dari ketiganya bisa sangat efektif bila digunakan dengan benar. Tata letak Gutenberg membagi halaman menjadi empat kuadran. Karena Anda membaca dari kiri ke kanan dan dari atas ke bawah, itu memberikan kepentingan relatif untuk masing-masing kuadran.

Informasi penting yang paling harus ditempatkan di bagian atas kiri dan kuadran kanan bawah. Materi yang cukup penting berada di kuadran kanan atas. Kiri bawah hanya boleh menampung informasi dan gambar yang dapat dengan cepat dipindai atau diabaikan sama sekali.

tata letak Z

Tata letak Z berfungsi paling baik untuk halaman minimalis yang tidak perlu menyajikan banyak informasi. Ini mengambil keuntungan dari praktik membaca umum yang sama, tetapi menggambar pola yang berbeda melalui mereka.

Pemirsa memindai secara horizontal (kiri ke kanan) di sepanjang bagian atas halaman, memotong secara diagonal dari kanan atas ke kiri bawah, lalu bergerak secara horizontal ke kanan bawah.

Dalam tata letak Z, Anda menempatkan bahan di masing-masing dari empat sudut dan di tengah diagonal.

Tata letak F

Tata letak F berfungsi lebih baik saat Anda ingin memasukkan lebih banyak lebih banyak segalanya, tetapi terutama lebih banyak teks.

Saat Anda memindai halaman yang lebih panjang dan padat, Anda akan memindai dari kiri ke kanan dan dari atas ke bawah. Informasi harus diatur secara simetris, sepanjang garis horizontal.

Rasio emas

Prinsip desain situs web yang baik juga dapat membantu Anda menentukan proporsi untuk setiap bagian halaman web. The rasio emas - kadang-kadang disebut proporsi ilahi atau disebut dengan phi huruf Yunani - mengacu pada rasio bahwa orang-orang secara alami menemukan visual menarik atau bahkan indah.

Itu terjadi ketika Anda memiliki segmen garis yang dibagi menjadi dua fragmen dengan ukuran berbeda. Rasio fragmen yang lebih besar dengan keseluruhan sama dengan rasio fragmen yang lebih kecil dengan yang lebih besar.

Tapi tidak perlu mencoba mencari-cari apa yang Anda ingat tentang persamaan kuadrat dari kelas tujuh. Yang perlu Anda ingat adalah angka 1.618 (dan sungguh, 1.6 sudah cukup).

Jika Anda memiliki luas total X, dan Anda ingin tahu seberapa besar bagian yang lebih besar, cukup bagi X dengan 1,618. Mudah.

Aturan sepertiga

Saatnya untuk melihat prinsip-prinsip desain situs web untuk gambar itu sendiri. Anda sudah belajar di mana harus meletakkannya dan berapa ukurannya. Aturan pertiga adalah aturan sederhana untuk komposisi foto.

Jika Anda membagi gambar menjadi tiga bagian yang sama secara vertikal dan tiga bagian yang sama secara horizontal, Anda membuat kisi. Menurut aturan pertiga, Anda ingin menempatkan rangsangan visual di sepanjang garis ini dan/atau pada titik perpotongannya.

Sama seperti Anda diprogram untuk menemukan rasio emas yang indah, Anda diprogram untuk menemukan gambar yang menggunakan aturan pertiga dinamis dan menarik.

Teori warna

Teori warna bisa menjadi luar biasa karena ada banyak cara untuk melakukannya dengan benar untuk memiliki skema warna yang kohesif yang menyampaikan kesan yang tepat. Ini adalah salah satu topik yang dapat Anda jelajahi secara lebih mendalam.

Untuk ikhtisar pemula ini, Anda mungkin ingin memiliki roda warna yang berguna.

Berikut adalah empat cara berbeda untuk memilih warna merek dan situs web yang selaras:

1. Pergi monokromatik. Tidak harus membosankan. Gunakan berbagai corak dan warna untuk menciptakan kontras.
2. Pergi saling melengkapi. Cocokkan warna utama Anda dengan aksen yang diambil dari kutub yang berlawanan pada roda warna ungu dan kuning, misalnya.
3. Pergi analog. Pilih tiga warna yang terletak bersebelahan pada roda warna.
4. Pergi triadik. Gambarlah segitiga sama sisi satu dengan tiga sisi yang sama di roda warna Anda, dan gunakan warna yang Anda temukan di tiga titik.

Saat Anda memilih warna, Anda juga harus memikirkan kehangatannya. Warna-warna sejuk memiliki lebih banyak warna biru di dalamnya mereka dapat terlihat mencolok atau sedih, tetapi juga menenangkan. Warna-warna hangat memiliki lebih banyak merah dan kuning mereka bisa terasa bersemangat dan menggairahkan tetapi juga bisa tampil agresif dalam penggunaan tertentu.

Teori Gestalt

Teori Gestalt sebenarnya dikembangkan oleh para psikolog sebagai kerangka untuk memahami proses kognitif.

Pada intinya, teori gestalt mengatakan bahwa ketika Anda melihat satu set kompleks visual, Anda melakukan salah satu dari dua hal:

• Lihat keseluruhan yang koheren terlebih dahulu dan kemudian lihat bagian-bagiannya
• Lihat keseluruhan yang membingungkan terlebih dahulu dan kemudian coba uraikan menjadi bagian atau kelompok yang lebih sederhana

Ada tujuh prinsip desain situs web yang diambil dari teori dasar itu:

1. Hukum kesamaan. Mengelompokkan benda berdasarkan kemiripan. Hal serupa berjalan bersama.
2. Hukum kedekatan. Kelompokkan hal-hal menurut wilayah umum atau jarak relatif di antara mereka. Hal-hal yang berdekatan menjadi milik bersama.
3. Hukum kesederhanaan. Orang-orang melihat objek yang ambigu dalam istilah yang paling sederhana. Misalnya, Anda akan melihat lingkaran yang tumpang tindih hanya sebagai itu bukan sebagai kumpulan busur.
4. Hukum kontinuitas. Orang lebih cenderung melihat hal-hal sebagai sesuatu yang berkelanjutan daripada terpisah. Anda akan mengikuti objek di sepanjang jalur atau kurva.
5. Hukum persepsi. Orang melihat sosok atau titik fokus dan latar belakang. Hal-hal berdiri dalam kaitannya dengan hal-hal lain.
6. Hukum penutupan. Orang-orang mengisi informasi yang hilang untuk memahami berbagai hal. Garis putus-putus tetaplah garis.
7. Hukum simetri. Orang-orang melihat hal-hal yang simetris sebagai sesuatu yang berhubungan.

Gunakan prinsip-prinsip ini untuk membantu pemirsa Anda menafsirkan informasi yang Anda berikan kepada mereka.

Ruang negatif dan minimalis

Keduanya termasuk bersama karena keduanya merupakan prinsip desain situs web anti-kekacauan.

Ruang negatif adalah ruang putih atau kosong yang membuat situs web Anda terlihat bersih dan elegan. Jangan membanjiri pemirsa dengan rangsangan visual. Pastikan Anda memiliki banyak warna putih untuk memberi ruang.

Anda juga tidak ingin membanjiri pemirsa dengan terlalu banyak informasi atau terlalu banyak pilihan. Lebih sedikit pasti lebih merangkul minimalis.

Ketika Anda memberikan terlalu banyak informasi, barang-barang penting akan hilang. Saat Anda memberikan terlalu banyak perintah atau opsi, pengunjung cenderung tidak memilih apa pun, malah terpental menjauh dari situs Anda.

Desain yang dioptimalkan untuk seluler

Salah satu prinsip desain situs web yang paling penting adalah memastikan situs Anda menarik dan ramah pengguna di semua perangkat.

Jangan paksa pengunjung untuk mencoba dan menyeret mereka ke halaman statis yang sama dengan yang mereka dapatkan di desktop mereka. Gunakan alat yang siap mengadaptasi situs web untuk pengguna seluler dengan antarmuka yang mudah digulir. 

Tidak hanya frustrasi pengunjung mencegah hal ini, tetapi juga yang penting optimasi mesin pencari ( SEO faktor). Algoritme Google pasti memperhitungkan pengoptimalan seluler.

Jika Anda mencari untuk meraih pelanggan baru secara organik, Anda memerlukan strategi SEO yang solid. Jadi perhatikan prinsip-prinsip desain situs web yang akan menempatkan Anda di jalur yang benar.

Prinsip desain situs web Anda bisa melakukannya!

Bahkan, begitu Anda pergi, itu sangat menyenangkan. Ini adalah perpaduan sempurna antara strategi bisnis yang cerdas dan waktu bermain seni dan kerajinan.

Anda memiliki banyak prinsip desain situs web yang berguna untuk membantu Anda membuat situs yang sempurna, tetapi yang paling penting adalah sebagai berikut:

1. Hirarki visual membantu Anda menarik perhatian pemirsa ke tempat yang Anda inginkan.
2. Kurang itu lebih.
3. Mobile-friendly tidak lagi cukup. Anda harus dioptimalkan untuk seluler.

Jadi lompat ke sana! Tidak ada lagi protes bahwa Anda bukan perancang situs web. Anda segera bisa dan akan. Mulai saja.

Jika Anda ingin menggunakan jasa pembuatan website sebaiknya Anda menghubungi Jasa pembuatan website profesional dengan harga terjangkau.