BERITA PROGRAMMING 5 CSS Framework yang Membuat Design Web Lebih Mudah

5 CSS Framework yang Membuat Design Web Lebih Mudah

Oleh Andi Taru | Minggu, 13 September 2020

5 CSS Framework yang Membuat Design Web Lebih Mudah

Framework CSS akan mempercepat dan mempermudah programmer atau designer di dalam merancang tampilan website.

Aktivitas di kantor membosankan?
Karyawan engangement kurang?
GAMIFIKASI-IN aja!

Yuk, ikuti program inovatif MAGANG ONLINE untuk berbagai bidang seperti animasi, coding, 3D, illustrasi, musik dan bisnis hanya di GAMELAB.ID!

Daftar Isi Artikel

Kali ini saya akan membahas 5 CSS framework yang wajib kamu ketahui dan coba. Untuk menjadi front-end web developer kamu perlu menguasai salah satunya. 

1. TAILWINDCSS

Tailwind CSS adalah CSS Framework tingkat rendah yang sangat dapat dicustom dan menyediakan semua blok  yang dibutuhkan untuk membangun desain web yang mudah diganti ke depannya. Beberapa elemen utama yang disediakan oleh framework ini adalah: 

  • Alerts
  • Buttons
  • Cards
  • Forms
  • Grids
  • Navigation

Informasi lebih lengkap kamu bisa berkunjung ke alamat berikut ini: https://tailwindcss.com/ 

2. BOOTSTRAP

Ini adalah CSS Framework yang paling sering dibahas dan digunakan. Bootstrap menjanjikan proses desain yang cepat dan responsive untuk berbagai jenis device. Mendukung variabel dan Saas, responsive grid system, prebuilt components dan berbagai plugin JavaScript yang powerful.

Tutorial dan komponen yang disediakan di bootstrap sendiri juga sangat lengkap seperti: 

  • Layout (Grid, dll)
  • Content (Typography, Code, Images, Tables, Figures)
  • Components (Alerts, Badges, Breadcumb, Buttons, Card, Collapse, dll)
  • Utilities (Borders, Clearfix, Colors, Flex, Float, dll)
  • Extends (Icons, dll)

Untuk mempelajari lebih lanjut kamu bisa berkunjung ke alamat ini: https://getbootstrap.com/ 


3. Materialize CSS

Merupakan CSS Framework yang berbasis pada Material Design. Menyediakan berbagai komponen seperti Badges, Buttons, Breadcumbs, dan lain-lain. Tersedia juga berbagai theme menarik seharga $59.99 untuk semua paket. Kamu bisa mencoba berbagai komponen unik seperti Chips, Pickers dan Switches.

Untuk lebih lengkapnya kamu bisa berkunjung di alamat https://materializecss.com/ 

4. FOUNDATION

Berikutnya adalah Foundation CSS Framework, dimana mereka menyebut diri mereka sebagai "The most advanced responsive front-end framework in the world." Paling tidak ada 4 yang mereka unggulkan yaitu: 

  • Semantic
  • Mobile First
  • Customizable
  • Professional

Untuk lebih lengkapnya kamu bisa berkunjung ke alamat ini https://get.foundation/ 

Baca Juga : Mengupas Esensi dan Pentingnya Navigasi Desain UI/UX untuk Pengalaman Pengguna yang Lebih Baik


5. SEMANTIC

Terakhir, CSS Framework yang saya rekomendasikan adalah Semantic UI. Mereka menyebut diri mereka sebagai "User Interface is the language of the web". Setidaknya ada 3 hal yang mereka unggulkan yaitu: 

  • Concise HTML, UI semantik memperlakukan kata dan kelas sebagai konsep yang dapat dipertukarkan.
  • Intuitive JavaScript, semantik menggunakan frase sederhana yang disebut perilaku yang memicu fungsionalitas.
  • Simplified Debuging, pencatatan kinerja memungkinkan Anda melacak kemacetan tanpa menggali jejak tumpukan.

Terdapat setidaknya 3.000 Theming Variables, 50 lebih UI components dan 5.000 lebih comits dalam open source mereka. Ada beberapa view yang menarik seperti Advertisement, Feed, dan Rating. Untuk lebih lengkapnya kamu bisa mengunjungi alamat berikut https://semantic-ui.com/ 


Andi Taru

Andi Taru

Minggu, 13 September 2020

ARTIKEL TERKAIT

Magang lebih mudah dan bisa dilakukan dari mana saja dengan Program Magang Online Gamelab. Magang Bersertifikat, plus Pelatihan!

DAFTAR MAGANG

ARTIKEL POPULER

KATEGORI