Saat Anda memutuskan untuk membuat situs web, apa saja hal pertama yang muncul di benak Anda? Bagi kebanyakan orang, hal-hal tersebut akan mencakup hosting web, pilihan website builder, dan alat-alat lain yang serupa. Namun, sebelum memikirkan tentang konten dan tautan media sosial, Anda juga harus mempertimbangkan layout web Anda - dengan kata lain, seperti apa tata letak situs web Anda nantinya.
Memang benar, meskipun layout web bukan prioritas utama ketika Anda baru merintis dan mencari cara untuk membuat situs web yang sebenarnya dengan website builder ataupun CMS, layout web tetap sesuatu yang harus Anda pikirkan. Pengunjung hanya membutuhkan waktu 0,05 detik untuk memutuskan apakah mereka menyukai situs Anda atau tidak[1] - ingat, hanya 0,05 detik!
Saya mungkin tidak perlu memberi tahu Anda mengenai hal ini, tetapi desain tata letak situs web Anda memainkan peran penting dalam proses pengambilan keputusan ini.
Di dalam artikel ini, kita akan membahas beberapa hal umum yang perlu diperhatikan saat mengatur tata letak situs web Anda, dan saya juga akan memberikan Anda beberapa contoh situs yang telah menerapkan layout situs webnya dengan benar.
Konten
- 1. Mengapa Layout Web Itu Penting?
- 2. Pedoman Umum untuk Layout Web
- 2.1. 1. Pola "F"
- 2.2. 2. Kesederhanaan adalah Kuncinya
- 2.3. 3. Penempatan Bagian itu Penting
- 3. Contoh Layout Web Terbaik
- 3.1. 1. Amazon
- 3.2. 2. Squarespace
- 3.3. 3. Bethesda
- 3.4. 4. Wikipedia
- 3.5. 5. Forbes
- 4. Website Builder Terbaik untuk Layout Web Tingkat Atas
- 5. Kesimpulan
Mengapa Layout Web Itu Penting?
Untuk mulai membahas tentang tata letak situs web dan ide tata letak web, kita sebaiknya mendahulukan jawaban untuk pertanyaan utama di dalam artikel ini - mengapa setiap orang ingin menggunakan tata letak situs web terbaik di platform mereka?
Dengan kata lain, mengapa layout web itu penting?
Sebagai permulaan, lihat data statistik yang disebutkan di bagian pengantar artikel ini - jika pengunjung situs web Anda mendapatkan kesan positif tentang situs Anda dalam kurun 5 milidetik, saya jamin situs Anda hanya akan memiliki sedikit celah untuk dikritik.
Manfaat layout website tidak hanya akan "menambah" pengalaman pengunjung - terus terang saja, aspek tersebut bahkan akan menjadi bagian penentu yang jauh lebih berpengaruh.
Saat ini, Anda mungkin cenderung berpikir bahwa hal-hal seperti gambar, ukuran kotak teks, dan lokasi situs adalah penyebab utama yang menentukan kesan pengunjung terhadap situs web Anda - untuk beberapa kasus, rumusan itu memang benar. Kendati demikian, jika semua komponen tersebut ditempatkan secara acak-acakan di halaman situs web, yah… Tentu saja semuanya hanya akan menjadi omong kosong, kan?
Selain untuk mendapatkan kesan pertama yang baik, manfaat layout web lainnya yang dirasa penting adalah bahwa aspek ini dapat mempengaruhi pengalaman pengguna secara keseluruhan. Pengalaman ini mencakup segala sesuatu mulai dari hal-hal yang lebih sepele seperti menyematkan gambar yang membuat "candu", hingga kemudahan pengguna dalam menemukan informasi di situs web Anda.
Terakhir, terlepas dari apakah Anda berkenan atau tidak, layout web merepresentasikan pesan tertentu mengenai merek Anda. Untuk lebih memahami apa yang saya maksud, Anda dapat mengunjungi salah satu situs web yang sangat populer di internet, seperti Facebook atau Amazon - kedua situs tersebut memiliki tata letak yang sangat berbeda, dan langsung dapat dikenali.
Temuan Paling Disukai
Mencari informasi yang lebih mendalam tentang topik terkait? Kami telah mengumpulkan artikel serupa untuk meluangkan waktu Anda. Lihatlah!
Pedoman Umum untuk Layout Web
Seperti elemen lain yang ada di dalam proses pembuatan situs web Anda, menyusun tata letak situs web kelas atas bisa menjadi tugas yang cukup merepotkan. Oleh karena itu, artikel ini menyiapkan beberapa pedoman umum yang dapat Anda ikuti, dan saya harap pedoman tersebut dapat membantu Anda menghasilkan beberapa ide tata letak web yang unik.
1. Pola "F"
Saat menyelidiki tentang tata letak situs web dan cara terbaik untuk menerapkannya, Anda mungkin akan menemukan istilah "pola 'F'".
Terus terang saja, pola F adalah pedoman yang bagus untuk diikuti ketika memikirkan tentang ide tata letak situs web, dan juga saat mempertimbangkan lokasi (serta - pemformatan) konten Anda di dalam tata letak yang Anda pilih.
Pola "F" mengacu pada pola pergerakan (perhatian) mata alami kita saat kita mengunjungi situs web dan membaca beberapa informasi yang disuguhkan. Dengan mengikuti pola khusus ini, Anda dapat mengoptimalkan konten pada halaman Anda sehingga "titik perhatian" hanya menampilkan informasi yang paling relevan, dan juga beberapa pernyataan ajakan bertindak.
Biasanya, pola "F" juga akan memengaruhi tata letak situs web yang mungkin Anda pilih untuk diterapkan di situs Anda. Nah, sebenarnya sudah banyak sekali tata letak situs web terbaik yang menggunakan pola ini!
2. Kesederhanaan adalah Kuncinya
Di zama sekarang, sudah cukup umum untuk menemukan situs yang memiliki tata letak yang sangat rumit. Kerumitannya ini dapat berkisar dari apa saja mulai dari intro berbasis video dan interaktif, opsi menu yang mencolok, hingga beberapa menu tarik-turun canggih dan jendela alternatif yang dapat digulir.
Semua itu sudah bagus dan keren - sungguh, semakin unik situs Anda, semakin berkesan pengalaman yang pengguna Anda dapatkan. Hanya ada satu aturan penting yang harus selalu Anda ingat - kesederhanaan selalu merupakan sesuatu yang sebaiknya Anda terapkan di situs Anda.
Anda mungkin akan bertanya, kok bisa sebuah kesederhanaan akan cocok dengan tata letak situs web modern yang rumit? Sebenarnya cukup sederhana (ya, saya memang sengaja melakukannya), sungguh - kebanyakan orang terbiasa dengan pola situs tertentu. Maksudnya, Anda akan sering mendaati menu utama situs web berada di bagian atas halaman, bilah pencariannya berada di kanan atas atau di tengah, dan seterusnya.
Jika Anda merujuk ke praktik terbaik desain layout website yang ada, Anda juga akan melakukan hal serupa.
Bayangkan jika Anda mengunjungi situs yang memiliki menu utamanya di bagian bawah halaman, atau menu yang dibuat sedemikian rupa sehingga hanya akan muncul jika beberapa kondisi tertentu terpenuhi. Tak perlu disangsikan lagi, singkatnya, hal tersebut pastinya sangat merepotkan.
3. Penempatan Bagian itu Penting
Sekarang, Anda mungkin akan berpikir bahwa penempatan adalah sesuatu yang cukup jelas untuk dipahami, tetapi sayangnya - seringkali tidak demikian kenyataannya.
Apa pun jenis situs yang Anda coba buat, dan terlepas apakah itu platform berbasis eCommerce atau bukan, lokasi untuk menempatkan bagian-bagian spesifiknya haruslah dipilih dengan cermat.
Namun, perlu diingat bahwa saya tidak sedang berbicara tentang aspek visual sebuah situs - bagian-bagian situs web sudah pasti akan rumit dan interaktif! Lain daripada itu, saat memikirkan tentang penempatan bagian-bagian di tata letak situs web, Anda seharusnya fokus untuk memberikan informasi yang bermanfaat serta tautan dalam sebanyak mungkin untuk diakses pengunjung situs Anda dengan cara yang sederhana.
Apa maksudnya semua ini? Pada dasarnya, jika Anda saat ini mengadakan obral dan membuat spanduk yang mempromosikan obral tersebut, spanduk tersebut sebaiknya ditempatkan di bagian atas beranda, dan ditampilkan sebagai tautan yang dapat diklik, sehingga Anda nantinya dapat mengarahkan pengguna ke laman obral yang sebenarnya di situs Anda.
Bisakah Anda menangkap maksud saya?
Desain layout website berkualitas tinggi akan memiliki bagian yang diintegrasikan dengan sangat mulus. Memang, tugas ini bisa dibilang agak rumit - itulah mengapa desainer web profesional sangat dicari!
Contoh Layout Web Terbaik
Karena kita telah membahas beberapa "pedoman praktis" utama yang harus diterapkan ketika akan memikirkan tentang ide tata letak web, mari kita lanjutkan penjelasan artikel ini dan lihat beberapa contoh asli yang ada di kehidupan kita dari apa yang telah kita bicarakan di atas.
1. Amazon
Seperti yang sudah disebutkan sebelumnya di dalam tutorial ini, Amazon memiliki tata letak situs web yang sangat mengesankan. Hal ini dikarenakan dua alasan utama - situs web Amazon sangat mudah dikenali, dan juga ramah pengguna.
Aspek yang membuat situs Amazon dapat dikenali dengan mudah disebabkan oleh kombinasi skema warna dan tata letak situsnya yang hebat. Menu biru hitam yang representatif di bagian atas halaman Amazon, ketika dikombinasikan dengan font item menu memunculkan respons yang tak terbantahkan, misalnya pernyataan seperti "ya, saya pasti sedang berada di situs Amazon!".
Tata letaknya pun sederhana, tetapi berfungsi sangat baik dengan model bisnis Amazon. Meskipun Amazon memiliki daftar item menu yang sangat lengkap yang dapat dijelajahi pelanggan, semuanya tersimpan rapi di bilah sisi kiri situsnya, sehingga Amazon tidak terkesan menakut-nakuti pelanggan saat pertama kali mengunjungi situs tersebut.
Ketika memperbincangkan tentang ide tata letak situs web, Amazon telah melakukan pekerjaan yang hebat dengan mengintegrasikan beberapa berita dan iklan lainnya ke bagian horizontal yang dapat digulir otomatis di tengah beranda. Desain yang demikian cukup populer, dan dapat bekerja dengan sangat baik.
Apakah Anda tahu?
Pernahkah Anda berpikir pembuat situs website mana yang terbaik untuk bisnis Anda?
Lihat & bandingan secara bersandingan TOP pembuat situs web2. Squarespace
Meskipun mungkin rasanya agak ironis untuk menampilkan tata letak beranda perusahaan website builder sebagai contoh untuk artikel ini, Squarespace merupakan contoh sempurna dari salah satu layout web yang sedang naik daun - yakni situs yang menggunakan foto berukuran penuh sebagai latar belakang laman depan situsnya.
Meskipun desain semacam ini mungkin tidak akan memberi Anda ide tata letak situs web yang paling mutakhir pada pandangan pertama, Squarespace sudah melakukan pekerjaan yang luar biasa, yaitu menentukan gambar yang dapat menyatu dengan tata letak situs secara keseluruhan. Selain itu, gambar yang sama juga berfungsi untuk memasarkan produk perusahaan ini - yakni website builder. Sangat jenius sekali!
Squarespace menggunakan pendekatan minimalis dalam urusan tata letak umum untuk halamannya - tidak banyak opsi untuk dijelajahi. Maksudnya, semua opsi yang ADA telah diintegrasikan dengan cara yang kreatif dan cerdas - contoh yang bagus!
3. Bethesda
Bethesda adalah salah satu perusahaan pengembang game paling terkenal di seluruh dunia.
Ketika mengunjungi beranda Bethesda, Anda akan langsung disambut oleh konten mereka yang saat relevan. Di saat artikel ini ditulis, konten yang ditampilkan adalah seri Fallout.
Hal yang menarik tentang tata letak Bethesda adalah pada dasarnya layout web situs ini dirancang dengan cara yang dapat mempromosikan produk terbaru perusahaan ini, dan juga memberikan informasi berguna seputar berita lain kepada pengunjungnya.
Saat menelusuri halamannya, terlihat jelas bahwa situs web Bethesda menggunakan bagian yang berbeda-beda untuk berbagai jenis konten yang tersedia di situsnya. Bethesda menghindari fitur mencolok, dan sebaliknya malah berfokus memusatkan sebanyak mungkin informasi yang relevan di halaman depannya.
4. Wikipedia
Kendati Wikipedia adalah situs yang cukup sering kita kunjungi, orang-orang jarang sekali memperhatikan layout web yang digunakan di situs ini.
Dengen berkonsentrasi di halaman depannya, Wikipedia menawarkan desain menu radial yang tidak biasa. Tidak hanya unik, tetapi juga menarik perhatian pengguna!
Karena Wikipedia paling sering digunakan untuk mencari beberapa informasi, bilah pencarian ditempatkan tepat di tengah halaman. Situs web ini juga menampilkan desain yang rapi, sederhana, dan enak dipandang mata.
5. Forbes
Forbes adalah contoh sempurna dari ide layout web yang ditujukan untuk situs web yang berhubungan dengan berita. Kendati demikian, situs ini mampu mempromosikan desain situs yang jelas dan teratur.
Saat mengunjungi Forbes, Anda akan mengetahui bahwa - secara sekilas - situs web tersebut menggunakan pola "F". Hal ini terbukti saat Anda menggulirny ke bagian bawah halaman depan situsnya - meskipun didominasi oleh gambar, data tekstualnya pendek, ringkas dan langsung ke intinya, selain itu data tekstualnya juga terkonsentrasi di bagian tertentu dari situs web.
Di bagian atas halaman situsnya, Forbes memiliki daftar topik yang sederhana namun menjanjikan, yang mana dapat Anda telusuri menggunakan menu tarik-turun. Ini merupakan cara yang rapi untuk menyimpan banyak artikel berbeda di satu situs!
Website Builder Terbaik untuk Layout Web Tingkat Atas
Dengan mengetahui beberapa contoh tata layout web bagus yang sudah dipaparkan, untuk catatan terakhir, ada baiknya saya menyebutkan beberapa website builder yang akan memberikan Anda sarana untuk membuat dan memanfaatkan tata letak modern dan unik di situs Anda.
Meskipun website builder yang disebutkan di bawah ini merupakan pilihan utama, ada daftar website builder lain yang layak dicoba - perlu diingat bahwa penentuannya akan tergantung pada jenis situs web yang ingin Anda buat, dan jenis tata letak yang ingin ada terapkan.
- Squarespace. Squarespace menawarkan template modern dan menawan. Semua templat Squarespace dioptimalkan untuk penggunaan seluler dan desktop. Setiap templat dihadirkan dengan tata letak situs web yang berbeda, dan semuanya dapat disesuaikan sampai batas tertentu. Harga paket Squarespace dibanderol mulai dari US$12 per bulan.
- Zyro. Jika Anda menginginkan fungsionalitas eCommerce yang hebat serta tata letak dan templat situs web modern, Zyro pastinya tidak akan membuat Anda kecewa. Memang website builder yang serba bisa. Penetapan harga Zyro mulai dari US$1,30 per bulan - murah sekali!
- Shopify. Jika Anda ingin membuat platform eCommerce, sejujurnya tidak ada website builder yang lebih baik dari Shopify untuk membantu Anda membuat sebuah toko online. Tidak hanya sangat mudah digunakan, Shopify juga memiliki beberapa pilihan templat dan layout web yang luar biasa untuk Anda pilih - yang semuanya dioptimalkan untuk kebutuhan eCommerce Anda. Harga paket Shopify dibanderol mulai dari US$29 per bulan.
- WordPress. Meskipun WordPress sangat direkomendasikan, jika Anda menginginkan kebebasan penuh untuk mengelola layout web, Anda dapat mempertimbangkan untuk menggunakan WordPress.org. Dengan sedikit pengetahuan dan beberapa plugin WP yang sangat layak pakai, Anda akan dapat membuat tata letak situs apa pun yang dapat Anda bayangkan. Selain itu, WordPress sepenuhnya gratis untuk digunakan - yang perlu Anda lakukan hanyalah menemukan penyedia hosting situs web.
Temuan Paling Dicari
Jelajahi koleksi artikel, panduan & tutorial terkait Pembuat Situs Web paling menyeluruh. Selalu mengetahui & membuat keputusan yang tepat!
Kesimpulan
Setelah membaca semua informasi di atas, saya kira Anda sekarang sudah lebih berpengetahuan tentang berbagai jenis layout web yang populer, serta proses yang digunakan untuk membuat layout web terbaik untuk kebutuhan spesifik situs web Anda.
Periksa daftar website builder terkemuka di industri pilihan kami, dan - terlepas apakah Anda akan memilih Zyro, Squarespace, atau WordPress.org - Saya berharap Anda dapat membuat layout web terbaik tanpa suatu kendala berarti!
Kontribusi oleh: Andrew Mallonee , Founder of Mallonee Media
Andrew is a senior specialist application engineer and the founder of Mallonee Media - web development and creative agency taking a slightly different approach to helping clients. They cater to peo...
Baca lengkap bio...Referensi
✓ Cek Fakta
| kontribusi oleh: Andrew Mallonee
, Founder of Mallonee Media
1. Gitte Lindgaard Gary Fernandes Cathy Dudek & J. Brown: 'Attention web designers: You have 50 milliseconds to make a good first impression!'
Tinggalkan tanggapan jujur Anda
Tinggalkan pendapat asli Anda & bantu ribuan orang untuk memilih pembuat situs web terbaik. Semua umpan balik, baik positif atau negatif, diterima selama mereka jujur. Kami tidak mempublikasikan umpan balik yang bias atau spam. Jadi, jika Anda ingin berbagi pengalaman, pendapat, atau memberi saran - adegan itu milik Anda!
