Easy selection
Offer gallery, camera and files. Use accept (MDN, n.d.-a), capture (MDN, n.d.-b), and the photo picker (Android Developers, n.d.). Show 'JPG/PDF, max 10 MB' upfront — core mobile form usability.
Progress and failure
Progress makes waits tolerable (Myers, 1985); per-file progress indicators and bar design help (Harrison et al., 2010). Support resume and retry, and compress first.
Errors and security
Use inline validation with specific messages (W3C, 2023, 3.3.1). Re-check type, content and size on the server and rename files (OWASP Foundation, n.d.). Mention EXIF location.
FAQ
- When to state limits?
- Upfront, and again right after selection.
- Is browser checking enough?
- No, validate on the server.
Sources reviewed: 2026-10-27
References
- MDN Web Docs. (n.d.-a). <input type="file">. accept and multiple attributes.
- MDN Web Docs. (n.d.-b). HTML attribute: capture. Opening the camera directly.
- OWASP Foundation. (n.d.). File upload cheat sheet. Server-side upload security.
- Android Developers. (n.d.). Photo picker. Permissionless media picking.
- Myers, B. A. (1985). The importance of percent-done progress indicators for computer-human interfaces. In Proceedings of the SIGCHI Conference on Human Factors in Computing Systems (pp. 11–17). ACM. Percent-done indicators.
- Harrison, C., Yeo, Z., & Hudson, S. E. (2010). Faster progress bars: Manipulating perceived duration with visual augmentations. In Proceedings of the SIGCHI Conference on Human Factors in Computing Systems (pp. 1545–1548). ACM. Perceived duration of bars.
- World Wide Web Consortium. (2023). Web Content Accessibility Guidelines (WCAG) 2.2. Criterion 3.3.1 error identification.
