Khoá học này chia nhỏ các biểu mẫu HTML thành các phần dễ hiểu. Trong vài học phần tiếp theo, bạn sẽ tìm hiểu cách hoạt động của biểu mẫu HTML và cách sử dụng biểu mẫu này sao cho hiệu quả trong các dự án của mình. Sử dụng ngăn trình đơn bên cạnh biểu trưng Tìm hiểu biểu mẫu để điều hướng các mô-đun.
Bạn sẽ tìm hiểu cách tạo một biểu mẫu HTML cơ bản, về các thành phần biểu mẫu HTML, tạo kiểu cho biểu mẫu, giúp người dùng nhập lại dữ liệu, đảm bảo rằng biểu mẫu có thể truy cập được và an toàn, cách kiểm tra biểu mẫu cũng như về các loại biểu mẫu cụ thể.
Mỗi học phần có đầy đủ các bản minh hoạ có tính tương tác và bài tự đánh giá để bạn kiểm tra kiến thức của mình.
Khoá học này phù hợp với những người mới bắt đầu và các nhà phát triển HTML nâng cao. Một số mô-đun đầu tiên giúp bạn bắt đầu xây dựng biểu mẫu HTML, các mô-đun khác sẽ cung cấp thêm chi tiết. Bạn có thể xem qua loạt từ đầu đến cuối để hiểu chung về biểu mẫu HTML hoặc chọn một mô-đun cụ thể mà bạn muốn tìm hiểu thêm.
Điều kiện tiên quyết
Trước khi bắt đầu khoá học này, bạn nên biết về HTML. Đối với những người mới làm quen với việc phát triển web, hãy xem khoá học giới thiệu về HTML của MDN để tìm hiểu mọi thông tin về cách viết mã đánh dấu.
Bản thu thử
Đối với hầu hết các bản minh hoạ, chúng ta sử dụng CodePen.
Nhìn vào bản minh hoạ, có thể bạn sẽ thắc mắc về nguồn gốc của các kiểu. Chúng tôi sử dụng biểu định kiểu chung có trong tất cả các bản minh hoạ, do đó, chỉ các kiểu có liên quan mới hiển thị ở đó. Trong CodePen, bạn có thể chọn các tệp CSS đi kèm trong phần Cài đặt.
Các thành phần điều khiển biểu mẫu và các trường của biểu mẫu
Thành phần điều khiển biểu mẫu là một phần tử cho phép người dùng tương tác và chọn hoặc chọn dữ liệu: <input>
, <select>
, <textarea>
hoặc <button>
.
Đôi khi, trường biểu mẫu được dùng để tham chiếu đến các thành phần điều khiển biểu mẫu, trong các phần tử cụ thể cho mục nhập văn bản: <input>
và <textarea>
.
Sau đây là những nội dung bạn sẽ tìm hiểu
Sử dụng biểu mẫu để lấy dữ liệu từ người dùng
Tìm hiểu kiến thức cơ bản về cách sử dụng biểu mẫu trên web qua phần giới thiệu về phần tử biểu mẫu này.
Giúp người dùng nhập dữ liệu vào biểu mẫu
Tổng quan về các thành phần biểu mẫu mà bạn có thể chọn để tạo biểu mẫu.
Giúp người dùng tránh nhập lại dữ liệu trong biểu mẫu
Giúp người dùng điền vào biểu mẫu thuận tiện hơn.
Giúp người dùng nhập đúng dữ liệu vào biểu mẫu
Tìm hiểu cách xác thực biểu mẫu trên giao diện người dùng.
Kiểm thử biểu mẫu
Tìm hiểu cách kiểm tra và phân tích biểu mẫu của bạn.
Kiến thức cơ bản về thiết kế
Tìm hiểu cách xây dựng biểu mẫu thân thiện với người dùng.
Hỗ trợ tiếp cận
Cách xây dựng biểu mẫu dành cho tất cả mọi người.
Quốc tế hoá và bản địa hoá
Chuẩn bị cho các định dạng dữ liệu quốc tế và tìm hiểu cách lập kế hoạch biểu mẫu để bản địa hoá.
Bảo mật và quyền riêng tư
Tìm hiểu cách bảo mật biểu mẫu và bảo mật dữ liệu của người dùng.
Tự động điền
Tìm hiểu mọi thông tin về tính năng tự động điền và thuộc tính tự động hoàn thành.
Cách kiểm tra khả năng hữu dụng của biểu mẫu
Khám phá cách kiểm tra khả năng hữu dụng và đảm bảo biểu mẫu của bạn hoạt động tốt cho tất cả người dùng.
Kiểm thử biểu mẫu trên nhiều thiết bị và nền tảng
Đảm bảo biểu mẫu của bạn hoạt động với nhiều thiết bị, trình duyệt, nền tảng và ngữ cảnh khác nhau.
Thu thập dữ liệu
Tìm hiểu cách đo lường và phân tích biểu mẫu.
Thông tin chuyên sâu về biểu mẫu
Tìm hiểu mọi thứ về yếu tố biểu mẫu, thời điểm bạn nên sử dụng biểu mẫu và cách hoạt động chi tiết của biểu mẫu.
Thông tin chuyên sâu về trường biểu mẫu
Tìm hiểu về các trường biểu mẫu mà bạn có thể sử dụng và cách chọn thành phần biểu mẫu phù hợp.
Thông tin chuyên sâu về thuộc tính biểu mẫu
Tìm hiểu mọi thuộc tính của biểu mẫu: cách sửa đổi bố cục của bàn phím ảo, kích hoạt tính năng xác thực tích hợp, v.v.
Tạo kiểu cho biểu mẫu
Tạo kiểu cho các biểu mẫu bằng cách sử dụng CSS, trong khi vẫn đảm bảo chúng vẫn hữu dụng và dễ đọc đối với mọi người.
Tạo kiểu cho các thành phần điều khiển biểu mẫu
Tìm hiểu cách triển khai các tùy chọn kiểm soát biểu mẫu bằng CSS.
JavaScript
Tìm hiểu cách sử dụng JavaScript để cải thiện biểu mẫu của bạn.
Hình thức thanh toán
Cải thiện tỷ lệ chuyển đổi bằng cách xây dựng các phương thức thanh toán tốt hơn.
Biểu mẫu địa chỉ
Giúp người dùng điền vào biểu mẫu địa chỉ một cách nhanh chóng và dễ dàng.
Tổng kết và các bước tiếp theo
Các tài nguyên khác giúp bạn thực hiện các bước tiếp theo.
Vậy, bạn đã sẵn sàng tìm hiểu về biểu mẫu chưa? Hãy bắt đầu nào.