Podemos já com estes conhecimentos, e mais algum outro, criar nossa primeira página. Para isso, abra seu editor de textos e, copie e cole o seguinte texto em um novo documento:
<html>
<head>
<title>Cozinha Para Todos</title>
</head>
<body>
<p><b>Bem-vindo,</b></p>
<p>Você está na página<b>Comida para todos</b>.</p>
<p>Aqui você aprenderá receitas fáceis e deliciosas.</p>
</body>
</html>
Agora salve este arquivo com extensão .html ou .htm em seu disco rígido. Para isso, acessamos no menu "Arquivo" e selecionamos a opção "Salvar como". Na janela escolhemos o diretório onde desejamos salvá-lo e colocaremos um nome para ele, como por exemplo: minha_página.html.
Conselho: Utilize nomes em seus arquivos que tenham algumas normas básicas para poupar alguma confusão ou desgosto.
Nosso conselho é que não utilize acentos, nem espaços, nem outros caracteres raros. Também lhe ajudará escrever sempre as letras em minúsculas.
Isto não quer dizer que se deve fazer nomes de arquivos curtos, é melhor fazê-los descritivos para que se possa lembrar o que há dentro. Algum caractere como o traço "-" ou o traço baixo "_" lhe pode ajudar a separar as palavras. Por exemplo: quem_somos.html |
Com o documento HTML criado, podemos ver o resultado obtido através de um navegador. Chegado a este ponto, é conveniente, insistir no fato de que nem todos os navegadores são idênticos. Infelizmente, os resultados de nosso código podem mudar de um para outro, sendo por isso aconselhável visualizar a página em vários navegadores. Geralmente usam-se Internet Explorer e Netscape como referências já que são os mais extensos.
Na verdade, no momento em que estas linhas são escritas, o Internet Explorer monopoliza a maioria imensa de usuários (mais ou menos 90%) e o Netscape está relegado a um segundo plano. Isto não quer dizer que devemos deixá-lo de lado já que o 10% de visitas que este pode nos proporcionar, pode resultar muito importante para nós. Por outro lado, parece que já se tornou pública a intenção do Netscape de desviar um pouco seus negócios para outros rumos e abandonar esta chamada "luta de navegadores" na qual estava recebendo a pior parte.
Então, voltando ao tema, uma vez criado o arquivo .html ou .htm, podemos visualizar o resultado de nosso trabalho abrindo a página criada com um navegador. Para isso, dependendo do navegador a forma de fazer será diferente.
Se estamos usando o Explorer, temos de ir à barra de menu, selecionar "Arquivo" e em seguida "Abrir". Uma janela irá se abrir. Clicamos sobre o botão "Examinar" e acessamos uma janela a partir da qual poderemos nos mover pelo interior do nosso disco rígido até encontrar o arquivo que desejamos abrir.
A coisa não é mais difícil com o Netscape. Neste caso, temos de ir também à barra de menu principal e selecionarmos File e logo, Open File. A mesma janela de busca nos permitirá examinar o conteúdo de nosso PC até dar com o arquivo procurado.
| Nota: Também se pode abrir o arquivo acessando o diretório onde ele está salvo. Nele se pode encontrar seu arquivo HTML e ver que possui como ícone o logotipo de Netscape ou o do Internet Explorer. Para abrí-lo simplesmente fazemos um clique duplo sobre ele. |
Uma vez aberto o arquivo, já poderá ver sua primeira página web. Algo simples mas que já é um começo. E que em pouco tempo, já verá como será capaz de melhorar sensivelmente.
Observe a parte superior esquerda da janela do navegador e poderá comprovar a presença do texto delimitado pela etiqueta <title>. Esta é uma das funções desta etiqueta, cujo principal incubência é o de servir de referência nos motores de busca como
Altavista ou
Yahoo.
Por outro lado, os elementos que colocamos entre a etiqueta <body> e </body> se podem ver no espaço reservado para o corpo da página.
Podemos ver
a página do exemplo em funcionamento aqui.
Se agora dermos um clique no botão direito do mouse sobre a página e selecionarmos "Ver código fonte" (ou View page source), veremos como que numa janela acessória aparece o código de nossa página. Este recurso é de extrema importância já que nos permite ver o tipo de técnicas empregadas por outros para a confecção de suas páginas.
Com tudo isso assimilado já estamos em condições de aprofundarmos um pouco mais na descrição de algumas das etiquetas mais usadas do HTML.
Possível problema: Ao utilizar o Bloco de Notas no Windows em algumas ocasiões, mesmo lhe dizendo que é um arquivo .html, o documento se salva como se fosse um texto e não uma página web. O que está acontecendo é que o Bloco de Notas tem pré-determinado salvar seus arquivos com extensão .txt e por isso, na realidade o que ele está salvando no disco rígido é minha_pagina.html.txt.
Para conseguir ter o controle das extensões no Bloco de Notas e no Windows em geral podemos acessar ao "Meu computador" e no menu de "Ver", selecionar "Opções de pasta". Na janela que aparece clicamos na opção "Ver" e nos permite desabilitar uma caixa de seleção que põe como "Ocultar extensões para os tipo de arquivos conhecidos". (assim se faz no Win98, mas pode variar um pouco em outras versões do Windows)
Com isso conseguiremos ver sempre a extensão do arquivo com o qual estamos trabalhando e fazer com que o Bloco de Notas atenda o que estamos lhe solicitando quando gravamos com outra extensão que não seja .txt. |
Comentários do artigo
Não consigo colocar a minha página web como um endereço de site normal, ela só se abre pelo computador que eu salvei, quero saber como ela pode ser acessada por outras pessoas.A página abre desde a unidade de disco rígido.Responda urgente , por favor, aprendi muita coisa nesse site.
muito facill, legall, muito bem esplicadoo, vale apena conferir
muito simples pra entender , como já foi dito Flavia ... pelo Bloco de notas é melhor de trabalha dq o word e pelo que eu testei naum ocerre os memos poblemas !
Dando uma mãozinha
Por: Patrícia Machado | | 06/1/09
|
David, se não está abrindo ao você salvar no bloco de notas é pq está salvando em txt, você deve salvar em formato .html
E para àqueles que ainda estão com problemas com caracteres substitua (na verdade escreva o complemento) da tag <html> por <html xmlns="http://www.w3.org/1999/xhtml" lang="pt" xml:lang="pt">
Assim você estará dizendo que está no padrão w3c e que a linguagem é em português, por isso tem acentos eblablabla... Assim não terá risco de ser recusada pelo browser.
Só lembrando a alguns que ainda estão começando que para colocar a página para q outros vejam) vc precisa hospedá-la em um servidor online. Existem servidores grátis, os quais são mto úteis para qem está aprendendo ou só brincando.
 | Bloco de Notas do windows
Por: neguinha
| 14/5/09 |
Estou fazendo os exercícios pelo bloco de notas do windows e o meu navegador é Internet Explorer. Para driblar o problema do arquivo ficar em extensão .txt, faço da seguinte maneira: Vou no Arquivo + Salvar Como + Nome Escolhido.htm ou .html, escolho a pasta e salvo.
Em seguida, vou em Arquivo + Abrir, encontro o arquivo, porém antes de selecionar a opção abrir, mudo na barra "arquivos do tipo" abaixo para a opção "Todos os arquivos", nesse momento aparecerá entre os outros ítens da lista, o arquivo procurado com o logo do Internet Explorer, clico sobre ele com o botão direito do mouse, seleciono "abrir com" + "Internet Explorer", então ele aparece na visualização do navegador sem maiores problemas.
| Apostilas
Por: mari_rosa_19
| 11/8/09 |
Essas apostilas são muito boas, simples de entender mas muito completas, eu e o meu filho estamos aprendendo com muita facilidade. Mesmo não tendo programado nada antes.
