azul

Como funciona a Internet

Introdução ao HTML

Organização

A organização é tudo para o HTML. Ele é uma linguagem de hipertexto e de marcação que trabalha o tempo todo com referências. Tanto para fazer os links como para exibir as imagens.

Portanto é fundamental que você tenho tudo bem organizado para poder criar páginas em html que não exibirão furos ou links quebrados - o maior pecado de uma página!

Minha sugestão é que você crie uma pasta "html4blog" dentro da sua pasta "meus documentos" para salvar todos os nossos arquivos htm. Aproveite para criar dentro desta nova pasta uma pasta "figuras" para você salvar as imagens que utilizará.

organiza

Lembre-se! Nunca use em sua página imagens simplesmente "copiadas e coladas". O HTML precisa de um local para ir buscar a imagem a ser exibida. Portanto salve sua imagem na pasta figuras e utilize-a como referência.

As páginas serão enviadas a um servidor, nosso provedor de hospedagem, por isso precisamos tomar um cuidado especial com o nome dos arquivos das páginas. Cada servidor funciona de uma forma diferente e para nós não ficarmos perdidos nesta história há um padrão muito difundido entre os desenvolvedores que é assim:
. nomes apenas com minúsculas
. sem acento ou qualquer outro caractere especial
. sem espaço
. e que não comece com número
...ex: minha primeira página.html - errado
.........minha_primeira_pagina.html - certo

No nosso caso, blogueiros que somos, devemos tomar mais cuidado ainda! As tags de HTML funcionam tanto dentro do "post" quanto dentro do "template". Você pode copiar e colar os códigos mas as imagens você deve enviar para o servidor e verificar no seu seu blog como ele funciona.
Por exemplo, no blogger (www.blogger.com) você trabalha com o endereço do seu blog completo mais o nome da imagem que você enviou. Já no weblogger (www.weblogger.com.br) você trabalha com o endereço completo do seu blog mais a pasta "img".
Portanto o logotipo do html4blog colocado no Blogger fica:
<img src="http://www.html4blog.blogger.com.br/html4blog.jpg">
Já no Weblogger fica:
<img src="http://html4blog.weblogger.com.br/img/html4blog.jpg">
Vale para o post, vale para o template!

Fim