The accept attribute is a small instruction attached to an HTML element. Its job is to file picker filtering; not server-side file security. It is easier to remember when you can see it in a real piece of markup.
What accept is used for
File picker filtering; not server-side file security. The attribute appears inside an element’s opening tag. Depending on its definition, it may take a specific string, a number, an enumerated keyword, or be a boolean attribute.
The example below uses it in a file context. Other elements may support it too, or may give the same attribute a different meaning.
Example you can try
<form action="/upload" method="post" enctype="multipart/form-data">
<label for="attachment">Attach a file</label>
<input id="attachment" name="attachment" type="file" accept="image/png,image/jpeg">
<button type="submit">Upload</button>
</form>
How the example works
Look for accept in the snippet. Here the example shows the value image/png,image/jpeg. This is a concrete input the browser can interpret; it is not just text shown to the reader.
A visitor may still select or upload a different file. The server must inspect the real file type, size, and contents.
Values and important behavior
.jpg,.png filters by extension; image/png filters by MIME type; image/* suggests image files.
This detail matters most when the page receives user input, navigates to another document, or loads an external resource. In those cases, check the browser behavior and any server-side requirements separately.
Small practice task
Copy the code and change accept to another sensible value, or remove it entirely if it is optional. Test the difference in the browser and inspect any submitted value or network request.
Common Beginner Mistakes
- A visitor may still select or upload a different file. The server must inspect the real file type, size, and contents.
- Using
accepton an element that does not support it. - Believing that an HTML hint or client-side check replaces real server validation or a security policy.
Key Takeaways
acceptis used to file picker filtering; not server-side file security.- A visitor may still select or upload a different file. The server must inspect the real file type, size, and contents.
- Choose valid values and test the result instead of guessing what the browser will do.