Isi

• Melangkah
• Metode 1 dari 2: 3 aturan dasar
• Metode 2 dari 2: Pedoman
• Tips
• Peringatan

Merancang situs web yang bagus bisa tampak seperti tugas yang menakutkan, tetapi selama Anda mengingat dasar-dasarnya, Anda akan menemukan prosesnya menarik dan menyenangkan. Ini lebih dari sekedar ketampanan! Kami akan menunjukkan kepada Anda dasar-dasar dan beberapa pedoman umum untuk membantu Anda merancang situs web yang akan dikunjungi orang lagi dan lagi.

Melangkah

Metode 1 dari 2: 3 aturan dasar

1. Aturan 1:Dengarkan klien Anda. Anda mungkin mendesain "situs web terbesar di dunia yang pernah ada dalam sejarah alam semesta dan seterusnya," dengan warna hitam yang kaya, font yang halus, dan warna artistik yang cerah untuk situs yang meneriakkan "jelajahi saya sekarang!" Sayangnya, klien Anda menginginkan bilah menu oranye dengan huruf merah jambu dan oranye cerah. Anda telah dipecat, dan situs web terbaik Anda - yang haknya dimiliki klien - ada di suatu tempat di disk cadangan mereka, tanpa ada yang melihatnya lagi.
   • Pelajari identitas perusahaan klien Anda. Minta klien untuk menunjukkan beberapa situs web yang mereka sukai. Ini tidak hanya akan memberi Anda gambaran tentang apa yang mereka sukai, ini juga akan memberi Anda beberapa ide desain yang mungkin tidak Anda pikirkan.
   • Jika Anda mengira kami bercanda tentang situs web oranye dan merah muda, pertimbangkan situs keren dan canggih ini:
2. Aturan # 2:Kenali audiens Anda dan apa yang mereka cari dan sesuaikan dengan desain Anda. Alasan orang memiliki situs web adalah karena mereka ingin orang lain melihatnya. Ini bisa informatif, atau komersial, atau untuk menghibur audiens target tertentu. Tugas Anda sebagai desainer adalah mengetahui untuk siapa Anda mendesain, dan menyimpannya di halaman saat mereka tiba di sana.
   • Anda mungkin berpikir, "Jika terlihat bagus, mereka akan tetap tinggal." Tetapi tidak harus demikian. Ambil contoh real estat. Inilah situs dengan desain yang bersih dan menyenangkan. Ini memiliki banyak ruang putih yang memberikan tampilan terbuka, warna-warna cerah dan format layar lebar modern dengan tautan di tempat yang menonjol:
   • Sekarang perhatikan pendekatan untuk menjual real estat di area yang sama: berantakan dan sangat sibuk, warna-warna kusam, dan tercakup dalam iklan.
   • Tebak mana yang lebih cocok untuk mereka yang mencari rumah? Benar, di mana rumah! Saat orang menelusuri "rumah dijual di Santa Monica", mereka tidak peduli seperti apa situs itu. Mereka tidak ingin membaca tentang agen perumahan atau melihat foto-foto kota yang indah. Mereka ingin melihat rumah.
3. Aturan # 3:Dengarkan dirimu sendiri. Anda memahami apa yang diinginkan klien dan Anda tahu apa yang dicari pasar Anda. Sekarang saatnya untuk memperhatikan Anda, sang desainer!
   • Buat template di perangkat lunak grafis pilihan Anda. Buat elemen halaman Anda pada lapisan yang berbeda (sehingga Anda dapat mengubah beberapa hal nanti tanpa merusak keseluruhan template). Elemen-elemen ini dapat berupa:
     • Header. Ini adalah elemen yang sama di setiap halaman situs Anda. Header terdiri dari judul dan logo situs, serta tautan ke bagian lain situs web (mis. Tentang, Kontak, dll.). Secara visual dan praktis ini akan mengikat semuanya. Praktik yang baik untuk menautkan tombol pertama pada bilah menu kembali ke beranda.
     • Misalnya, mari kita lihat Apple:
     • Seperti kebanyakan barang Apple, beranda mereka memiliki desain yang sangat bersih dan lugas. Perhatikan bilah menu di bagian atas, dengan topik logis untuk setiap tombol, ditambah bidang pencarian - selalu merupakan ide bagus jika situs Anda mendukungnya. Sekarang mari kita lihat halaman arahan untuk salah satu tombol, iPad, untuk melihat beberapa elemen:
     • Bilah menu berubah hanya dengan menggelapkan tombol iPad.
     • Subjek halaman arahan ditampilkan dalam huruf hitam besar.
     • Submenu baru akan muncul sehingga Anda dapat mempelajari lebih lanjut tentang produk. Jika Anda mengklik salah satu tombol ini, Anda akan melihat bahwa setiap halaman menawarkan konten baru bergantung pada topik, tetapi akan identik dalam tata letak dan desain.
     • Sering kali, setiap topik utama di bilah menu Anda memiliki subpos yang berbeda untuk Anda isi. Alih-alih membuat bilah menu kedua, Anda dapat menggunakan menu popup seperti contoh dari Musicians Friend:
     • Sidebar. Ini akan muncul di banyak halaman situs Anda, tetapi belum tentu semua - konteksnya menentukan. Namun, ini adalah elemen yang sangat penting dan harus dirancang dengan cermat agar intuitif dan tidak terlalu berantakan. Tidak seperti bilah menu, konten bilah sisi bisa sangat dinamis. Lihat Dua Sidebar Ini Dari Pemasar Real Estat Trulia Yang pertama adalah untuk pembeli:
       
       

Metode 2 dari 2: Pedoman

1. Rancang antarmuka pengguna yang baik. Posisikan berbagai elemen situs web seperti judul, bilah sisi, logo, gambar, dan teks di tempat yang sama di setiap laman agar situs Anda dapat dinavigasi dan intuitif.
   • Pertahankan tajuk yang sama di bagian atas setiap halaman. Terlepas dari apakah konten situs Anda memungkinkan banyak elemen berulang, pastikan bagian atas setiap halaman sama.
   • Gunakan logika dalam desain Anda. Elemen-elemen pada satu halaman harus diurutkan secara logis berdasarkan kepentingan atau topik; halaman yang berbeda di situs juga harus demikian.
2. Ciptakan gaya yang konsisten. Jika tata letak harus memberikan konsistensi struktural pada situs Anda, gayanya harus memberikan harmoni tematik.
   • Tetap gunakan dua atau tiga warna utama dan pastikan semuanya serasi.
   • Hindari menggunakan terlalu banyak gaya atau ukuran font; jika Anda ingin mengganti beberapa, gunakan dengan cara yang sama di setiap halaman.
   • Gunakan Cascading Style Sheets (CSS) untuk mempertahankan gaya yang seragam dan untuk mempermudah mengubah elemen di seluruh situs web tanpa harus membuka setiap halaman secara terpisah.
3. Maksimalkan keterbacaan. Untuk membuat teks Anda lebih mudah dibaca, Anda dapat membaginya menjadi beberapa bagian yang lebih kecil.
   • Gunakan subtitle dan spasi yang tepat untuk memisahkan setiap bagian.
   • Gunakan huruf tebal atau ukuran berbeda untuk memperlihatkan hierarki dan pentingnya topik.
   • Perhatikan bagaimana Anda memperlakukan teks. Jangan membuat font terlalu kecil, dan tingkatkan spasi baris untuk membuat potongan teks yang besar lebih mudah dibaca. Sebagian besar teks lebih sulit dibaca; memecahnya menjadi paragraf yang lebih kecil.
4. Jadikan situs web Anda dapat dibaca secara universal. Gunakan HTML standar dan hindari tag, fitur, dan plugin yang hanya tersedia untuk satu merek atau versi browser.
   • Meskipun sebagian besar browser dan komputer modern dapat menangani gambar yang kompleks, semuanya akan terlihat lebih apik jika Anda mengecilkan dan mengoptimalkan gambar untuk web. Timbang pentingnya kualitas dengan pentingnya kecepatan.
5. Uji situs web Anda. Pastikan bahwa setiap tautan berfungsi seperti yang Anda harapkan, dan gambar muncul dengan benar.
   • Anda mungkin ingin mengatur beberapa pengujian pengguna dengan meminta anggota audiens target Anda menguji kejelasan dan kemudahan penggunaan desain Anda dan memberikan umpan balik tentang situs web Anda.
6. Publikasikan situs web Anda. Beli nama domain jika Anda belum melakukannya. Periksa secara berkala apakah tautan masih berfungsi dan dengarkan saran yang dikirim pengunjung melalui email kepada Anda.

Tips

• Meskipun Anda bebas mendesain tata letak berdasarkan visi pribadi Anda atau hal-hal yang pernah Anda lihat di situs lain, akan lebih mudah untuk membeli desain yang sudah jadi.
• Jangan membombardir pengunjung dengan gambar yang lucu dan spesial. Animasi flash, warna-warna cerah, latar belakang berpola, dan musik yang diputar secara otomatis saat pemuatan halaman adalah eksperimen yang menyenangkan di tahun 90-an, tetapi sekarang mereka akan membuat pengguna takut. Tetap gunakan latar belakang sederhana yang kontras dengan warna teks untuk keterbacaan maksimum.
• Anda selalu dapat menggunakan CSS untuk mengoptimalkan penspasian paragraf.
• Untuk pengunjung dengan gangguan pendengaran atau penglihatan, Anda dapat membuat subtitle video, mentranskripsikan audio, dan menambahkan pesan aksesibilitas. Meskipun tabel dapat menjadi cara yang efisien untuk mengatur informasi, pengunjung tunanetra yang menggunakan perangkat lunak pembaca layar mungkin tidak mendengar materi dalam urutan yang benar.
• Biarkan pengunjung Anda menghemat tinta: gunakan lembar gaya terpisah untuk halaman cetak.
  • Matikan gambar latar belakang saat mengatur parameter cetak.
  • Gunakan teks hitam dengan latar belakang putih.
  • Hapus bilah menu dan gambar yang tidak perlu.

Peringatan

• Hindari plagiarisme dan patuhi semua undang-undang hak cipta. Jangan menyertakan gambar acak yang Anda temukan online atau bahkan elemen struktural tanpa persetujuan. Semua yang Anda gunakan di situs Anda harus legal dan etis.