Foundation 6 - 10 tính năng mới tuyệt vời
Các nhà phát triển của khuôn khổ front-end Foundation không chỉ ngồi trên vòng nguyệt quế của họ trong khi nhóm Bootstrap đang làm việc trên phiên bản chính mới đầy ấn tượng của họ. Năm ngoái, họ đã tham gia World Tour tuyệt vời để chia sẻ kiến thức của họ với người dùng và hỏi họ về cách họ sử dụng Foundation trong công việc thực tế của họ.
Sau khi trở về bàn làm việc, họ đã tổng hợp các nhu cầu và mong muốn của người dùng và bắt tay vào kế hoạch phát hành chính của khung mới: Foundation 6.
Nó vẫn đang được phát triển, nhưng các kế hoạch rất hứa hẹn. Các tính năng sắp tới tập trung vào 3 lĩnh vực chính: hiệu suất, khả năng tùy biến và khả năng truy cập. Bây giờ chúng ta hãy xem 10 tính năng này.
1. Quy trình làm việc hợp lý
Dựa trên kinh nghiệm của người dùng của họ, nhóm Foundation đã phát triển một khẩu hiệu mới, cụ thể là “Nguyên mẫu để sản xuất”, cho Foundation 6. Điều này có nghĩa là một quy trình công việc mới, được sắp xếp hợp lý sẽ cho phép các nhà thiết kế và nhà phát triển đi thẳng từ nguyên mẫu đến sản xuất.
Mục tiêu của Foundation 6 mới là cung cấp một khung linh hoạt và dễ dàng tùy chỉnh để có thể viết mã sạch và ngữ nghĩa ngay từ đầu. Phiên bản hiện tại, Foundation 5 cũng cho phép tạo mẫu nhanh, nhưng chúng ta có thể mong đợi tối ưu hóa công việc hơn nữa trong phiên bản sắp tới.
2. Quy trình thiết lập đơn giản hóa cho phiên bản Sass
Một trong những điều tuyệt vời nhất về khung Foundation là nó được xây dựng bằng ngôn ngữ biểu định kiểu Sass, do đó có thể nhanh chóng tùy chỉnh các quy tắc kiểu mặc định theo nhu cầu thực tế của chúng tôi.
Tuy nhiên, quá trình thiết lập Sass có một chút đáng sợ đối với nhiều người dùng, vì vậy phiên bản chính mới sẽ có được một quy trình thiết lập đơn giản hóa cho phiên bản Sass. Điều này có nghĩa là thiết lập Sass sẽ đòi hỏi ít phụ thuộc hơn so với trước đây. Tất nhiên, nếu bạn thích phiên bản CSS vanilla, bạn vẫn có thể chọn tham gia.
3. Một ngăn xếp thiết lập mới, được nâng cấp cho những người theo chủ nghĩa tối đa
Bên cạnh phiên bản Sass thông thường, Foundation 6 sẽ đi kèm với một phiên bản mới Phiên bản Sass sẽ cung cấp cho các nhà phát triển các tùy chọn tùy chỉnh mạnh mẽ.
ZURB, người tạo ra Foundation sẽ mở ngăn xếp phát triển của riêng họ cho công chúng, bao gồm cả chính họ trình tạo trang tĩnh, máy chủ tải lại trực tiếp và vô số các kỹ thuật tối ưu hóa bên trong bao gồm tích hợp UnCSS để xóa các kiểu không sử dụng và UglifyJS để nén JavaScript.
Vì vậy, về cơ bản, chúng tôi sẽ được phép hoạt động trong cùng môi trường phát triển mà ZURB sử dụng nội bộ.
4. Giảm thời gian tải trang
Nhóm Foundation đã phải đối mặt với một số lời chỉ trích mang tính xây dựng, tuyên bố rằng trong hầu hết các dự án Foundation, khoảng 90% mã CSS không được sử dụng. Điều này không chỉ đúng với Foundation mà còn đúng với các khung CSS chính khác như Bootstrap và TopCoat. Là một phần trong câu trả lời của họ, Zurb đã quyết định cắt giảm đáng kể kích thước tệp của CSS được xuất ra bằng cách thực hiện giảm khoảng 40-50% mã.
Thật thú vị khi lưu ý rằng họ cố gắng phân biệt mình với Bootstrap bằng cách nêu rõ "Nền tảng không phải là một khung sẽ có lề và lớp đệm cách điệu hoặc tròn và bán kính". (Để tham khảo xem Các lớp tiện ích mới của Bootstrap 4 trong bài viết trước của chúng tôi).
5. Kiểu cơ sở Hoạt động như khung dây
Phần khác của nỗ lực cải thiện hiệu suất là tạo một kiểu cơ sở hoạt động như một khung dây thay vì thiết kế cuối cùng. Điều này chủ yếu dẫn đến một chủ đề nhẹ hơn, nhưng cũng có một lợi thế lớn khác. Khi nhiều quy tắc kiểu sẽ được chuyển vào các thành phần riêng lẻ, nhà phát triển sẽ có cơ hội dễ dàng hơn phong cách thiết kế của họ.
Hy vọng rằng điều này có nghĩa là các trang web dựa trên Foundation sẽ có ít giao diện tương tự, và các nhà thiết kế sẽ có nhiều không gian hơneriment với solut đẹp và độc đáocác ion sẽ bác bỏ những lo lắng gần đây về một trang web trông nhàm chán.
6. Nhập khẩu có chọn lọc
Foundation 5 cho phép các nhà phát triển chỉ chọn các thành phần họ muốn sử dụng. Foundation 6 sẽ đưa nỗ lực này lên một tầm cao mới di chuyển tính năng nhập có chọn lọc vào tệp Sass _sinstall.scss.
Bằng cách này, _sinstall.scss sẽ là một tập tin cấu hình thực sự phổ quát, vì chúng tôi sẽ không chỉ có thể tùy chỉnh các tính năng như chiều rộng hàng hoặc phông chữ mặc định với sự trợ giúp của nó, mà còn dễ dàng từ chối các thành phần chúng ta không cần. Nếu chúng ta làm như vậy, chúng ta có thể đạt được một cải tiến hiệu suất hơn nữa.
7. Leaner và Sass sạch hơn
Trong quy trình thiết kế lại, nhóm Foundation đã suy nghĩ lại mọi khía cạnh của khung, vì vậy họ cũng đã thay đổi cách họ đã sử dụng ngôn ngữ biểu định kiểu Sass. Họ thấy rằng trong một số trường hợp, họ đã lạm dụng Sass dẫn đến sự quá mức không cần thiết của đầu ra CSS. Với mục tiêu là một cơ sở mã gọn gàng và sạch hơn trong tâm trí của họ, họ cũng đã hợp lý hóa cấu trúc Sass của họ.
Trong Foundation 6 chúng ta có thể mong đợi giảm lồng và tính đặc hiệu, các truy vấn phương tiện được sắp xếp hợp lý (họ đã hợp nhất mã lặp đi lặp lại) và mixins thành phần trở lại. Cái sau có nghĩa là sẽ có ít mixin thành phần hơn và những cái còn lại sẽ có ít tham số hơn, điều này sẽ dẫn đến một mã đơn giản hơn và logic hơn
Nếu bạn yêu thích mixins, đừng lo lắng, mọi thành phần vẫn sẽ có chúng, chỉ là chúng sẽ được thiết kế lại để hiệu quả và hữu ích hơn so với hiện tại.
8. Cải thiện lưới Mixins
Trong khi cắt giảm mixins thành phần, Foundation 6 sẽ đi kèm với mixin lưới tăng cường điều đó sẽ cho phép chúng ta tạo lưới tùy chỉnh hơn.
Zurb hứa rằng chúng ta sẽ có thể dễ dàng xây dựng như hệ thống lưới phức tạp như chúng ta muốn, bao gồm hàng tùy chỉnh tinh vi hơn và lưới lồng, và khả năng chuyển đổi các lớp mặc định thành đánh dấu ngữ nghĩa. Các mixin lưới được cải thiện sẽ làm cho hiện tại tạo lưới thậm chí trực quan hơn, linh hoạt và nhanh hơn.
9. Tích hợp liền mạch các plugin JavaScript tùy chỉnh
Nền tảng 5 hiện có nhiều thành phần JavaScript như hộp thoại phương thức thú vị, chú giải công cụ, thanh điều hướng dính, hộp đèn và nhiều thứ khác mà một trang web hiện đại cần, nhưng phiên bản chính sắp tới sẽ cho phép chúng tôi viết các plugin JavaScript tùy chỉnh của chúng tôi lợi dụng cốt lõi Foundation. Đó là một bước tiến lớn trong cả hai thân thiện với người dùng và hiệu suất.
Trong tương lai, chúng tôi sẽ có thể truy cập các phương thức khởi tạo tích hợp, chuyển đổi kích hoạt và điểm dừng, và sử dụng tất cả các tính năng khác của JavaScript toàn cầu của Foundation.
10. Khả năng tiếp cận đầy đủ
Có lẽ tính năng tuyệt vời nhất của Foundation 6 mới là nó sẽ có thể truy cập đầy đủ. Mỗi đoạn mã thành phần và mã sẽ đi kèm với các thuộc tính và vai trò mốc quan trọng của WAI-ARIA. Hơn nữa, các nhà phát triển thậm chí sẽ được cung cấp với một hướng dẫn sử dụng trong khoảng Làm thế nào để sử dụng các tiêu chuẩn web a11y.
Vì vậy, nếu chúng tôi muốn cung cấp cho khách hàng của mình một trang web có thể truy cập đầy đủ, chúng tôi không cần phải làm gì khác ngoài việc xây dựng thiết kế của chúng tôi với Foundation 6. Xin lưu ý rằng chúng tôi vẫn sẽ cần thêm các quy tắc ARIA thích hợp vào các trang HTML của chúng tôi, mặc dù hướng dẫn sử dụng a11y sắp tới của Zurb chắc chắn sẽ tạo điều kiện thuận lợi cho quá trình học tập.