Top 3 Responsive CSS Framework

Top 3 Responsive CSS Framework

Top 3 Responsive CSS Framework

Front-end frameworks đang phát triển nhanh chóng và giúp lập trình ây dựng website cực kỳ nhanh chóng. Đặt biệt trong kỳ smartphone đang phổ biến. Đa số truy cập website đến từ điện thoại. Giao diện website buộc phải thân thiện với di động. Lựa chọn css framework cực kỳ quan trong với hầu hât các lập trình viên website.

Vì có khá nhiều css framework và css framework tuỳ thuộc vào kinh nghiệm lập trình viên và lĩnh vực hoạt động. Dưới đây là điểm mạnh điểm yếu của 3 css framework hàng đầu.

 

1. Bootstrap

Bootstrap là css được xây dựng bởi các lập trình viên Twitter. Bootstrap ngày càng phát triển trở thành css framework phổ biến nhất thế giới. Hầu hết các theme bán trên themeforest đều xây dựng trên bootstrap.

Giống như hầu hết frontend framework, Bootstrap CSS, HTML và JavaScript, hay JS, components. Bootstrap tuần thủ các tiêu chuẩn về thiết kế, ho phép lập trình viên thiết kế trang web phức tạp thân thiện với desktop và mobile.

Bootstrap được update thường xuyên version mới nhất hiện hổ trợ SCSS. Cách đặt tên class để nhớ.

Điểm mạnh:

  • Responsive tốt
  • Tài liệu phong phú. 

Điểm yếu:

  • Kích thước file css lớn. Có nhiều thành component cho mobile không hổ trợ như menu Off canvas, 
  • Số lượng tên class lớn có thể gây khó khăn cho người dùng.
  • Tối ưu cho mobile yếu.

Đối tượng: sinh viên mới ra trường và các lập trình viên ít kinh nghiệm bởi được hổ trợ mạnh bở cộng đòng mạng.

2. Foundation

Được xây dựng bởi công ty Foundation. Founadtion là css frameword có tính tuỳ biến cao đươc sử dụng trong môi trường doanh nghiệp. Được sử dụng bởi  Facebook, eBay, and Mozilla, Founadtion á phức tạp và không phù hợp với người ít kinh nghiệm.

Foundation chứ nhiêu chức năng hổ trợ  GPU acceleration để tạo các hiệ ứng chuyển động mượt mà  và Fastclick.js, cho tốc độ render page nhanh trên diện thoai. Foundation biên dich dựa trên  Sass preprocessor. và data attribute, giup load nhanh trên mobile và html nặng trên desktop.

Điểm mạnh:

  • Có tính linh hoạt cao
  • sửa dụng  REMS thay cho pixels.
  • Hổ trợ responsive cho email
  • Có chức năng Block Building giup xây dựng website nhanh chóng

Điểm yếu::

  • Kích thước file lớn
  • Phức tạp với người mới sử dụng.

Đối tượng: Phù hợp với lập trình viên có vốn kinh nghiệm nhát đinh và công việc đòi hỏi thiết kế nhanh load page nhẹ.

3. UIKit

UIKit là frontend framework có cấu truc module cao. Uikit bao gồm cả 2 phiên bản cho  LESS and Sass CSS.

Gồm 1 số lượng lớn các component hổ trợ gần như tất cả yêu cầu cho thiết kế web từ grid, masondary, lightbox, scroll, menu off canvas…, UIKit đang trở nên là frontend framework phổ biến trên thế giới.

Uikit hổ trợ plugin auto complete cho IDE sublime text, Atom giups lập trình viên đơn xây dựng HTML nhanh chóng thuận tiện.

Điểm mạnh:

  • Hổ trợ hầu hết các component cần thiết cho xây website.
  • Dể chỉnh sửa thay đổi, thêm css,js, component mới
  • Giao diện mặt định đẹp. 
  • Tốc độ render nhanh. Có cơ chế chặn render blocking. 

Điểm yếu:

  • Ít tài liệu tham khảo

Đối tương: dành cho các lập trinh viên có kinh nghiệm và các ứng dụng đòi hỏi tương tác cao và trải nghiệm người cao.

Tổng kết

Với lập trình viên ít kinh nghiệm và mới ra trường bootstrap là lựa chọn tốt cho các bắt đầu tìm hiểu frontend framework. 

Với lập trình viên có kinh nghiệm việc tìm hiểu thêm 1 frontend framework mới như foundation hay UIkit là cần thiết.

Với mìn đã thử qua cả 3 frontend framework trên và hoàn toàn hài lòng với UIkit dù đã nhiều năm làm việc với bootstrap.