Proposta 07: re-design da página principal de um blog

Nesta proposta vais fazer o redesign da página principal de um blog da lista abaixo. Começa por escolher um blog e uma premissa. A partir daí analisa o blog escolhido e pensa como adaptar o layout e design da página principal segundo a estética sugerida pela premissa.

Lista de blogs

  1. Shifter - notícias
  2. Faz e come - culinária
  3. A pipoca mais doce - moda
  4. Por falar noutra coisa - humor
  5. Ressabiator - design
  6. Casal mistério - lifestyle

Premissas para o re-design:

  1. Desenhado como blog de um movimento radical de esquerda
  2. Desenhado como blog de videojogos
  3. Desenhado como blog de futebol
  4. Desenhado como blog de literatura
  5. Desenhado como blog de arquitetura
  6. Desenhado como blog infantil

Método

Cria uma cópia do novo estrugido-html, e, com base na página principal do blog que escolheste, começa por copiar os conteúdos para o index.html:

  • informação do cabeçalho (nome, tagline…)
  • menu
  • artigos: título, data, autor, tags, categorias, botões de partilha, texto ou excerto… tudo o que apareça no blog que escolheste
  • rodapé
  • outros conteúdos que surjam na página (link de redes sociais, lista de tags, eventuais anúncios…)

Regras

  • Reestrutura a informação, de acordo com a premissa escolhida.
  • É possível que surja necessidade de incluir elementos novos: ícones, ilustrações, informação adicional, etc. Podes fazê-lo desde que justifiques as tuas opções.
  • Não é necessário incluir a barra de topo do "sapo", nem os anúncios. Todos os outros conteúdos presente na página principal do blog escolhido devem ser mantidos.
  • Podes alterar a ordem dos elementos que surgem na página, de acordo com o que consideres ser uma melhor organização da informação.
  • Usa o teu conhecimento dos elementos HTML no processo de copiar os diferentes conteúdos: cabeçalhos, parágrafos, listas, navegação, rodapés…
  • Sempre que existir um link, podes usar um valor vazio para o “href”, por exemplo: <a href="">texto do link aqui</a>.
  • No rodapé ou final da página que vais desenhar, inclui um link para o blog original.

Objetivos

  • Adaptar a identidade do blog a uma premissa diferente da original. Explorar conceitos gráficos de acordo com a premissa escolhida, sem alterar os textos, e adaptando as imagens originais.
  • Trabalhar a hierarquia da informação: organização dos diferentes tipos de conteúdo na página – navegação, cabeçalho, artigos, rodapé, barra lateral… --; organização das partes que compõe cada artigo – título, texto ou excerto, links, tags, categorias, imagens, etc.
  • Explorar a composição tipográfica, através do uso de uma ou mais fontes, diferentes pesos da fonte, tamanho do texto, cor, etc.
  • Layout da página responsivo, feito para ser usado em ecrãs de tamanhos diferentes.

Informação prática

Coloca a proposta no servidor, numa pasta chamada “proposta-07”.
Acrescenta o link para esta proposta na tua página pessoal.

Entrega: 22 de janeiro de 2020 (quarta-feira), às 23:59.

O trabalho vai ser apresentado na aula do dia 23 de janeiro (quinta-feira).