Learn about Forms

Learn to design user-friendly forms that improve conversion rates and minimize user frustration with these tutorials on form design best practices.
  1. Kiểm tra tính hợp lệ của Form trong HTML5 với thuộc tính "pattern"

    Kiểm tra tính hợp lệ của Form trong HTML5 với thuộc tính "pattern"

    Tutorial Intermediate

    Trong hướng dẫn này, chúng ta sẽ khám phá thuộc tính pattern của HTML, sử dụng nó để giúp chúng ta tùy biến cách chúng ta kiểm tra tính hợp lệ của form.

  2. Mẹo nhỏ: Thêm một Formspree vào các trang web tĩnh của bạn

    Mẹo nhỏ: Thêm một Formspree vào các trang web tĩnh của bạn

    Tutorial Beginner

    Trong hướng dẫn này chúng ta sẽ tìm hiểu một vấn đề—cách dễ dàng để thêm các form động, linh hoạt vào các trang web tĩnh của bạn.

  3. Cách xây dựng một Form có tính đáp ứng (Responsive) với Flexbox

    Cách xây dựng một Form có tính đáp ứng (Responsive) với Flexbox

    Tutorial Beginner

    Trong hướng dẫn này, chúng ta sẽ tìm hiểu cách tận dụng flexbox để tạo ra một form có tính đáp ứng cao. Điều đáng chú ý là (và thú vị cùng một lúc) flexbox...

  4. Làm Thế Nào Để Tạo Các Nhãn Di Chuyển Với Trình Xác Nhận Của HTML5 (HTML5 Validation)

    Làm Thế Nào Để Tạo Các Nhãn Di Chuyển Với Trình Xác Nhận Của HTML5 (HTML5 Validation)

    Tutorial Intermediate

    TL; DR Thay thế trình xác nhận bằng JavaScript của bạn bằng trình xác nhận của HTML5. Nó dễ dàng hơn bạn tưởng đấy, và nó sẽ cung cấp cho bạn...

  5. Xây dựng một Form liên hệ Bootstrap Sử dụng PHP và AJAX

    Xây dựng một Form liên hệ Bootstrap Sử dụng PHP và AJAX

    Tutorial Beginner

    Trong hướng dẫn này tôi sẽ đi qua các bước để tạo ra một form liên hệ, tận dụng framework front-end phổ biến nhất, Bootstrap, kết hợp với AJAX và PHP. Từ đó...

  6. Cuộc thi số 2 CodePen: Kết quả!

    Cuộc thi số 2 CodePen: Kết quả!

    Tutorial Beginner

    Tuần trước chúng tôi đã mời các bạn tham gia vào các thách thức CodePen thứ hai của chúng tôi: tạo định dạng một mẫu đăng ký danh sách gửi thư. Có hơn 60 bạn...

  7. Cách tích hợp "No CAPTCHA reCAPTCHA" vào Trang web của bạn

    Cách tích hợp "No CAPTCHA reCAPTCHA" vào Trang web của bạn

    Tutorial Beginner

    Các input CAPTCHA có lẽ là phổ biến nhất trong số tất cả các trải nghiệm phiền phức trên web. Chúng làm tốn công đối với đa số người dùng, hãy để một mình...

  8. Thiết kế Bộ Giao diện Web App trong Adobe Photoshop

    Thiết kế Bộ Giao diện Web App trong Adobe Photoshop

    Tutorial Intermediate

    Style guide cung cấp một hướng tiếp cận vô cùng linh hoạt đối với thiết kế web hiện đại. Trong bài hướng dẫn này, tôi sẽ hướng dẫn bạn thiết kế một bộ giao...

  9. Thực hành CSS với một Form Tìm kiếm

    Thực hành CSS với một Form Tìm kiếm

    Tutorial Intermediate

    Trong hướng dẫn này, chúng ta sẽ khám phá cách trang trí một form tìm kiếm đơn giản. Chúng ta sẽ không làm bất cứ điều gì cao siêu cả, thay vào đó khám phá...

  10. Mẹo nhỏ: Checkbox và Radio Button với CSS3

    Mẹo nhỏ: Checkbox và Radio Button với CSS3

    Tutorial Beginner

    Có bao giờ bạn tự hỏi làm thế nào để định phong cách cho checkbox và radio button mà không cần đến JavaScript không? Nhờ CSS3, bạn có thể làm điều đó! Dưới...