Tata letak situs web sama pentingnya dengan informasi yang ada di situs web .. Jika Anda menginginkan situs web yang ramah pengguna, pilih tata letak yang memudahkan navigasi. Anda mungkin telah menemukan ada beberapa tata letak yang mudah dimengerti dan cepat digunakan, sementara yang lain memakan waktu dan tidak sebanding dengan upaya yang diperlukan untuk menggunakannya.
Situs web yang mudah digunakan secara keseluruhan lebih mungkin dikunjungi dan dikembalikan ke. Dan tata letak yang lebih mudah digunakan umumnya lebih mudah dibuat.
Situs web ini memiliki berbagai aspek untuk tata letaknya ... Awalnya, kami peduli dengan desain. Apakah halaman web Anda memiliki semua hal yang Anda inginkan di dalamnya? Apakah Anda tahu cara mengaturnya dan di mana semua yang Anda butuhkan berada? Ingat, Anda dapat menggunakan tata letak yang berbeda untuk setiap halaman individual. Menjadi bagian dari situs web yang sama tidak berarti mereka memiliki tampilan dan nuansa yang sama. Keseragaman membantu, tetapi tidak perlu, dan orang-orang menggunakan berbagai macam tata letak dan template di situs web mereka.
Cara Membuat Tata Letak Situs Web Dengan Photoshop Dari Wireframe [Bagian 2]
Situs web mirip dengan buku teks, dengan setiap halaman terkait dengan bab unik seperti tema atau acara. Pilihan keseragaman atau memilih berbagai templat dan tata letak sangat tergantung pada apa yang Anda cari dan seberapa banyak pekerjaan yang ingin Anda masukkan ke dalam situs web itu sendiri. Sebaiknya Anda memeriksa dan menilai apakah pembuat situs web yang Anda gunakan akan mendukung beberapa tata letak. Ada beberapa yang didasarkan pada tata letak tunggal.
Anda akan menginginkan tata letak yang tidak terlalu sibuk sehingga mengurangi tujuan situs web Anda yang merupakan konten di dalamnya. Konten jelas merupakan item yang paling penting di situs web Anda. Pengunjung Anda datang untuk melihat konten, jadi pastikan Anda tetap fokus.
Tata letak juga didasarkan pada apa yang Anda sajikan. Pilih tata letak berdasarkan jumlah teks yang membutuhkan ruang dibandingkan dengan jumlah gambar yang membutuhkan ruang. Anda juga perlu memiliki tata letak yang akan memberi Anda tautan dan pilihan halaman yang Anda butuhkan. Jika Anda menggunakan templat yang tepat untuk menambahkan halaman tambahan, Anda dapat mengurangi pekerjaan secara signifikan.
Latar belakang situs web akan lebih menarik dan menarik jika warnanya cerah, tetapi tidak mencolok. Namun, jika Anda tidak dapat membaca teks karena warna atau sulit di mata kemungkinan Anda akhirnya akan kehilangan pengunjung.
Setelah Anda memilih jenis templat, warna dan pola jika perlu, penting untuk memastikan bahwa semua yang Anda butuhkan, tautan dan tombol halaman, spanduk, dan menu ditempatkan di tempat yang tepat. Ada banyak pilihan templat yang memungkinkan Anda memilih lokasi untuk berbagai bagian. Pilih opsi ini selanjutnya untuk menyelesaikan tata letak untuk situs web Anda. Cara Membuat Tata Letak Situs Web Selama 10 tahun terakhir, pertanyaan apakah akan menggunakan tata letak tetap atau cair saat mendesain situs web telah berkecamuk di dunia desain web, dengan pemain desain utama di kedua sisi pagar pepatah. Namun baru-baru ini, karena resolusi layar telah meningkat secara dramatis, tata letak tetap memiliki semua kecuali menggantikan cairan, tetapi masih ada keuntungan besar pada tata letak cair jika dirancang dengan benar.
Persiapan
Kapan saya menggunakan istilah? Mengandung? elemen, saya merujuk pada kolom atau kotak yang menampung teks, gambar, dan konten lainnya. Elemen yang mengandung mungkin memiliki batas dan gambar latar belakang, tetapi biasanya hanya wadah visual untuk konten penting di layar.
Memperbaiki tata letak lebar
Dalam tata letak yang tetap, ukuran masing-masing? Mengandung? elemen pada halaman web ditentukan dengan tepat. Halaman tidak akan berubah ketika Anda mengubah ukuran jendela browser Anda. Ini pada dasarnya akan terlihat sama di browser atau komputer apa pun.
Tata letak cair
Dalam tata letak cair, ukuran elemen yang mengandung berubah tergantung pada ukuran browser dan preferensi pengguna. Ukuran kontainer meningkat ketika dilihat pada resolusi layar yang lebih besar dan berkurang ketika browser diubah ukurannya.
Keuntungan dan Kerugian (pro dan kontra):
Memperbaiki tata letak lebar
Pro
* Menjamin panjang baris yang mudah dibaca
* Memungkinkan gambar ditempatkan persis sehubungan dengan elemen dan ukuran tipe lainnya
* Memungkinkan desainer kontrol penuh atas bagaimana halaman ditampilkan (sebagai lawan dari pengguna)
* Memungkinkan perilaku pencetakan standar yang dapat diprediksi.
Cons
* Dapat membuat ukuran jenis yang tidak optimal
* Mengambil kendali atas ukuran halaman dan ukuran teks dari pengguna.
* Tidak memanfaatkan real estat layar dan dapat menghasilkan ruang jendela besar yang tidak terpakai yang berpotensi meningkatkan jumlah pengguna yang harus melakukan pengguliran (ini terutama berlaku pada resolusi yang lebih tinggi)
Tata letak cair:
Pro
* Memungkinkan penggunaan maksimum ruang atau layar real-estate. Juga memungkinkan sebagian besar kontrol atas ukuran oleh pengguna, karena pengguna dapat mengubah ukuran situs web sesuai keinginan mereka.
* Memungkinkan ukuran teks dapat diubah oleh preferensi pengguna, sehingga memudahkan orang dengan masalah penglihatan untuk menambah atau mengurangi ukuran teks pada halaman sementara tata letak menyesuaikan sekitar ukuran yang bertambah secara otomatis.
* Ketika dirancang dengan benar, itu membuat situs web Anda terlihat sedikit berbeda dari pesaing, mengingat sebagian besar situs web menggunakan tata letak yang tetap.
Cons
* Jika ukuran layar menjadi terlalu besar atau terlalu kecil dapat menghasilkan teks yang tidak dapat dibaca, atau sulit dibaca / dipindai panjang garis
* Dapat menyebabkan masalah dengan * pencetakan halaman default. (Lembar gaya cetak terpisah dapat digunakan untuk pencetakan sempurna dari halaman mana pun meskipun tata letak cair, tetapi jika lembar gaya terpisah untuk pencetakan tidak disediakan, ketentuan ini valid)
* Ketika ukuran situs web berubah, ukuran gambar ke proporsi teks dapat membuat tampilan yang kurang diinginkan.
Resolusi Layar Modern dan Prevalensi Tata Letak Lebar Tetap
Masalah yang dihadapi desain tata letak dalam desain web modern adalah variasi besar dari resolusi layar umum di antara pengunjung situs web potensial. Resolusi modern terkecil yang dapat diterima dan masih umum adalah lebar 800 piksel dengan tinggi 600 piksel. Dengan peningkatan resolusi layar lebar dan monitor besar baru-baru ini, lebar layar 1280 piksel plus juga sangat umum.
Q. Jadi, bagaimana Anda mendesain situs yang terlihat bagus dengan lebar 800 piksel dan lebar 1280 piksel?
A. Sebagian besar web designer tidak, mereka menggunakan tata letak tetap yang lebar 800 piksel dan menyebutnya baik. Dengan itu, saya secara pribadi merancang dan telah melihat beberapa tata letak yang indah yang terlihat bagus dan dapat dibaca pada kedua resolusi ekstrem tersebut. Detail spesifik tata letak ini berada di luar cakupan artikel ini, tetapi sebagian besar desain yang saya lihat atau buat yang berhasil menyelesaikan tugas ini menggunakan beberapa kolom konten dalam kombinasi dengan :padding: yang didefinisikan sebagai persentase layar. Jadi ketika layarnya kecil, banyak kolom sangat berdekatan, tetapi ketika layarnya besar, bantalannya akan bertambah secara proporsional dan kolom-kolomnya berjarak lebih jauh terpisah..
Rekomendasi dan Analisis
Sebagian besar situs web mungkin harus dirancang dengan tata letak tetap atau :semi:. Ini menjamin keterbacaan dan penyajian konten yang sempurna. Dengan itu, jika situs web Anda mengandung sejumlah besar konten berbasis teks (lebih dari 3-5 paragraf per halaman) atau jika situs web akan mendapat manfaat besar dari skema desain non-standar, gunakan cairan.
Jika Anda masih tidak yakin, pilih yang diperbaiki. Tata letak tetap mudah dipertahankan, dan memastikan keterbacaan oleh semua pengguna dan lebih mudah bagi perancang web untuk membuat kode dengan sempurna. Tata letak cairan yang dilakukan dengan buruk akan menyebabkan lebih banyak masalah maka itu akan memperbaiki dan mengganggu pengguna potensial. Sebagai contoh, salah satu kencing hewan peliharaan pribadi saya adalah ketika seorang desainer menggunakan tata letak cairan satu kolom. Workstation komputer pribadi saya terdiri dari dua monitor, 19 inci, dan layar lebar 17 inci. Ketika sebuah situs web dirancang dengan satu kolom cair, lebar halaman biasanya terlalu lebar untuk dibaca dengan mudah, jadi saya harus menyesuaikan ukuran jendela secara manual..