Fórum WebTuga

Tutorial De Html Para iniciantes!!!

Toda página na internet tem que comesar e terminar, obrigatoriamente, assim:


<html> = Marca o ínicio da página
<head> = ínicio do cabeçalho
<title> titulo da página </title> = Título da página
</head> = fecha cabeçalho
<body> = ínicio de conteudo da página
</body> = fecha o conteúdo da página
</html> = Marca o fim da página

Colocando Contador:
Para colocar um contador da Geocities na sua página da internet é muito fácil, basta você clicar em "Count", correspondente a página em que você gostaria de colocar o contador e selecionar o tipo de formato do contador que você quer, você encontrará 20 tipos de contadores. Em seguida basta escrever na sua página a seguinte TAG, "não esqueça de retirar o *":
[img]http://visit.geocities.com/counter.gif\\"]
Ou se você preferir basta ir a http://geocities.yahoo.com/members/tools/counter.html (http://geocities.yahoo.com/members/tools/counter.html), e depois colocar em sua página o segunte comando [img]/cgi-bin/conter.gif\\"].

Enviando E-Mails:
Para fazer com que as pessoas abra um janela para enviar e-mails, ao clicar sobre o sue e-mail, nome ou uma palavra qualquer, basta inserir o comando:
<a href="mailto:nome@empresa.com.br

Linhas:

--------------------------------------------------------------------------------

Para inserir uma linha como esta acima, escreva o comando

---

Para inserir linhas mais incrementadas utilize os seguintes Tag\\'s:

---

, veja a linha abaixo:

--------------------------------------------------------------------------------

Onde size é a largura da linha que pode variar de 1 à 10, align determina sua posição que pode ser left(esqueda), right(direita) e center(centro), noshade escurece a linha e widht determina o comprimento da linha na página que pode variar de 1% a 100%.

Cores:
As cores de sua Home Page e também as de fundo, letra, links, vlinks e alinks, são indicados dentro da Tag <body>, onde deve-se inserir por exemplo:
<body>

Onde o código das cores são:
#FFFFFF #DDDDDD #999999 #666666 #333333 #000000 #006666 #009999
#00CCCC #66FFFF #99CCFF #00CCFF #0099FF #0033CC #000099 #000066
#660066 #990099 #CC00CC #FF66FF #FFCCFF #FFCCCC #FF6666 #FF0000
#990000 #666600 #999900 #CC9900 #FF9900 #FFCC00 #FFFF00 #FFFF99
#CCFFCC #99FF99 #66FF66 #00FF00 #00CC00 #009900 #006600 #003300

Exemplos FFFFFF = Writhe (Branco) FFFF66 = Yellow (Amarelo)
FF0000 = Red (Vermelho) CC9999 = Gray (Cinza)


Hyperlinks:
Hyperlinks são palavras ou textos que dão acesso a outras páginas em outros endereços da Internet,
Para inserir um hyperlinks de deslocamento para uma outra página da internet, basta colocar o seguinte código:
 
Quando clicado, o hyperlink abrirá a página destino na mesma janela do links clicado, para fazer o hyperlink abrir em um outra janela basta fazer o seguinte
Como target segnifica que será redirecionado para um alvo determinado, já que não existe tal alvo xxx na sua página ele abrirá uma nova janela.

Backgrounds:
Para inserir um papel de parede ou backgrounds em sua página, basta acresentar dentro da Tag <body> o seguinte complemento:
<body>
<body>
Arquivos GIF\\'s animados ou arquivos "jpg", também podem ser utilizados como papel de parede

Letras:
As letras podem ter seis tamanos diferentes, a h1(maior) ao h6(menor). Para determinar o seu tamanho insira a Tag:
<h3>palavra</h3>
Exemplos:
h1h2h3h4h5h6

Fontes:
Usando as fontes você poderá mudar as cores de um texto, aumentar ou diminuir sue tamanho e mudar o estilo de fonte, basta inserir o seguinte comando:
<font>TEXTO</font> -- Muda a cor da fonte.
<font>TEXTO</font> -- Muda o tamanho da fonte. Onde # é um número de 1 à 6.
<font>TEXTO</font> -- Muda o estilo da fonte.
...
Exemplo: <font>Exemplo! </font>
tb existe tags
<big></big> <small></small>


Frames:
Os frames dividem a tela do browser em duas ou mais partes, cada parte é uma página HTML chamada de frameset. Os frames são geralmente usados para que um frameset permaneça enquanto outros mudem, baseados nos links que o usuário seleciona.

Principais Tags
<frameset><frameset> - Determina o início e o fim de um frame. Deve ser usado juntamente com os parâmentros cols (frame na vertical) ou rows (frame na horizontal).
cols="valor,valor" - Determina o número de regiões verticais da página. Deve ser indicado juntamente com uma lista de valores. Cada valor especifica a largura de cada frameset e pode ser definido em pixels, percentual ou asterisco.
rows="valor,valor" - Determina o número de regiões horizontais da página. Deve ser indicado juntamente com uma lista de valores. Cada valor especifica a largura de cada frameset e pode ser definido em pixels, percentual ou asterisco.
border = "valor" - Determina a espessura da linha divisória que aparece entre os framesets. Sendo que x é o valor da borda em pixels.
bordercolor = "cor" - Determina a cor da linha divisória que aparece entre os framesets

Atributos <frame>
src = "página.htm" - Determina a página ou arquivo que será carregado na região correspondente.
name = "nome" - Determina um nome ao frameset correspondente. O nome é de vital importância na utilização dos frames.
noresize - Deixa a linha do frameset estática.
marginheight = "valor" - Determina a largura em pixels da margem vertical.
marginwidth = "valor" - Determina a largura em pixels da margem horizontal.
scrolling = "valor" - Determina o aparecimento ou não da barra rolagem. Os valores podem ser yes (com barra de rolagem), no (sem barra de rolagem) ou auto (barra de rolagem só aparecerá quando o conteúdo da página ultrapassar o tamanho do frameset.

Importante
Para abrir uma página em frameset diferentes, você deve especificar o nome do frameset no link.
Ex:

Form:
Através de um formulário(Form), é possível interação com o servidor, javascript, etc.
<form></form> - Determina o início e o fim de um formulário.
<input> - O tag <input> especifica vários campos dentro de um formulário. Ele pode receber diversos atributos que definem o tipo de campo (botão, caixa de texto, etc). O atributo mais importante do input é o name, ele associa o valor da entrada no elemento. Quando receber os dados processados irá aparecer name = resposta dada pelo usuário.

Caixa de Texto
<input> - Caixa de texto simples.


Password
<input> - Esconde a informação digitada.


Mudando a barra de rolagem!

[STYLE type=\\"text/css\\"]
<BODY>
[/STYLE]
---------------


Mudando Links!

[style]
a{
color: SUA COR;
text-decoration: none;
}
a:hover{
color: SUA COR;
text-decoration: underline;
}
[/style]

[style]
a{
color: SUA COR;
text-decoration: underline;
}
a:hover{
color: SUA COR;
text-decoration: none;
}
[/style]

[style]
a{
color: SUA COR;
text-decoration: none;
}
a:hover{
color: SUA COR;
text-decoration: none;
}
[/style]

tb assim


Exemplo:</font>


Pop ups

<script>
function janela(aa){
open(aa,\\'\\',"width=400,height=400,toolbar=no,scroll=no,status=no");
}
</script>

Onde está escrito endereço da pagina é onde vc coloca o endereço da pagina que vai abrir a pop-up.

Vc escolhe se vai ter barra de ferramnetas ou não, é onde esta escrito toolbar, é só colocar yes, ou no.Em todos é só colocar yes pra sim e no pra não.

Location é a barra de endereço.

Directories, é a a lista de diretorios.

Status é a barra de status.

Menubar é a barra de botões.

Scrollbars são as barras de rolagem.

Resizable, é se pode ser maximinizada.

Width é a largura da janela.

Height é a altura.

Coloque a descrição do link onde está escrito"descrição do link aqui".



H4CK3R

Na minha opinião o Front Page é um dos melhores para quem qer iniciar em html.
Tambem tem boas ferramentas para construir tabelas.

 	 	 	 	 
 	 	 	 	 
 	 	 	 	 
 	 	 	 	 

É mais ou menos assim que fica um codigo de tabelas.

( Fiz um novo site... passem por lá... Pedro Neves (http://www.pedroneves.pt.vu/))

CRLLL excelente!  :boa:

Ja agora... alguem sabe assim uns servidores bons para publicar site em HTML???
Eu tinha o meu site no freewebs.... mas aquilo mudou tudo... agora é só publicidade!
O sapo é mais para blogs...
Então fui por no yahoo... comparado com o freeewebs e com o sapo, acho que é um dos melhores...
Quem souber uns fixes avize!

Para quem quiser ver o meu PC carregue aqui (http://geocities.yahoo.com.br/pedrompneves/h4ck3r.gif)

QuoteJa agora... alguem sabe assim uns servidores bons para publicar site em HTML???
Eu tinha o meu site no freewebs.... mas aquilo mudou tudo... agora é só publicidade!
O sapo é mais para blogs...
Então fui por no yahoo... comparado com o freeewebs e com o sapo, acho que é um dos melhores...
Quem souber uns fixes avize!

Para quem quiser ver o meu PC carregue aqui (http://geocities.yahoo.com.br/pedrompneves/h4ck3r.gif)

alojagratis (http://www.alojagratis.org)

Quote

QuoteJa agora... alguem sabe assim uns servidores bons para publicar site em HTML???
Eu tinha o meu site no freewebs.... mas aquilo mudou tudo... agora é só publicidade!
O sapo é mais para blogs...
Então fui por no yahoo... comparado com o freeewebs e com o sapo, acho que é um dos melhores...
Quem souber uns fixes avize!

Para quem quiser ver o meu PC carregue aqui (http://geocities.yahoo.com.br/pedrompneves/h4ck3r.gif)

alojagratis (http://www.alojagratis.org)

Como é que esse site funciona? Isso é gratis né? Como é que eu me registo?

Quote

Quote

QuoteJa agora... alguem sabe assim uns servidores bons para publicar site em HTML???
Eu tinha o meu site no freewebs.... mas aquilo mudou tudo... agora é só publicidade!
O sapo é mais para blogs...
Então fui por no yahoo... comparado com o freeewebs e com o sapo, acho que é um dos melhores...
Quem souber uns fixes avize!

Para quem quiser ver o meu PC carregue aqui (http://geocities.yahoo.com.br/pedrompneves/h4ck3r.gif)

alojagratis (http://www.alojagratis.org)

Como é que esse site funciona? Isso é gratis né? Como é que eu me registo?

Tems de te registar no forum e depois penso que tems de participar um pouco para teres uma conta.
Mas se for so para html usa as homepages do sapo....

Ok obrigado!

Ah ... e já agora. O "h4ck3r" sou eu... p3droneves
Nakela conta eu ja não vou entrar la muita vez, agora é p3droneves!

só não sei o que este "tutorial" faz aqui, pois HTML não é linguagem de programação e sim  uma linguagem de marcação....

A respeito do "código" das cores como foi falado ali em cima, não são só aquelas cores não:

É um valor hexadecimal (de 0 a 9 e de A a F) de 6 dígitos em RGB, sendo os dois primeiros correspondentes ao vermelho os dois digitos do meio correspondentes ao verde e os dois últimos caracteres correspondentes ao azul, apartir disso é só formar a cor que você deseja...


O Frontpage não é bom não, na verdade nenhum programa que de para fazer a montagem sem escrever o HTML é bom, pois não geram códigos válidos pela W3C.
Mas se for para usar um programa deste tipo, ao menos use o Dreamweaver 8, que é o que possibilita gerar o melhor HTML por enquanto pelo que eu saiba.



E outra coisa o tutorial era pra ser de HTML mas mais abaixo mostra um pequeno código em Javascript sem sequer falar que não é HTML. Se é para iniciante tem que ser algo que explique com detalhes este tipo de coisa para que a pessoa não aprenda errado!

E diversos dos parametros mostrados no tutorial não são recomendados utilizar, porém funcionam perfeitamente em alguns browsers... O ideal é usar CSS para estilizar a página.


Para quem realmente quiser aprender HTML, XML, Javascript e CSS de uma olhada no www.w3schools.com

 8)

" HTML não é linguagem de programação "

ES BURRO?

Desde quando é que HTML não é liguagem de programação?
Tu deves ser daqueles que veem para os forums e poem se a mandar mensagem insignificantes só para ganhar para ganhar número de visitas!
Ve se para a proxima pensas antes de por as mensagens nos forums ok? eu sou um dos ADM do TECHZONE ok?
Ja vistes que nenhuma das tuas mensagens é a não ajudar ninguem... ao contrario de mim que ponho tutorial. CRESCE!!!!!!!!!!!!

Ele tem razão, HTML não é uma linguagem de programação...

Quote" HTML não é linguagem de programação "

ES BURRO?

Desde quando é que HTML não é liguagem de programação?

Ele está correcto. HTML não é uma linguagem de programação. Como ele disse, é uma linguagem de marcação (HyperText Markup Language). Mais próximo da programação é o Javascript, embora não seja considerada uma linguagem de programação por muitos, visto que não é uma linguagem compilada.

Basta dois pontos para demonstrar que HTML não é linguagem de programação:
- Não tem branches.
- Não tem ciclos.

QuoteTu deves ser daqueles que veem para os forums e poem se a mandar mensagem insignificantes só para ganhar para ganhar número de visitas!
Ve se para a proxima pensas antes de por as mensagens nos forums ok? eu sou um dos ADM do TECHZONE ok?
Ja vistes que nenhuma das tuas mensagens é a não ajudar ninguem... ao contrario de mim que ponho tutorial. CRESCE!!!!!!!!!!!!

Uh?

Epa n é isso... to eu a perder tempo a fazer um toturial deste tamanho e tenho posts como o dele.

QuoteEpa n é isso... to eu a perder tempo a fazer um toturial deste tamanho e tenho posts como o dele.

O spectator tem toda a razão no que diz. E depois isto, sendo um tutorial, de programação ou não, devia era estar na secção de tutoriais e não aqui, o que é acentuado pelo facto do HTML não ser linguagem de programação nenhuma. E se o tut é para iniciantes convêm dar-lhes estas noções. Depois, ele corrige-te e tu ainda lhe chamas burro?? E manda-lo crescer?? Acho que aqui quem precisa de crescer és tu...

Quote

QuoteEpa n é isso... to eu a perder tempo a fazer um toturial deste tamanho e tenho posts como o dele.

O spectator tem toda a razão no que diz. E depois isto, sendo um tutorial, de programação ou não, devia era estar na secção de tutoriais e não aqui, o que é acentuado pelo facto do HTML não ser linguagem de programação nenhuma. E se o tut é para iniciantes convêm dar-lhes estas noções. Depois, ele corrige-te e tu ainda lhe chamas burro?? E manda-lo crescer?? Acho que aqui quem precisa de crescer és tu...

OK prontos... desculpem la!
 Eu tava erritado nesse dia... tinha sido por causa de um trojan que me entrou no pc... (uma pessoa formata o pc... ta meia hora a espera de instalar e depois vou a um site de serials para um prog e entra-m o virus... ainda n tinha antivirus instalado... conclusao... tive de formatar outra vez)

Quote

Quote

QuoteEpa n é isso... to eu a perder tempo a fazer um toturial deste tamanho e tenho posts como o dele.

O spectator tem toda a razão no que diz. E depois isto, sendo um tutorial, de programação ou não, devia era estar na secção de tutoriais e não aqui, o que é acentuado pelo facto do HTML não ser linguagem de programação nenhuma. E se o tut é para iniciantes convêm dar-lhes estas noções. Depois, ele corrige-te e tu ainda lhe chamas burro?? E manda-lo crescer?? Acho que aqui quem precisa de crescer és tu...

OK prontos... desculpem la!
 Eu tava erritado nesse dia... tinha sido por causa de um trojan que me entrou no pc... (uma pessoa formata o pc... ta meia hora a espera de instalar e depois vou a um site de serials para um prog e entra-m o virus... ainda n tinha antivirus instalado... conclusao... tive de formatar outra vez)

Ok, na boa. Mas nós não temos que levar com os teus stresses. E depois, se usas Windows já devias saber que 5 minutos na net sem AV, seja para o que for, é o fim... :boa: