TOPOGRAFI DESAIN

Tipografi dalam desain web bisa menjadi jauh lebih kompleks daripada tampaknya. Mampu membaca konten dengan mudah merupakan keprihatinan kegunaan terkemuka, tapi tipografi juga sangat banyak keprihatinan estetika. Bagi banyak desainer, menciptakan tipografi yang sempurna dapat menjadi misteri. Switching bolak-balik antara jenis ukuran, proporsi pos, gaya font, dan jarak dapat memberikan desainer apapun sakit kepala. Setelah berjam-jam mengutak-atik, hal ini masih saja "tidak merasa benar.

Dalam artikel ini kita akan membahas bagaimana menyesuaikan tipografi dari sudut pandang yang lebih resmi dan matematika - dan kita bisa mendapatkan tipografi dari setiap situs web sempurna dalam 10 menit atau kurang.

Mengatur Dasar / Vertikal Rhythm

Bayangkan kembali di sekolah dasar ketika Anda menggunakan kertas bergaris notebook untuk semuanya. Anda menulis judul, paragraf, dan daftar untuk catatan, dan mereka semua berpegang pada aturan garis horizontal membimbing mereka. Semuanya merata spasi dan proporsional ke garis set, dan semuanya disimpan terorganisir.Ini adalah ritme vertikal. Di web, kita tidak memiliki garis horizontal membimbing kita untuk membuat tipografi, tetapi efeknya masih bisa sama ketika kita mematuhi garis horisontal imajiner. Untuk tipografi mudah dibaca yang memberikan dari efek estetika yang besar dan menempatkan bersama-sama-lihat, mematuhi segala sesuatu untuk notebook imajiner - dasar web tipografi atau irama vertikal.

Kredit gambar: pinksherbet

1. Tentukan ukuran font dasar. Sebuah ukuran font 0.75em umum, menyesuaikan diperlukan sesuai dengan kebutuhan atau preferensi. EM adalah yang paling tepat sehingga pengguna IE dapat menyesuaikan ukuran font jika diperlukan, tetapi jika Anda berpikir di poin atau piksel yang lebih baik, menggunakan ini untuk saat ini dan mengkonversi kemudian dengan alat ini: PXtoEM.com .
2. Mengatur tinggi baris sekitar 1.5x ukuran font dasar. Jadi jika Anda memiliki ukuran font dasar 0.75em, ketinggian garis akan 1.125em, atau 1.12em-1.13em. Ini adalah titik awal yang baik dan adalah yang paling umum. Ini juga yang paling terbaca dalam banyak situasi. Namun, set jumlah ini tidak penting untuk menciptakan ritme vertikal. Sesuaikan sedikit yang diperlukan, tetapi pastikan untuk tidak bergoyang ketinggian garis terlalu pendek atau terlalu panjang.
3. Oleskan tinggi baris untuk semua teks lain pada halaman. Paragraf, daftar, judul, dll tinggi baris Anda seperti ketinggian setiap baris pada selembar kertas notebook. Untuk menghitung baris ketinggian ini: baseline (teks biasa) ukuran tinggi baris / font. Jadi, jika salah satu dari pos tag kami adalah pada ketinggian 1.5em, maka kita akan mengambil ketinggian kami baseline (1.125em) / ukuran font saat ini (1.5em), yang akan membuat kita mengatur pos garis tinggi untuk 0.75em.
4. Mengatur margin bawah elemen teks. Bagian bawah margin pada unsur-unsur yang membutuhkannya harus sama dengan tinggi baris mereka. Ini bertindak sebagai garis ekstra yang belum digunakan pada kami "kertas notebook."