Conculsão da PT04

A PT04 tinha como objetivo uma iniciação prática à programação e ao HTML. Como tal, a proposta de trabalho tinha 10 passos distintos. 

Começámos a proposta de trabalho com um pouco de história sobre o HTML e uma iniciação relativa à estrutura de uma página HTML (onde utilizámos o editor Notepad da Microsoft). 

Para avançar no trabalho, o editor escolhido parta ser utilizado foi o Notepad++, um editor de texto muito bem classificado de entre os gratuitos e que já entende múltiplas linguagens de programação.

Antes de iniciar a introdução à programação ganhámos conhecimento do que são as boas práticas associadas à programação como identar, fazer comentários, todos os ficheiros devem ter nomes curtos, sem maiúsculas, espaços e acentos, os projetos devem conter sempre a mesma estrutura de pastas, ainda que algumas fiquem vazias e as imagens devem ser redimensionadas para não excederem um máximo de 1200 pixels, de forma a não tornar a página demasiado pesada.

Após a preparação das ferramentas de trabalho, iniciei os exercícios de iniciação da W3Schools (https://www.w3schools.com/html/default.asp) colocando os códigos na pasta Drive correspondente e uma ligação para os mesmos no meu portefólio digital.

Já compreendendo melhor os elementos básicos do HTML, segui para a realização do Mini-Projeto de Planta da turma utilizando o elemento de tabela (<table>). Tive algumas dificuldades ao início, mas com a ajuda de alguns dos meus colegas consegui compreender maneiras mais fáceis de fazer o que pretendia.

Por exemplo, inicialmente tinha uma estrutura em que existia uma linha para as fotografias e os nomes ficavam numa linha diretamente abaixo, em vez de na mesma célula. O título da página foi definido através da tag <title>.

Código inicial com linhas divididas

Mais tarde passei a ter uma estrutura menos confusa, inserindo o nome e número na mesma célula da fotografia através da tag <p> (paragraph). Também utilizei o atributo align="center" para centrar tanto os nomes como as fotografias colocando o dentro de <tr> (table row)., e o atributo colspan igualando a 2, de maneira a representar uma secretária inteira ou a centrar um aluno em duas células quando este se encontra sozinho na secretária.

Para alterar a cor do texto utilizei o atributo style="color:" inserindo a referência de cada cor (retirada do color picker da W3Schools) a seguir aos dois pontos.

Código quase terminado, faltando apenas as hiperligações para a imagem de maiores dimensões.

Para adicionar a referência em cada imagem utilizei a tag <a href> colocando a localização e nome do destino da hiperligação a seguir a href e colocando a imagem entre a tag, terminando a planta da turma.

De seguida foi só carregar o projeto para o GitHub, tendo sido o passo que menos gostei pois achei bastante confuso e sem explicação suficiente relativamente ao seu objetivo.

Após ter carregado o projeto para o GitHub fiquei com o seguinte link para o site publicado: https://emiliapaulo.github.io/planta_aib/.

O que se seguia era associar o domínio do GitHub a um domínio personalizado, e para tal, utilizámos o FreeNom, tendo obtido um domínio personalizado: http://emiliapaulo.tk

Ambos os endereços foram enviados para um formulário criado pelo professor.

Quase finalizando, completei o curso de HTML da SoloLearn, uma aplicação que considerei muito prestável e que me ajudou a compreender a linguagem e a programação.

Certificado após ter completado o curso de HTML da SoloLearn

Por fim, termino a minha PT04, com esta notícia no Blog Público contendo a memória descritiva do meu trabalho. Não gostei particularmente de ter realizado este trabalho, pois tive muitas dúvidas no processo e achei que o enunciado prestado era pouco claro nalguns momentos, por exemplo, o passo do GitHub e do Mini-Projeto.