Releitura do website de exames do IFAL
Acesse a releitura usando o link: https://ifal.vercel.app.
A proposta desta releitura é concertar e/ou melhorar falhas no website original, além de modernizar e usar tecnologias mais recentes - mantendo a essência da versão original e suas principais funcionalidades.
Lembrete: os testes a seguir foram feitos na página principal de ambos os websites: ifal.vercel.app/exames/andamento e exame.ifal.edu.br/publico/exames/emandamento.
A releitura ainda não está finalizada, mas com o estado atual já é possível perceber grandes melhorias na performance do site. As métricas levadas em consideração são definidas pelo Web Vitals. Para saber mais, veja o que é web vitals.
Testes feitos pela ferramenta do web.dev, realizados 3 vezes cada:
Web Vitals da releitura (ifal.vercel.app):
Web Vitals do website original (exame.ifal.edu.br):
Testes feitos pelo webpagetest.org, usando o servidor 'Sao Paulo - EC2' e o Chrome como navegador.
Performance da releitura (ifal.vercel.app):
Performance do website original (exame.ifal.edu.br):
Quando um site vai para o ar, é muito importante previnir que ele exponha seus usuários, ou até a própria empresa por trás do projeto. Para ajudar com a segurança o website deve aplicar headers que não permitem ações maliciosas. Foi notado que o website original não possui tais headers, então implementei na releitura.
Testes feitos pelo webpagetest.org, usando o servidor 'Sao Paulo - EC2' e o Chrome como navegador.
Segurança da releitura (ifal.vercel.app):
Segurança do website original (exame.ifal.edu.br):
Como já mostrado nos testes do Web Vitals, a releitura possui um nível de acessibilidade muito maior que o website original. Além da acessibilidade servida na página em sí, a releitura fornece 3 línguas que podem ser escolhidas pelo usuário: pt-br (Português do Brasil), en (Inglês) e es (Espanhol). Desta forma, o alcance da releitura é expandido.
A releitura implementa novas funcionalidades que não existem, no presente momento, na versão original. É possível listar algumas:
- Pesquisa de exames (por nome, campi, ofertas, etc);
- Visualização de PDF dentro do site (encontrado em "Documento(s)" de cada exame);
- Informa a previsão de início de um exame futuro (se disponível);
- Pesquisa instantânea de perguntas frequentes, junto com paginação delas;
- Estado, cidade, logradouro e bairro são inseridos automaticamente após a inserção do CEP no registro;
- Dados sensíveis do usuário são criptografados no banco de dados (CPF, CEP e outros);
- Tradução completa do site em 3 línguas (pt-BR, en, es);
- Controle do usuário perante os logins feitos em sua conta (encontrado em "Conexões" na aba "Sua conta").
Além dos itens listados, outros estão em desenvolvimento.
Para este projeto, escolhi o Remix como framework. O Remix é um framework novo no mercado, porém oference muitas melhorias e otimizações para o site, entre elas o SSR (Server-Side Rendering), o que vai garantir muitas melhoras ao website. E claro, o Remix usa o React.js.
O website está disponível como PWA (Progressive Web App), e pode ser instalado em seu computador e celular.
Todas as libs usadas estão disponíveis aqui.
Feito no Figma, confira aqui.
Decidi preservar as cores originais do IFAL, com apenas algumas adicionais para complementar e combinar com a proposta desta releitura.
O objetivo principal é tornar a página mais moderna e facilitar seu uso, tanto para os que dependem da acessibilidade, quanto para os usuários comuns.
Para as bordas, escolhi 1.5px, deixando-as pouco arredondadas e com uma seriedade, passando confiança ao usuário.
Para a fonte, escolhi a Inter. Não é muito diferente da fonte original da página, mas tem um ar mais moderno e passa a mesma seriedade que a original.
Para as cores adicionais, escolhi uma paleta pastel, que é mais confortável para os olhos e quebra um pouco o estilo das cores originais do IFAL.
O projeto está protegido pela licensa MIT, mas é válido lembrar que foi inspirado e usa os nomes e logotipos do Instituto Federal de Alagoas. O website original foi criado pela Diretoria de Tecnologia da Informação do IFAL e não é open-source.