HTML 5 e CSS3. Os alunos deverão aplicar os conhecimentos adquiridos durante o curso de Linguagem de Marcação e também buscar referências externas além do que foi discutido em sala de aula.
Desenvolver um website com tema à escolha de cada aluno, sendo obrigatório seguir a risca todas as especificações descritas a seguir:
-
Estruturar o website utilizando a linguagem de marcação HMTL 5 com tags semânticas.
-
O website deve conter ao menos 3 páginas com navegação entre elas.
-
Estilização do website com CSS3 (em um ou mais arquivos a parte): tipografia e fontes, alinhamento de decoração dos textos, imagens de fundo, espaçamentos e margens, links.
-
Maximizar a utilização de seletores na estilização com CSS: ID, class, cascata e herança, pseudo-classes e pseudo-elementos. P.S. Não é necessário utilizar todas as possibilidades, mas tire proveito do que o CSS3 pode lhes oferecer.
-
Crie ao menos duas listas no seu projeto, sendo que em uma delas o display deve ser inline-block. P.S. A renderização lado a lado pode ser utilizada com outros elementos do website, além da possibilidade de utilização de outros valores para a propriedade display.
-
Posicionar os elementos do seu website utilizando ao menos dois valores diferentes da propriedades position: fixed, relative, absolute, static.
-
Trabalhe imagens com gradientes no seu projeto, anime os elementos do seu website com transition e altere propriedades visuais dos elementos com transform.
-
Crie uma área de Contato utilizando formulários.
-
Crie um design da página seja responsivo, para garantir uma visualização confortável nos dispositivos móveis.
-
Inclua algum recursos de Serviços disponíveis na Web.
Para auxiliar no cálculo da nota final do projeto utilize esse checklist:
| Critérios (%) | Projeto 1 | Projeto 2 | ... | Projeto n |
|---|---|---|---|---|
| tags semânticas* | ||||
| propriedades | ||||
| seletores | ||||
| listas** | ||||
| positions | ||||
| gradientes | ||||
| animações | ||||
| contato | ||||
| responsividade | ||||
| recursos da Web | ||||
| Nota*** |
(*) Será exigido a utilização de no mínimo três páginas.
(**) Será exigido a utilização de no mínimo uma lista inline.
(***) A soma de todos os itens será 10,0.
Devido a maleabilidade do tema central do projeto, também foi definido que o tema não entraria no critério de avalição dessa atividade, o que de certa forma permitirá que as equipes explorem e desenvolvam suas criatividades.
Contudo, ocorrerão penalizações quando houver falta de usabilidade, de domínio do projeto e de cumprimento no prazo estipulado para apresentação e entrega do projeto. Também vale salientar que sua validade será perdida caso não seja:
- Apresentado na data marcada;
- Entregue o endereço do repositório contendo todo o código fonte e material exigido.
Os projetos declarados na disciplina são:
Equipe #1: donos-do-amanha
Membros: Márcio Roberto Fernandes Pimenta Filho - 20162370014
Equipe #2: BDVideos
Membros: William Oliveira Lima - 20162370030 Leonan S. Batista da Silva - 20162370025
Equipe #3: Oficina Experimental
Membros: Aaron Santos - 20162370007
Equipe #4: Projeto Cervejaria
Membros: André Vieira Xavier da Costa - 2016237008
Equipe #5: Steven Universe
Membros: Larissa Moreira - 20162370005
Equipe #6: ESTUDANDO MÚSICA
Membros: Eliabe Leal - 20162370035
Equipe #7: MK Doceria
Membros: Magda - 20162370015 Kamilla - ?
Equipe #8: Monitoria Fundamentos de Redes de Computadores
Membros: Jociana da Costa Dias - 20162370056
Lembrando que cada projeto deve incluir o arquivo README.md no raiz do seu projeto descrevendo:
## Descrição
## Objetivo
## Inspiração
## Protótipos
## Screenshots
Os produtos gerados a partir desse projeto são o código HTML5 e CSS3, bem como uma apresentação curta de 5 minutos. Na apresentação deve ser descrito o processo de criação da página bem como mostrar suas funcionalidades.
O projeto deverá ser entregue no último dia de aula da disciplina através de um projeto no github, e cada integrante deverá apresentar individualmente suas implementações no projeto, de tal forma que a nota final será computada seguindo as exigências do projeto.