Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/jairo51067/accessible-form-ui
Este proyecto consiste en un formulario diseñado para actualizar un perfil de usuario, centrado en la accesibilidad y la experiencia de usuario. Implementa validaciones en tiempo real, un sistema gráfico de progreso interactivo con SVG y un diseño moderno optimizado para navegadores actuales.
https://github.com/jairo51067/accessible-form-ui
css3 html5 javascript semantic-web svg-animations
Last synced: about 1 month ago
JSON representation
Este proyecto consiste en un formulario diseñado para actualizar un perfil de usuario, centrado en la accesibilidad y la experiencia de usuario. Implementa validaciones en tiempo real, un sistema gráfico de progreso interactivo con SVG y un diseño moderno optimizado para navegadores actuales.
- Host: GitHub
- URL: https://github.com/jairo51067/accessible-form-ui
- Owner: jairo51067
- Created: 2024-09-27T18:00:44.000Z (4 months ago)
- Default Branch: main
- Last Pushed: 2024-11-19T15:30:17.000Z (about 2 months ago)
- Last Synced: 2024-11-19T15:39:53.707Z (about 2 months ago)
- Topics: css3, html5, javascript, semantic-web, svg-animations
- Language: CSS
- Homepage: https://jairo51067.github.io/Accessible-Form-UI/
- Size: 10.7 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# "Formulario accesible para actualizar perfil con interfaz moderna"
Este proyecto consiste en un formulario diseñado para actualizar un perfil de usuario, centrado en la accesibilidad y la experiencia de usuario. Implementa validaciones en tiempo real, un sistema gráfico de progreso interactivo con SVG y un diseño moderno optimizado para navegadores actuales. Durante el desarrollo, se abordaron desafíos como la optimización para accesibilidad (atributos aria), el uso de tecnologías modernas para gráficos dinámicos y la gestión de estados en formularios complejos. Este proyecto muestra habilidad para combinar diseño funcional con prácticas modernas de desarrollo web.# Formulario Accesible - Actualizar Perfil
[Enlace al proyecto](https://jairo51067.github.io/Accessible-Form-UI/)Imagen del proyecto
![Formulario Accesible](https://github.com/user-attachments/assets/616371fd-09e2-47ee-8c95-171c02c82d15)## Descripción
Este formulario permite a los usuarios actualizar su información de perfil de manera accesible y eficiente. Su propósito principal es demostrar cómo integrar buenas prácticas de accesibilidad, validación y diseño moderno en un formulario de uso cotidiano. Este proyecto fue inspirado por la necesidad de formularios más inclusivos y visualmente atractivos.## Características
- **Accesibilidad mejorada**: Uso de etiquetas semánticas y atributos `aria` para navegación asistida.
- **Validación dinámica**: Revisión de datos en tiempo real con mensajes de guía para el usuario.
- **Visualización de progreso**: Gráficos SVG interactivos que reflejan el estado de avance del usuario.
- **Gestión de contraseñas**: Opciones para mostrar/ocultar contraseñas con un solo clic.## Tecnologías Utilizadas
- **HTML5**: Organización semántica del contenido.
- **CSS3**: Diseño responsivo con Flexbox y animaciones básicas para gráficos.
- **JavaScript**: Implementación de validaciones dinámicas y control de estado de los elementos interactivos.
- **SVG**: Creación de gráficos circulares para representar el progreso.## Instalación
1. Clona el repositorio:
```bash
git clone https://github.com/jairo51067/actualizar-perfil.git
```
2. Abre el archivo `index.html` en tu navegador para ver el proyecto.## Cómo Contribuir
Si deseas contribuir, sigue estos pasos:
1. Haz un fork del repositorio.
2. Crea una nueva rama:
```bash
git checkout -b nueva-rama
```
3. Realiza tus cambios y súbelos:
```bash
git commit -m "Descripción de los cambios"
git push origin nueva-rama
```
4. Envía un pull request.¡Tu contribución es bienvenida!
## Licencia
Distribuido bajo la licencia MIT.## Autor
Proyecto desarrollado por **Jairo Cárdenas**.
- Correo electrónico: [[email protected]](mailto:[email protected])
- GitHub: [@jairo51067](https://github.com/jairo51067)https://roadmap.sh/projects/accessible-form-ui