ATIVIDADE 1 - PROGRAMAÇÃO FRONT END - 52_2025

ATIVIDADE 1 - PROGRAMAÇÃO FRONT END - 52_2025

No desenvolvimento de aplicações web modernas, o Front-End desempenha um papel fundamental na experiência do usuário. A combinação de HTML5, CSS3 e JavaScript forma a base da programação Front-End, permitindo a criação de interfaces interativas e responsivas. Essas três tecnologias essenciais trabalham juntas de maneira integrada: o HTML estrutura o conteúdo, o CSS estiliza a apresentação visual, e o JavaScript adiciona comportamento e interatividade.

Com a evolução dos dispositivos e navegadores, surgiram novos desafios e oportunidades para os desenvolvedores Front-End. Tendências como o design responsivo, interfaces minimalistas no estilo "flat design", e o foco na otimização para dispositivos móveis transformaram a maneira como as aplicações web são projetadas e implementadas. Além disso, bibliotecas e frameworks como jQuery, React, Angular e Vue.js surgiram para facilitar o desenvolvimento e melhorar a manutenção do código.

Fonte: Autor

Considerando a importância e a evolução contínua das tecnologias Front-End, você deverá:

Análise Comparativa: Escolha três websites de um mesmo segmento (e-commerce, notícias, blogs, portfólios, etc.) e realize uma análise comparativa da implementação Front-End deles. Identifique e compare:

- Estrutura de layout e organização do conteúdo

- Utilização de elementos HTML5 semânticos

- Implementação de design responsivo

- Recursos interativos implementados com JavaScript

- Performance e tempo de carregamento

Ferramentas Recomendadas: Utilize ferramentas de análise web como Google Lighthouse, PageSpeed Insights ou WebPageTest para avaliar os websites analisados e sua própria implementação.

Entrega: Submeta um arquivo ZIP contendo:

- Documento PDF com a análise comparativa e documentação técnica

- Código-fonte completo da página desenvolvida

- Capturas de tela mostrando o resultado em diferentes dispositivos

Critérios de Avaliação: Serão considerados a profundidade da análise, a qualidade técnica da implementação, a aplicação correta dos conceitos estudados na disciplina e a clareza da documentação.

Referências

NOEL, André Abdala. Programação Front End. Florianópolis, SC: Arqué, 2025. 232 p.

TOKUMOTO, Ronie Cesar. Programação Front End. Maringá-PR: Unicesumar, 2018.

MDN Web Docs. HTML: Linguagem de Marcação de Hipertexto. Disponível em: https://developer.mozilla.org/pt-BR/docs/Web/HTML. Acesso em: 12 abr. 2024.

W3Schools. CSS Tutorial. Disponível em: https://www.w3schools.com/css/. Acesso em: 12 abr. 2024.

Google Developers. Web Fundamentals. Disponível em: https://developers.google.com/web/fundamentals/. Acesso em: 12 abr. 2024.

Orientações Importantes:

- Vídeo Tutorial: Acesse o vídeo tutorial disponível na disciplina para auxiliá-lo no desenvolvimento da atividade. O link do vídeo pode ser encontrado no Studeo em Sala do Café»Dicas e Orientações. Assista atentamente para garantir que você compreenda todo o processo necessário.

- Originalidade e Referências: É imprescindível que sua atividade seja original. Qualquer indício de cópia de materiais, incluindo trabalhos de outros acadêmicos, sem as devidas referências, resultará na anulação da pontuação. Certifique-se de utilizar corretamente as normas de citação e referência exigidas pela Instituição, mesmo para o material do próprio livro da disciplina.

- Avaliação Individual: Durante o módulo, não serão realizadas revisões parciais das atividades. Não é permitido enviar trechos de sua resposta para a validação antecipada do professor, como, por exemplo, "veja se minha atividade está correta". A interpretação da atividade é parte integrante do processo avaliativo, e cabe a você verificar a adequação de suas respostas.

- Tire Suas Dúvidas: Procure sanar todas as suas dúvidas com o professor mediador em tempo hábil. Isso garantirá que você tenha a clareza necessária para cumprir a atividade de forma eficiente. Não deixe para buscar ajuda no último momento.

- Formato de Entrega: Sua resposta deve ser inserida diretamente no quadro disponível no campo da Atividade Discursiva. Não é permitido anexar documentos ou formulários. Elabore suas respostas em um editor de texto, como o Google Docs, para evitar a perda de informações, e depois cole o texto final no campo apropriado.

- Atenção ao Prazo: Fique atento ao prazo de entrega e evite enviar a atividade no último minuto. Problemas com internet, computadores ou softwares podem ocorrer, e não haverá prorrogação do prazo de entrega por esses motivos, mesmo que sejam comprovados.

Seguindo essas orientações, você garantirá uma participação eficiente e bem-sucedida na atividade.

Bons estudos!

Em caso de dúvidas, encaminhar mensagem ao seu Professor(a) Mediador(a)