Web Design Dengan Tachyons

Assalamu'alaikum wr wb. Membagi informasi adalah suatu hal yang positif dan sangat bermanfaat, betul?. Kali ini informasi yang saya bagikan yaitu mengenai design blog atau situs. Beberapa tahun belakangan karena semakin pesat perkembangan web, framework mulai dikembangkan. Dengan tujuan mempermudah dalam pembangunan sebuah web.

Apa itu Framework

Framework adalah sekumpulan fungsi, class, atau API yang siap pakai. Yang bertujuan untuk mempercepat dan mempermudah proses development dan membuat standarisasi coding. candra.web.id dalam webnya menjelaskan framework adalah menghilangkan konsep “don’t reinvent the wheel” alias jangan mengerjakan sesuatu yang sudah di kerjakan oleh orang lain atau sudah pernah dikerjakan sebelumnya :). Ada banyak Framework yang populer digunakan oleh web-dev. Salah satunya adalah Tachyons yang akan kita bahas disini.

Apa itu Tachyons

Tachyon /ˈtæki.ɒn/ or tachyonic adalah partikel yang selalu bergerak lebih dari cahaya. Kata yang berasal dari bahasa Yunani : ταχύς atau tachys, yang berarti "cepat". Yang paling mendasar, Tachyons adalah sekumpulan class utiliti kecil yang memetakan properti CSS yang dapat dirangkai bersama untuk menciptakan desain. Tidak seperti kebanyakan framework CSS dimana kita harus load semuanya. Tachyons memungkinkan hanya melakukan load terhadap style tertentu. Hal inilah yang membuat saya tertarik. Saya sendiri belum mencoba menggunakan Tachyons. Contoh web yang menggunakan Tachyons adalah goldenstaterecord.com. kalau diperhatikan bagaimana CSS Framework ini dituliskan, mungkin untuk pemula ini akan sedikit membingungkan. Misalkan dalam sebuah element, kita memanggil banyak class yang berbeda. Salah satu kode nya terlihat seperti ini.

.br0 {        border-radius: 0; }
.br1 {        border-radius: .125rem; }
.br2 {        border-radius: .25rem; }
.br3 {        border-radius: .5rem; }
.br4 {        border-radius: 1rem; }
.br-100 {     border-radius: 100%; }
.br-pill {    border-radius: 9999px; }

.fw1: 100
.fw1-l: 100
.fw1-m: 100
.fw1-ns: 100
.fw2: 200

br yang berartiborder dan fwyang berarti font-weight.

Contoh Penggunaan

<h1 class="br4 fw2”>Hello Tachyons!</h1>

Bagaimana, apakah Anda tertarik dengan framework yang satu ini?. Jika iya ada baiknya melihat ke bagian dokumentasi dari Tachyons framework. Atau mungkin ingin melihat langsung dalam penerapannya di sebuah website. Ini beberapa contoh website yang menerapkan Tachyons framework. shubox.io, foredesign.co Semoga infomasi ini bermafaat. wa'alaikum salam wr wb.