Kandungan
Artikel ini pertama kali muncul dalam edisi 229 majalah .net - majalah terlaris di dunia untuk pereka dan pembangun web.
Salah satu perkara paling penting yang dapat anda fokuskan ketika menyusun halaman dalam HTML / CSS adalah irama menegak - corak visual yang membentuk blok jenis atau garis jenis ketika anda mengimbas halaman.
Perkara-perkara lain boleh mempengaruhi irama ini seperti tajuk, item senarai, gambar, dan sebagainya. Mempunyai irama menegak yang baik adalah yang terpenting kerana ia membantu pembacaan dan kemampuan imbasan halaman anda.
Terdapat beberapa tutorial hebat (lihat di sini dan di sini, sebagai contoh) di web di mana anda boleh mendapatkan maklumat mengenai cara mencapai irama menegak yang betul secara teknikal dengan menggunakan ems untuk ketinggian garis anda dan belajar tentang apa yang mengekalkan jenis anda 'dalam fasa' bermaksud.
Hierarki
Perkara asas yang perlu diberi perhatian adalah ketinggian garis antara elemen dan keseluruhan hierarki visual di halaman. Menetapkan bahagian ketinggian garis yang betul boleh menjadi latihan reka bentuk yang terlibat tetapi penting untuk dikuasai. Hierarki juga penting, kerana gambar dan elemen teks harus selaras antara satu sama lain secara visual - perkara yang paling penting pada amnya lebih besar dan didahulukan di halaman.
Pereka cetakan telah menangani idea irama menegak selama bertahun-tahun dan hanya sejak kebelakangan ini pereka web harus benar-benar memasuki perkara ini. Dengan keperluan yang semakin meningkat untuk membina laman web menggunakan susun atur grid dan memperhatikan pelaksanaan yang responsif untuk menampung banyak lebar skrin, kini lebih penting daripada sebelumnya dari perspektif reka bentuk visual, mungkin lebih penting daripada sekadar teknikal.
Lima contoh untuk diperiksa
1. Unsur-unsur Gaya Tipografi Buku karya Robert Bringhurst ini adalah standard untuk kajian tipografi. Baca, habiskan, tuangkan ke otak anda dengan cara yang anda boleh.
2. Frank Chimero Selain benar-benar menakjubkan secara umum, reka bentuk semula laman web peribadi pereka Frank Chimero baru-baru ini mempamerkan irama menegak yang luar biasa. Dia menggunakan kesan paralaks untuk membantu membawa pulang irama semasa anda menatal halaman ke bawah juga.
3. Dan Cederholm Untuk contoh irama vertikal tipografi yang bagus, lihat blog Dan Cederholm. Ketinggian garis salinan dan tajuk utama adalah sesuai.
4. Makmal Fokus Reka bentuk web dan syarikat penjenamaan Focus Lab menggunakan hierarki dengan cermat untuk membantu menyampaikan perkara yang paling penting kepada pengunjung.
5. Typofonderie Laman web untuk Tipografi Studio Typofonderie mempunyai irama menegak yang hebat dengan gambar dan teksnya. Jarak antara elemen berkadar di seluruh laman web dan hierarki antara gambar utama dan gambar / bahagian sekunder adalah sempurna.
Ketahui 10 contoh reka bentuk eksperimen yang menakjubkan di Creative Bloq.
