Binti Qomariah - Assalamu'alaikum sobat,
Hari ini saya akan memperkenalkan teman-teman semua dengan Font Awesom dan Icon Bootstrap (Glyphicon). Apa sih yang dimaksud dengan Font Awesom dan Icon Bootstrap, ada apa didalam icon-icon tersebut? dan apa sih keuntungan, kekurangan dan perbedaan dari kedua icon tersebut. Baik, agar lebih jelasnya kita langsung saja ke topik bahasannya.
PENGERTIAN
Font Awesom adalah Huruf dan/atau angka yang membentuk desain blogger atau website.
Icon Glyphicon adalah Icon bawaan bootstrap yang berbasis text dan lebih ringan digunakan.
LATAR BELAKANG
Ingin mengetahui kekurangan, kelebihan dan perbedaan dari kedua icon tersebut.
MAKSUD DAN TUJUAN
Mengenal icon yang digunakan pada bootsrap.
HASIL YANG DIHARAPKAN
- Mengetahui perbedaan kedua icon tersebut.
- Mengenal lebih jauh lagi mengenai kedua icon tersebut.
- Mengetahui perbedaan dari kedua icon tersebut.
URAIAN
1. Font Awesom
Font awesom merupakan font yang berisi icon-icon yang telah dimuat menjadi framework css yang bisa digunakan untuk mempermudah menampilkan icon-icon standar dalam front-end development. Font Awesome dibuat oleh Dave Gandy.
Sebenarnya Font Awesome didisain untuk Bootstrap, namun masih oke digunakan untuk framework yang lainnya. Karena Font Awesome merupakan vektor, jadi kita nggak perlu takut menggunakan size besar dan khawatir tampilannya akan rusak jika digunakan pada size yang besar.
Kita juga bisa memperlakukan font awesom sama seperti font icon lainnya misalnya saja memberi warna pada bckgroundnya atau pada iconnya.
Kelebihan kita menggunakan font awesom ini adalah kita tidak perlu lagi repot-repot untuk membuat gambar sendiri, melainkan kita hanya perlu untuk mengetikkan kode font-nya saja. Pada saat ini, font awesom sudah versi 4.3.
Untuk menggunakan font awesome ini kita perlu menambahkan tag <span> kemudian diikuti dengan fa fa- kemudian nama icon yang dipanggil.
Berikut ini adalah preview dari font awesom 4.3 :
2. Icon Glyphicon Bootstrap
Bootstrap menyediakan icon bawaan dari bootstrp sendiri yang disebut dengan glyphicon. Kita hanya perlu memanggil class-nya saja kemudian nama icon-nya. Untuk menampilkan icon glyphicon, kita hanya perlu menggunakan tag <span> diikuti dengan glyphicon glyphico- dan diikuti dengan nama icon glyphicon.
Keuntungan menggunakan icon ini adalah memudahkan kita untuk membuat icon untuk bootstrap tanpa harus meggambar sendiri.
Berikut ini adalah preview dari icon glyphicon :
3. Perbedaan Icon Glyphicon dan Font awesome
Keduanya memiliki fungsi yang sama. Namun, font awesome lebih berfariasi.
HASIL YANG DIDAPAT
Mengetahui perbedaan dan kelebihan dari masing-masing icon.
KESIMPULAN
Kedua Icon tersebut memiliki fungsi yang sama hanya pemanggilannya saja yang berbeda.
REFERENSI
https://www.malasngoding.caom/cara-membuat-icon-dengan-bootstrap/
https://astavera.blogspot.co.id/2015/07/icon-social-dengan-gambar-font-awesome.html
This is dummy text. It is not meant to be read. Accordingly, it is difficult to figure out when to end it. But then, this is dummy text. It is not meant to be read. Period.
ConversionConversion EmoticonEmoticon