Aturan Sepertiga - The Principles of Beautiful Web Design

Sebuah Versi Sederhana dari rasio emas adalah aturan sepertiga (the rule of third). Sebuah garis dibelah menggunakan rasio emas menjadi dua bagian, dengan ukuran salah satu bagian lebih besar dua kali lipat dari bagian yang lainnya. Membagi komposisi menjadi tiga adalah cara termudah untuk menerapkan rasio ini tanpa kalkulator.

Untuk eksperimen singkat, saya akan memulainya dengan menggambar sekelompok grid aturan sepertiga sederhana dengan pensil dan kertas. Gambarlah sebuah persegi, bagi menjadi tiga secara horizontal dan vertikal, kemudian buat sebuah garis di antara setiap garis vertikal untuk menjadikannya enam kolom.

Dengan adanya grid sederhana ini, kita dapat memulai proses layout. Ini sering disebut sebagai wireframe. Wireframe merupakan sketsa atau layout sederhana, di mana Anda mendesain blok-blok konten beserta posisinya pada halaman web. Wireframe sangat berguna karena memungkinkan anda untuk dapat dengan cepat dan mudah memindahkan posisi elemen-elemen yang ada. Kotak terbesar yang berada pada posisi paling luar merupakan kontainer yang telah kita bicarakan di bagian "Anatomi Halaman Web". Saat menggunakan metode desain layout ini, saya akan menempatkan blok yang terbesar terlebih dahulu. Biasanya, blok ini mewakili konten/isi dari web. Dalam aturan pertama grid sepertiga saya, saya menempatkan blok konten dalam dua per tiga dari layout di posisi kanan bawah.

Selanjutnya, saya menempatkan blok navigasi saya di sepertiga tengah kolom kiri. Saya menempatkan bagian teks dari blok navigasi saya di sisi kiri dari konten, dan gambar identitas pada posisi di atas menu. Terakhir, saya menempatkan blok copyright di bawah konten, pada kolom sebelah kanan dari grid.

Sketsa Awal ini (seperti gambar di atas) memberikan sekilas tinjauan terhadap pendekatan layout umum apa saja yang memungkinkan untuk diterapkan pada situs web Anda. Pertumbuhan popularitas desain web berbasis grid telah menginspirasi banyak artikel dan tool yang dapat digunakan untuk memudahkan kita mendesain website dalam grid.