Com o nosso design para o rodapé pronto para uso no Photoshop, podemos começar a construí-lo em nosso modelo estático de HTML e CSS. O primeiro passo é fornecer a nós mesmos algum HTML para trabalhar. Já temos uma “parte” que incluímos em todas as páginas chamada “footer.php”. Este é o lugar perfeito para incluir nossa marcação de rodapé por enquanto.
Como você pode imaginar, o rodapé é uma tag. Dentro dele, algumas listas de links. Discutimos como pode não ser ideal colocar uma lista de links em um
- marcação. Afinal, eles não são uma lista, são apenas alguns links. Depois de ler este artigo, não coloquei mais a navegação em listas.
Usamos o recurso Zen Coding no CodePen para obter um monte de links para trabalhar rapidamente. Para tentar, digite um * 8 no editor de HTML do CodePen e pressione Tab.
Terminamos escrevendo a marcação para o rodapé inferior também. Nós discutimos um pouco sobre a melhor marcação para usar lá, mas, no final das contas, basta escolher algo e seguir em frente. As coisas são fáceis de mudar na web, de qualquer maneira.