FileUploader
Examples
Anatomy
When to use
- Content Submission: Employ the
FileUploaderwhen users need to submit files as part of a form or data entry process. - Bulk File Upload: Use
FileUploaderfor scenarios where users may need to upload multiple files simultaneously. - Media Management: When managing and organizing files within an application,
FileUploaderprovides a user-friendly way to add new content.
When not to use
- Text Input Only: For situations where users only need to input text data without attaching files, consider regular text input fields.
- Single Data Point: If users are providing a single piece of data that doesn’t involve file attachments, using a simple input field may be more straightforward.
- Complex Data Structures: For highly structured data or complex form submissions, explore alternative methods to organize and capture information effectively.
Alternative Components
- Text Input Fields: When users need to provide simple text-based inputs without file attachments.
- Image Pickers: For cases specifically dealing with image selection and upload.
- Data Import Tools: When handling large datasets or complex data structures, consider tools designed for data importation.
Accessibility:
- Labeling: Clearly label the
FileUploaderto indicate its purpose, guiding users with visual impairments. - Accessible Error Messaging: Ensure that any error messages related to file uploads are clearly communicated through text and accessible to screen readers.
- Keyboard Accessibility: Make sure the
FileUploadercan be navigated and used entirely via keyboard controls. - Acceptable File Types: Clearly specify and communicate the acceptable file types and sizes to users.
- Feedback and Progress: Provide clear feedback on the status of file uploads, including progress indicators and success/error messages, making it accessible for all users.