Lompat menuju konten

State of HTML 2025

Form

Elemen dan atribut yang berkaitan dengan form

We're highlighting up-and-coming features or libraries we think you should know about.

Feature Highlight: Customizable Select

Customizable Select may not currently be widely supported, yet it's a feature worth knowing about. While only used by 7.1% of respondents, 89% of developers who have used it report a positive experience.

And given that the <select/> element has always been a challenge to style, being able to finally customize it to your needs without resorting to JavaScript-based hacks is a welcome improvement!

Baseline: Limited Availability

Learn more

Useful Resources

    Formulir Pengalaman & Sentimen

    Surprisingly, <input type="color"/> was the most used form-related feature this year, with 41.8% of respondents reporting having used it.

    But when looking at positive sentiment, basic UI building blocks like autocomplete (<datalist>) and dropdowns (Customizable Select) top the rankings, showing that developers value features that are customizable and can be tailored to their needs.

    Kelompokkan berdasarkan:

    Urutkan berdasarkan:

    1
    Form
    41.8%
    40.4%
    16.8%
    6,048
    2
    Form
    29.1%
    37.8%
    29.7%
    6,129
    3
    Form
    9.7%
    25.3%
    63.6%
    6,080
    4
    Form
    8.6%
    24%
    67%
    5,992
    5
    Form
    7.1%
    42.3%
    49.8%
    6,037
    6
    Form
    <input type="color" alpha>
    3.1%
    17.8%
    78.7%
    5,994
    7
    Form
    <input type="color" colorspace="display-p3">
    19.9%
    77.3%
    6,012

    Pengalaman

    • <span aria-hidden="true">🤓</span> Sudah pakai: Responden yang sudah pakai.
    • <span aria-hidden="true">👀</span> Pernah dengar: Responden yang sudah dengar, tetapi belum pernah pakai.
    • <span aria-hidden="true">🤷</span> Belum pernah dengar: Responden yang belum pernah dengar.

    Sentimen

    • Positif: Responden yang tertarik untuk belajar tentang sebuah teknologi; atau yang ingin menggunakannya lagi.
    • Netral: Responden yang tidak memiliki sentimen akan sebuah teknologi.
    • Negatif: Responden yang tidak tertarik untuk belajar tentang sebuah teknologi; atau yang sudah pernah pakai dan memiliki pengalaman negatif.
    “Used” average:15%
    “Positive” average:34%
    “Negative” average:5%

    Titik Sakit Form

    Styling & customization of default form control UI elements remains a big stumbling block, with nearly half of pain points being about it.

    Form validation is also a problem, especially when it comes to more advanced use cases like validating one field's value based on another.

    Apa saja titik sakit anda mengenai form HTML?
    Multiple
    Top pain point topics overall.

    View:

    Items that are not one of “limitations”
    0%
    20%
    40%
    60%
    80%
    100%
    1
    Styling & customization
    2
    2
    Form Validation
    3
    3
    <select>
    3
    4
    Browser support
    3
    5
    Pickers
    3
    6
    Accessibility
    1
    7
    <input>
    1
    8
    Form Submission
    1
    9
    10
    Missing elements
    11
    Reliance on JavaScript
    +3
    12
    13
    Cognitive overload
    3
    14
    <textarea>
    1
    15
    Autocomplete
    -11
    16
    Editing APIs
    1
    17
    Forms & JS
    1
    18
    End-user experience
    19
    Combobox element
    20
    <input type="number">
    21
    Poor design
    22
    <button>
    -15
    23
    3
    24
    Internationalization
    25
    <input type="file">
    26
    Lainnya
    0%
    20%
    40%
    60%
    80%
    100%
    % dari pertanyaan responden
    2,041
    33%
    25
    5

    Rekomendasi Sumber

    CSS-only Form Validation Hints
    Kevin Powell

    CSS-only Form Validation Hints

    A look at how we can use CSS to add contextual hints to users as they fill out a form, including creating an SVG by hand and animating it based on whether a field is valid or invalid.
    Terima kasih kepada semua Mitra yang telah mendukung Kami! Pelajari lebih lanjut.