Oi, tudo bem .br



Oi, tudo bem?

Como dizia o Chacrinha, "nada se cria, tudo se copia..."

Vamos iniciar o aprendizado de html copiando uma página, OK?

Por favor leia as instruções até o fim! Ou volte para cá sempre que precisar, clicando o botão "back" do seu navegador

(Browser)!

1. Ilumine (highlight) o campo da URL (Location), no Browser, delete o que estiver lá e digite (ou copie/cole) o seguinte

endereço, clicando "ENTER" em seguida:

lbcd.icb.ufmg.br/exemplo.html

Você deverá ser capaz de visualizar nossa página modelo.

2. Feito isso, clique o botão "view " do Browser e selecione o comando Page Source". "Select all" usando o comando "ctrl a",

copie tudo usando o comando "ctrl c"

Você acaba de copiar todas as informações para fazer uma página análoga!

3. Abra uma página nova no programa Word e cole tudo usando o comando "ctrl v" ou o comando paste da opção Editar do

Browser. Salve este arquivo com seu nome usando a opção somente texto com quebra de linhas.

Passe para o passo 2

Como está indo?

Atenção: Este seu arquivo é um arquivo texto, com informações na linguagem html.

Sempre que editar essa página, certifique-se que ela seja salva como "somente texto com quebra de linhas!

Ih, salvei inadvertidamente como html. Pronto! Destruiu sua página.. Só tem um jeito: abrir dentro do Browser e salvar como

texto. Você ainda pode ter que fazer isso, um dia...

Vamos agora aprender a ler e escrever html para alterar as informações da nossa página modelo, por aquelas que vocês

desejarem

Passe para o passo 3

Esquisito esse tal de html?

Repare que tudo que , em algum lugar...

O mais legal do html, é que "parágrafos" não aparecem no Browser, por isso podemos dividir ou organizar as informações em

diferentes blocos, sacou?

Observe o primeiro bloco:

Este comando serve para abrir a página de html, que só vai ser fechada no final da página com o comando: .

Vamos alterar as informações do segundo bloco, que aparece assim:

Titulo da pagina, aparece na janela do browser

Troque o texto [Titulo da pagina...do browser] por [Home Page Fulano de Tal (seu primeiro nome)] e salve o arquivo como

TEXTO!

Vamos para o passo 4?

Como usar a acentuação, já precisou?

Aqui vão as primeiras dicas:

Mané, fica assim: Mané

Conceição, fica Conceição

Reclama não! Faça assim:

Escreva a palavra sem acento ou cedilha. Substitua a letra a acentuar por:

[&][letra a modificar][tipo de modificação][;]

Primeira atividade: construir uma tabelinha contendo todos os acentos possíveis e sua correspondência em html. Como?

Você escreve, em um arquivo de Word, a lista contendo todos as letras acentuadas. Salva o arquivo como html e abre com o

WordPad. Compare seus resultados com os de outros grupos.

Agora o passo 5

Oba, vai ter foto!

O grupo de comandos seguinte serve para adicionar uma imagem.

Substitua "meu diretorio/minha foto.gif" pela designação de um diretório onde você vai guardar dados pessoais e "minha

foto.gif" por seunome.gif. Exemplo:

dadosvania/vania.gif

Alternativamente, guarde todas as imagens num único diretório. Exemplo:

imagens/vania.gif

1. Toda vez que você quiser especificar um diretório abaixo do lugar onde sua página está, você especifica com o nome dele,

"/", e o nome do arquivo a ser aberto, OK?

2. Para especificar um diretório acima do da página, escreva assim:

../images/dna1.gif

3. Se a imagem estiver no mesmo iretório da página, substitua tudo por "dna1.gif", apenas. Também alternativamente, você

pode salvar qualquer imagem da internet, clicando o botão DIREITO do mouse e salvando como dna1.gif, por exemplo.

Vamos adiante: passo 6!

Falta pouco!

As linhas seguintes apresentam o sítio. Substitua as duas mensagens iniciais com alguma informação que desejar. No caso da

página de hoje, pode ser:

Fulano's HomePage

Obrigado por visitar minha página www!

Note algumas coisas:

Reparou que o número junto de H é inversamente proporcional ao tamanho da letra?

Repare também que, antes mesmo do comando que "fecha" o tamanho da letra, , aparece o comando para linha de

separação,

A seguir, aparecem os comandos para gerar uma lista de conteúdos: passo 7.

Você faz sua lista de conteúdo!

Como sugestão, vamos colocar 3 possibilidades:

1. Substituir o que vem depois da primeira "bolinha", comandada por , por:

Dados pessoais.

Explicação: A palavra Dados vai aparecer em preto; o espaço depois dela, antes de é importante; a

palavra pessoais aparece em azul, como um link; os comandos entre abrem e fecham a instrução de linkar; o ponto final

aparece em preto; manda pular uma linha.

Mais tarde, você compõe seu CV no programa Word, e salva como arquivo html com o nome de "dados.html" no mesmo

diretório da sua página, ou então, na linha de comando, especifica se o diretório está acima ou abaixo, tá?

2. Mais uma sugestão (para navegar prá fora):

Como fazer uma página como esta.

Veja que o comando de abertura ................
................

In order to avoid copyright disputes, this page is only a partial summary.

Google Online Preview   Download