Montando a Base do Website
Nesta lição iremos iniciar o desenvolvimento do nosso website.
Vamos começar criando a estrutura de pastas e arquivos. Utilizando o seu gerenciador de arquivos, crie uma pasta "website". Dentro desta pasta, iremos criar mais duas: "css" e "imagens", para conter os estilos do site e suas imagens, respectivamente.
A sua estrutura de pastas deve ficar como na imagem ao lado.
Dentro da pasta "website", vamos criar agora a página que será a Home do nosso website. Utilizando seu editor de texto, crie um arquivo chamado "index.html". Neste arquivo, vamos colocar o nosso código de página HTML básica. Exemplo abaixo:
<!DOCTYPE HTML>
<html lang="pt-BR">
<head>
<meta charset="UTF-8">
<title>Home - Site da Empresa</title>
<link href="css/estilos.css" rel="stylesheet">
</head>
<body>
</body>
</html>
Agora, vamos criar o arquivo CSS que irá conter todos os estilos das páginas do site.
Usando o editor de texto novamente, crie um arquivo chamado "estilos.css". Neste arquivo,
por enquanto apenas colocaremos um breve comentário CSS (iniciado com /* e terminado com */):
/*
-- Estilos CSS - Website da Empresa
*/
Com isso, a estrutura de pastas e arquivos do site deve ficar como a do exemplo ao lado.
Clique no botão abaixo para ver o arquivo "index.html" que criamos, ligado com o arquivo "estilos.css" (a href do arquivo CSS está diferente no exemplo por causa da estrutura do meu site). Não se esqueça de ver o código fonte, pois nada irá aparecer na página, já que ainda não temos conteúdo:
Por enquanto paramos por aqui. Na próxima unidade, vamos investigar mais a fundo as características da linguagem CSS e montaremos a estrutura principal da página inicial do website.