• Olá Visitante, se gosta do forum e pretende contribuir com um donativo para auxiliar nos encargos financeiros inerentes ao alojamento desta plataforma, pode encontrar mais informações sobre os várias formas disponíveis para o fazer no seguinte tópico: leia mais... O seu contributo é importante! Obrigado.

Html BÁsico

helldanger1

GForum VIP
Entrou
Ago 1, 2007
Mensagens
29,631
Gostos Recebidos
1
Objetivo:

O objetivo deste tutorial é de ensinar a linguagem html básica para que você possa criar suas páginas a internet.



Pré-requisito:

Para você poder acompanhar o desenvolvimento deste tutorial, será necessário ter conhecimento no mínimo do
de informática básica.



Nota:

Irei ensinar a linguagem de html de uma forma bem objetiva, ou seja, iremos aprender na prática através da criação páginas.



Para começar vamos falar um pouquinho sobre a internet , este universo virtual enorme que nos possibilita obter várias informações entre outros, hoje é muito dificil viver sem a internet, na maioria das vezes o mundo gira sobre a internet, as empresas em grande maioria estão online vendendo seus produtos ou prestando serviços e a partir deste tutorial iremos começar aprender a criar as nossas próprias páginas em pouco tempo estaremos com nosso site na rede mundial como é conhecida a internet.



Hoje para disponibilizar as páginas na internet precisamos de um servidor que fica responsálve por armazernar nossas paginas e disponibiliza-la 24 por dia, com isso podemos acessar os conteúdos de qualquer computador conectado a internet. Podemos criar sites sobre qualquer assunto que quisermos, por exemplo: site com informações pessoais, site de prestação de serviços, site sobre noticías entre outros.



Existe também a intranet e extranet, a difrença entre um e outra é a seguinte:



Intranet: Podemos dizer que é uma internet interna, ou seja, pode ser utilizado por funcionários de uma empresa, não sendo possível acessar fora da empresa.



Extranet: Usando as empresas que tenham filiais como exemplo as mesmas podem fazer um interconexão para trocar de arquivos entre outros.



Para eu ensinar HTML a você iremos trabalhar desde do inicío com um projeto de criação de um site, que irá começar bem simples e ao longo do apredizado iremos aperfeiçoando. Para iniciar vamos saber o que significa HTML.



Html – HyperText Markup Language (Linguagem de formatação de hipertexto), lembrando sempre que html não é uma linguagem de programação e sim de formatação.



Para edição de html, ou seja, para escrevermos html podemos usar o bloco de notas do windows ou editores que entese facilita bastante, por que traz a maioria dos comandos e atributos prontos cabendo a nós só definirmos os valores, em nosso caso que estamos aprendendo vamos utilizar o bloco de notas para fixarmos bem os comandos.



Para iniciar a escrever html sempre começamos pela estrura básica da página que é a seguinte:



<html> * Inicia a página

<head> * Inicia o cabeçalho

<title> * Inicia o nome do cabeçalho

* aqui você coloca o nome que você deseja que apareça

</title> * Aqui fecha o nome do cabeçalho

</head> * Fecha o cabeçalho

<body> * Inicia o corpo da página

* Aqui entre estas tags colocamos as imagens, textos e etc.

</body> * Fecha o corpo da página

</html> * Fecha a página



Vou explicar esta estrutura básica acima, sempre começamos utilizandos as tags <html> para iniciar e </html> para fechar o documento, dentro destas tags colocamos as tags <head></head> e dentro dessas colocamos <title></title> para definir o nome do cabeçalho da página e por último dentro das tags <body></body> colocamos imagens, textos, entre outros, práticamente tudo que colocamos entre estas tags vai ser o que iremos visualizar na página.



Após ter feito esta parte precisamos salvar a página sempre em um desses formatos html ou htm, sempre é aconselhavél salvar em html, então para isso vamos dar um nome a esta página acima que vai se chamar meusite.html.
 

helldanger1

GForum VIP
Entrou
Ago 1, 2007
Mensagens
29,631
Gostos Recebidos
1
Primeiramente crie uma pasta na area de trabalho do seu computador com o nome de “Site”, dentro da mesma é onde vamos salvar nossas páginas e projetos ao longo do desenvolvimento dos tutoriais, irei mostrar passo a passo através das telas para que você tenha um melhor entendimento. Primeiramente copie esta estrutura da mostrada acima, só que sem os “*” que contém as explicações sobre as tags e cole dentro do bloco de notas e depois salve com o nome que definimos dentro da basta que você acabou de criar.Veja o procedimeto baixo:

htmlbasico001_clip_image002.jpg

Tela 001 (estrutura básica inserida)

htmlbasico001_clip_image004.jpg


Tela 002 (Salve esta página dentro da pasta com o nome meusite.html)



Feito isso abra a basta e clique sobre icone para abrir a página que vai estar desta maneira baixo:

htmlbasico001_clip_image006.jpg


Tela 003(Pagina aberta)



Note que acabamos de abrir a página dentro do internet explorer, mas a mesma não contem nenhum conteúdo em seu corpo ou mesmo o nome do cabeçalho.



Então vamos inserir um nome no cabeçalho que vai ser “Meu Site” para isso basta colocar entre as tags <title></title>.



E dentro do corpo da página, ou seja, entre as tags <body></body> vamos escrever a seguinte frase “ Esta é a minha primeira página”.



Não é necessário abrir um bloco de notas vazio, porque iremos aprender a abrir o código fonte da página que acabamos de criar, com isso a estrutura da página já esta pronta apenas vamos alterar conforme nossa necessidade.



Vou ensinar como você deve abrir o código fonte da página sendo que o processo é muitoo simples, abra o pagina que criamos, no internet explorer clique sobre o menú exbir depois clique novamente em “exibir código fonte”, pronto vai ser aberto o bloco de nota com a estrura da página, veja o procedimento abaxo:


htmlbasico001_clip_image008.jpg
 

helldanger1

GForum VIP
Entrou
Ago 1, 2007
Mensagens
29,631
Gostos Recebidos
1
Tela 004 (Clique no menú exibir e depois em código fonte)

htmlbasico001_clip_image010.jpg


Tela 005 (Vai ser aberto o bloco de notas com a estrutura da página)



Agora que estamos com o bloco de notas aberto iremos inserir a frase no cabeçalho e no corpo da página, veja o procedimento abaixo:


htmlbasico001_clip_image012.jpg


Tela 006 ( Veja as frases inseridas no bloco de notas)



Depois que fizemos as alterações basta você salvar para que seja modificada a página, minimize o bloco de notas e na página clique em atualizar para ver as alterações, a página irá ficar da seguinte maneira:

htmlbasico001_clip_image014.jpg


Tela 007 (Esta será a página depois de modificada)
 
Topo