Top 6 công nghệ CSS phổ biến cho thiết kế web

anhdp06 · 06/10/2014

Boilerplate, preprocessor, framework, là 3 công nghệ quan trọng, giúp nhà phát triển web có thể xây dựng giao diện độc đáo, nhất quán và tương thích cho nhiều thiết bị. Khi xuất hiện của nhiều công cụ sử dụng JavaScript, các nhà phát triển và thiết kế đang chứng kiến một cuộc bùng nổ về boilerplate, framework và các công cụ thiết kế web tương tự giúp chuẩn hoá, mở rộng và tận dụng được tối đa khả năng của CSS. Một số trong nhiều chọn lựa này đã đạt được những thành công ban đầu khi giúp nhiều nhà thiết kế và nhà phát triển tạo ra được những trang web và những ứng dụng mang tính nhất quán và đặc biệt là sử dụng được trên nhiều thiết bị (responsive).

Dưới đây là 6 công cụ Cascading Style Sheets (CSS) phổ biến nhất cho thiết kế web mà từng được các nhà phát triển sử dụng và đạt được những thành công đáng kể.

1. BASE
Base là một preprocessor CSS gọn nhẹ, biên dịch ra SASS (Syntactically Awesome CSS) hoặc LESS (Leaner CSS). Cho dù nhiều framework khác không còn hỗ trợ cho Internet Explorer nhưng Base vẫn hỗ trợ IE. ông Matthew Hartman - nhà phát triển ra Base cho biết, Base cung cấp cho các nhà thiết kế khả năng tạo ra được mã CSS với mã nguồn rõ ràng, gọn, và sạch . Hartman đang tạo một phiên bản thứ hai hướng đến di động, trong khi phiên bản hiện tại của Base tập trung vào để bàn .Theo ông, Base “ban đầu rất cơ bản nhưng phát triển rất nhanh khi có nhiều người sử dụng để thiết kế website. Ban đầu Base có thể có nhiều lỗi nhưng đây là công cụ rất tuyệt vời cho những nhà thiết kế website chuyên nghiệp”.

2. FOUNDATION
Framework Foundation có ưu điểm đó là ,là thiết kế responsive, giúp các nhà thiết kế website có thể tạo ra trang web một cách dễ dàng và ứng dụng web thay đổi đúng kích thước tuỳ theo thiết bị của người sử dụng. Ông Jonathan Smiley-trưởng nhóm thiết kế Foundation và là một đối tác công ty thiết kế web Zurb cho hay: Foundation là framework CSS đầu tiên tập trung tính năng responsive. Ngay từ những phiên bản đầu tiên của Foundation, khả năng responsive của Foundation đã giúp giải quyết vấn đề này cho nhiều nhà phát triển, thiết kế web. Foundation sử dụng SCSS (Sassy CSS), có những thành phần tích hợp, có sẵn các mẫu layout thiết kế và phông chữ, điều này cho phép các nhà thiết kế nhanh chóng tuỳ biến giao diện front-end.

3. KUBE
Nhiều người mới bắt đầu làm quen với CSS sẽ thấy “khó nuốt” với Kube nhưng họ vẫn có được vài hướng dẫn hữu ích về màu sắc, lưới, nút, form… Kube là framework CSS chuyên nghiệp. Trong khi các loại framework khác đưa ra sẵn các mẫu cho nhà thiết kế nên khiến nhiều trang web trông như tương tự nhau thì Kube đơn giản hơn nhiều, với phương châm tạo sự khác biệt. ông Artem Rosnovskiy - Nhà phát triển Kube cho biết: Kube không đưa ra những mẫu, form cứng nhắc, vì chỉ thích hợp cho nhà thiết kế và phát triển chuyên nghiệp. Kube đòi hỏi từ những nhà thiết kế và lập trình phải bỏ ra nhiều kỹ năng, công sức và thực sự hiểu sâu về CSS.

4.GUMBY
Chắc hẳn bạn còn nhớ thì Gumby là tên của một nhân vật hoạt hình toàn thân màu xanh lá, chiếu trên truyền hình cách nay 3 thập kỷ. Không những thế Gumby cũng là tên cho một framework CSS. Gumby rất linh động ở chỗ nhà phát triển có thể tạo được ngay mẫu giao diện theo ý tưởng của mình. Gumby còn hỗ trợ nhiều lưới (grid) với nhiều loại cột khác nhau và bộ tính năng UI như phông, nút, và các trường nhập liệu. Gumby hướng đến mục tiêu giúp các nhà phát triển không phải viết hàng trăm dòng code. Phiên bản Gumby hiện thời là Gumby 2.6, nhưng với bản 3.0 sắp đến, Gumby sẽ tăng thêm kích thước màn hình và loại thiết bị như máy tính xách tay màn hình chạm và máy tính bảng độ nét cao.

5. COMPASS
...
Xem tiếp tại: Top 6 công cụ CSS phổ biến nhất cho thiết kế web