Como fazer uma Home Page




Menu da Seção

Iniciando Formatação Inserindo Imagens Inserindo Link's Música de Fundo

Para você começar a fazer uma página na internet, você vai precisar de um bom editor de HTML.
O que eu uso é o Site Aid, mas o Front Page Express 2000 é melhor.

Site Aid 3.1http://www.siteaid.com Não esqueça de registrar. É FREEWARE!, mas solicita o registro.
Microsoft Front Page 2000 Totalmente melhor que o 98, super atualizado.


Iniciando o documento

Começando:

Todo documento deve começar <HTML> e terminar com </HTML> e ter uma área de cabeçalho <HEAD>
como o título do documento <TITLE> e uma área definida como corpo(<body>< /body>) do conteúdo do
documento. Como o exemplo a seguir:

<HTML>
<HEAD>
<TITLE>Décio's Home Page</TITLE>
</HEAD>
<BODY Background="imagem.gif" bgcolor="White" text="Black" link="Olive" vlink="Silver"
alink="Blue">

</BODY>
</HTML>


Background: será o papel de parede que você vai colocar.
Bgcolor: o a cor do fundo da tela
Text: Será a cor do texto
Link: A cor do link.
Vlink: A cor do link visitado
Alink: A cor do link ativo.

Voltar


Formatação

Para dar destaques em algumas frase existe algumas tags


<b> Texto </b> 
Coloca o texto em negrito 

<i> Texto </i> 
Coloca o texto em itálico. 

<u> Texto </u> 
Coloca o texto sublinhado 

<strong>Texto</strong>
Similar ao negrito

<TT>Texto<TT>
Deixa o texto com espaçamento regular

<sup> texto </sup>  
Coloca o texto  Sobrescrito 

<sub> Texto </sub> 
Coloca do texto  Subescrito 

<BIG> Texto </BIG> 
Aumenta a fonte

<SMALL> Texto </SMALL>
Reduz e altera a fonte

<PRE> 
         Texto 
         Texto 
         Texto.. 
</PRE> 

<center> </center> Deixa o texto ou imagem. centralizado. 

Permite que um texto seja inserido exatamente como foi digitado em algum processador de texto. 


Para mudar o tamanho da fonte você deverá usar as seguintes tags

Exemplo: 


<h1> Texto </h1>

<h2> Texto </h2>

<h3> Texto </h3>

<h4> Texto </h4>

<h5> Texto </h5>
<h6> Texto </h6>

 

Para iniciar um parágrafo você deverá usar a tags <p> </p> 

<p> Insere o texto que você quiser </p> 

Para inserir um quebra de linha você vai usar a tag <br> 

<p> Aqui <br> você poderá inserir um texto </p> 

Aqui 
você poderá inserir um texto 

Mudando as Fontes

Para você mudar a fonte de um texto ou um título, você usará a tag <font> </font> 

<font face="Nome da Font"> Texto </font> Aqui você poderá mudar o tipo de font .
<font color="Blue"> Texto </font>  Aqui você poderá mudar a cor da font 
<font size=4>Título</font> O tamanho você pode escolher a partir de 1.


Olha que efeito legal usando fontes:

DIM ENS ION AND O


Cores de fontes:

Branco: #FFFFFF
Chocolate: #5C3317
Vermelho: #FF0000
Marrom: #A62A2A
Verde: #00FF00
Bronze: #00FF00
Azul: #0000FF
Coral: #FF7F00
Magenta: #FF00FF
Ouro: #CD7F32
Ciano: #00FFFF
Pink: #BC8F8F
Amarelo: #FFFF00
Quartzo: #D9D9F3
Agua: #70DB93
Salmão: #6F4242
Preto: #000000
Ferro: #E6E8FA

Para inserir uma barra

Para inserir uma barra você deve escrever <HR>.
Você pode modificar a barra com SIZE ou WIDTH.
Támbem pode ser alinhada com align= left, center, right
Exemplos usando SIZE:

tamanho 1
tamanho 2
tamanho 3
tamanho 5
tamanho 10
tamanho 15
tamanho 25

Tamanho comum, só o <hr>

Exemplos usando WIDTH:

size=5 width=200


size=5 width=10%
size=5 width=30%
size=5 width=60%
size=5 width=90%

Usando ALIGN:

size=5 width=30% align=left


size=5 width=30% align=center
size=5 width=30% align=right
Voltar


Inserindo Imagens


    Os formatos de imagens mais usados para inserir em um documento HTML são os de formato GIF e JPG. Este são os formatos mais universalmente aceito pelos visualizadores de WWW (browsers). 

Você deverá usar a tag <IMG> 

Exemplo: 

<img src="imagem.gif"> 

Dentro da tag <img> possui as seguintes opções:  

         ALIGN       Posiciona a imagem em relação ao texto (TOP, 
                            BOTTOM, MIDDLE). 
                            Ex: <img align="MIDDLE" src="imagem.jpg"> 

         BORDER  Coloca/retira borda quando a imagem é usada como 
                            âncora (link). 
                            Ex: <img border=0 src="imagem.gif"> 

        WIDTH       Largura da imagem 
                            Ex: <img width=300 src="imagem.gif"> 

        HEIGHT      Altura da imagem 

        VSPACE   Determina o espaço vertical ao redor da imagem 

        HSPACE   Determina o espaço horizontal ao redor da imagem 
        
         ALT         Coloca um título para a imagem


Obs: A imagem deverá estar no diretório que você salvar o documento HTML. 

Voltar


Inserindo link's

O que é colocar link em uma imagem ou texto? São aquelas imagens ou texto em que você clica e te
leva a outros documentos relacionados a mesma. Para inserir um link você vai usar a tag <a href> </a>

Para inserir um link em um texto:

<a href="link.html"> Clique aqui para entrar Ver o que é Link’s </a>

Desse modo quando você clicar em "Clique aqui para entrar Ver o que é Link’s" ele vai chamar do
documento HTML "link.html". A tag </a> será usada para finalizar o link.


Para inserir um link em uma imagem:

&nbsp;=Insere um espaço.   Olha    esse  espaço. Foi usado o comando &nbsp;
Alt=Você coloca o título da imagem
Border=A imagem quando recebe link forma uma borda, sendo a partir de 0.
SRC=Nome da imagem
</a>=Significa que você terminou o link, nunca esqueça de fechar com</a>.

<a href="documento.html"><img border=0 ALT=O&nbsp;título&nbsp;da&nbsp;imagem src="imagem.gif"></a>

Desse modo quando você clicar na imagem colocada, ele chamará o "documento.html".

topo


Colocando Música na HP

Se você usar o Nestcape 3.0 ou superior poderá escutar música. Para colocar um musica em sua página
você vai usar a tag <embed>. As música deverão estar no diretório do arquivo HTML e deverão ser no
formato mid.

Ex:

<embed src="musica.mid" AUTOSTART=true VOLUME=100 LOOP="infinit">


Autostart: Quando você inicializar a página, automaticamente a música começará a tocar.
Volume: É o volume do som. Vai de 0 a 100.

Voltar

[HOME] DÚVIDAS ? [E-MAIL]