Thành phần HowTo
"HowTo: Components" (Cách thực hiện: Thành phần) là một tập hợp các thành phần web triển khai các mẫu giao diện người dùng phổ biến. Mục đích của các cách triển khai này là cung cấp tài nguyên giáo dục. Bạn có thể đọc qua cách triển khai có nhiều chú thích của các thành phần khác nhau và hy vọng có thể học hỏi từ đó. Xin lưu ý rằng các thư viện này KHÔNG rõ ràng là thư viện giao diện người dùng và KHÔNG được dùng trong phiên bản chính thức.
Thành phần
<howto-checkbox>: đại diện cho một tuỳ chọn boolean trong một biểu mẫu. Loại hộp đánh dấu phổ biến nhất là loại kép, cho phép người dùng chuyển đổi giữa hai lựa chọn – đã đánh dấu và chưa đánh dấu.<howto-tabs>: giới hạn nội dung hiển thị bằng cách tách nội dung đó thành nhiều bảng điều khiển.<howto-tooltip>: một cửa sổ bật lên hiển thị thông tin liên quan đến một phần tử khi phần tử đó nhận được tiêu điểm bàn phím hoặc khi chuột di chuột qua phần tử đó.
Bàn thắng
Mục tiêu của chúng tôi là minh hoạ các phương pháp hay nhất để viết các thành phần mạnh mẽ, dễ tiếp cận, hiệu quả, dễ bảo trì và dễ tạo kiểu. Mỗi thành phần hoàn toàn độc lập nên có thể đóng vai trò là phương thức triển khai tham chiếu.
Hỗ trợ tiếp cận
Các thành phần tuân thủ chặt chẽ Phương pháp biên soạn WAI ARIA. Đây là hướng dẫn giải thích và trình bày ARIA, tiêu chuẩn Ứng dụng Internet đa dạng thức có thể truy cập. Nếu bạn chưa quen với ARIA, hãy xem phần giới thiệu của chúng tôi về WebFundamentals. Mỗi thành phần liên kết đến phần có liên quan trong phần Các phương pháp biên soạn. Mặc dù không bắt buộc, nhưng bạn nên đọc phần Các phương pháp biên soạn trước khi tìm hiểu sâu về mã.
Hiệu suất
Trong quá trình phát triển web, thuật ngữ "hiệu suất" có thể được áp dụng cho nhiều thứ. Trong ngữ cảnh của <howto>, hiệu suất chủ yếu đề cập đến ảnh động chạy liên tục ở tốc độ 60 khung hình/giây, ngay cả trên thiết bị di động.
Tính linh hoạt về hình ảnh
Thành phần không được tạo kiểu trừ phi bố cục hoặc để cho biết trạng thái đã chọn hoặc đang hoạt động. Điều này giúp quá trình triển khai linh hoạt và tập trung về mặt hình ảnh. Bằng cách không dành thời gian cho việc trang trí, chúng ta chỉ giới hạn mã ở những phần hoàn toàn cần thiết để tạo chức năng cho thành phần. Nếu cần bất kỳ kiểu nào để thành phần hoạt động, kiểu đó sẽ được đánh dấu bằng một nhận xét giải thích lý do.
Mã có thể bảo trì
Vì HowTo: Components là một cách triển khai tham chiếu, nên chúng tôi đã dành thêm thời gian để viết mã dễ đọc và dễ hiểu, có nhiều chú thích.
Không phải mục tiêu
Là một thư viện / khung / bộ công cụ
Các thành phần <howto> không được phát hành trên npm, bower hoặc bất kỳ nền tảng nào khác vì chúng không được dùng trong môi trường sản xuất. Để có mã ngắn gọn, dễ đọc, chúng tôi đang sử dụng các API JavaScript hiện đại và hỗ trợ các trình duyệt hiện đại triển khai các tiêu chuẩn Thành phần web. Bạn sẽ có thể điều chỉnh mã cho phù hợp với nhu cầu của riêng mình sau khi đọc các cách triển khai này.
Có khả năng tương thích ngược
Không nên trực tiếp dựa vào mã này. Chúng tôi có thể và rất có thể sẽ thay đổi đáng kể cách triển khai và API của bất kỳ phần tử nào nếu phát hiện được cách triển khai tốt hơn. Đây là một tài nguyên sống động, nơi chúng ta có thể chia sẻ, khám phá và thảo luận về các phương pháp hay nhất để xây dựng giao diện người dùng web.
Hoàn chỉnh
Chúng tôi hiện không (và có thể sẽ không) triển khai *tất cả *thành phần có thể tìm thấy trong Các phương pháp biên soạn WAI ARIA. Tuy nhiên, việc sử dụng lại các nguyên tắc được dùng trong các thành phần <howto> khác sẽ cho phép người đọc triển khai mọi thành phần bị thiếu.