Criando um formulário de inscrição acessível

O curso Criando um formulário de inscrição acessível é um projeto prático de frontend para quem conhece os fundamentos de formulários HTML, CSS e JavaScript. Você criará uma página de inscrição para um pequeno ateliê de artesanato, onde os visitantes poderão escolher uma sessão, preencher o formulário pelo teclado e receber uma confirmação de um servidor real.

Os laboratórios guiados começam com o uso de um exemplo funcional pelo teclado e depois desenvolvem o layout, as mensagens de estado e o envio assíncrono do formulário. Um desafio independente aplica as mesmas técnicas a outras sessões e relações entre campos. Cada laboratório começa com seus próprios arquivos e dados preparados.

O que você aprenderá

Ao concluir o curso, você poderá:

• associar rótulos visíveis, instruções, restrições de entrada e mensagens de erro para que os visitantes saibam o que preencher e como corrigir um problema;
• criar um formulário responsivo com ordem de leitura clara, foco de teclado visível e mensagens que não dependam apenas da cor;
• enviar dados com fetch e async/await, mostrar quando uma solicitação está aguardando resposta e evitar repetir a ação de envio durante a espera;
• mostrar um ID de confirmação emitido pelo servidor somente após a inscrição ser aceita e distinguir entre rejeição de um campo, uma sessão sem vagas e uma falha temporária do serviço;
• preservar as informações preenchidas após uma recusa ou falha, recuperar-se da falha temporária ensinada e manter intactas as inscrições existentes.

Para quem é este curso

Este curso é indicado para quem está pronto para combinar exercícios web individuais em uma experiência completa de inscrição em oficinas.

Pré-requisitos: Fundamentos de formulários HTML e layout com CSS, além de objetos, funções e eventos de JavaScript. Você também deve conhecer a seleção básica de elementos do DOM. Você deve saber abrir e salvar arquivos do projeto. Os laboratórios guiados apresentam a semântica dos formulários, a validação, o código assíncrono, as respostas HTTP e o tratamento de estados necessários antes do desafio. Não é necessário conhecer React.

Ambiente de aprendizagem: A LabEx fornece um ambiente de programação preparado no navegador, uma prévia da página e uma API e um banco de dados locais funcionais. As identidades e os dados de contato usados nos exercícios são sintéticos. Você edita o frontend; os rótulos do site e a saída de execução permanecem em inglês.

Perguntas frequentes

Vou escrever código?

Sim. Você completa HTML, CSS e JavaScript em um projeto preparado e depois usa o formulário por meio de interações reais no navegador, incluindo preenchimento pelo teclado, envio, recusa e recuperação após falha.

Vou criar o backend ou seus controles de segurança?

Não. A API e o banco de dados são fornecidos. Você faz com que o frontend reflita o que o servidor realmente aceitou. A validação do navegador e um botão de envio desativado não implementam a segurança do backend nem garantem o tratamento seguro de solicitações simultâneas em produção.

Concluir o curso certifica a acessibilidade?

Não. Você pratica comportamentos específicos de rotulagem, teclado, foco e feedback. Uma avaliação completa de acessibilidade abrange mais do que estes exercícios.