Encontro 11 12. Linguagem HTML; 13. Hospedagem na WWW. Disciplina: Tópicos Avançados de TI Unidade IV: Desenvolvimento para a WWW Prof.: Mario Filho E-mail: pro@mariofilho.com.br Período: 7º. SIG - ADM Encontro 11 12. Linguagem HTML; 13. Hospedagem na WWW.
12. Linguagem HTML
12.1. O que é HTML? A sigla HTML deriva da expressão Hyper Text Markup Language (Linguagem de Marcação Hipertexto). Trata-se de uma linguagem de marcação utilizada para produzir páginas na Internet. Esses códigos podem ser interpretados pelos Navegadores (browsers) para exibir as páginas da World Wide Web. Prof. Mario Filho
12.2. Exemplo Prático 1 O Bloco de Notas do Windows serve para criar arquivos sem formatação e será muito útil para o nosso primeiro exemplo. Abram o bloco de notas do Windows e digite o conteúdo do próximo slide... Prof. Mario Filho
<title>Primeira Aula de HTML</title> </head> <body> Olá, Mundo! </body> </html> Prof. Mario Filho
12.2. Exemplo Prático 1 Salve na Área de Trabalho o arquivo criado no Bloco de Notas como a extensão .html. Ex.: pg1.html Atenção: use sempre letras minúsculas para dar nome aos arquivos. Feche o Bloco de Notas e dê dois cliques sobre o arquivo salvo na Área de Trabalho e veja o que acontece. Prof. Mario Filho
12.2. Exemplo Prático 2 Abra um site qualquer na Web; Faça os comandos abaixo conforme o navegador que estiver usando: Internet Explorer: Exibir / Código-Fonte Firefox: Exibir / Código-fonte ou (Ctrl +U) Será aberta uma janela com a linguagem HTML da página. Prof. Mario Filho
12.3. Tag A base da linguagem HTML é a tag (etiqueta ou marca em português) e todo documento (arquivo) HTML apresenta etiquetas ou marcas. Tags, etiquetas ou marcas, são elementos entre parênteses angulares (chevron) “<” e “>”. Ex.: <etiqueta>...</etiqueta> Prof. Mario Filho
12.3. Tag A tag principal ou mais famosa de um documento HTML é a <html>, que serve para criar o documento. Toda tag possui abertura e fechamento: <html> </html> tag de abertura (onde começa o documento) tag de fechamento (onde termina o documento) Prof. Mario Filho
12.3. Tag Outras duas áreas muito importantes marcadas por tags e que estão localizadas dentro da tag <html> são: <html> <head> área da cabeçalho </head> <body> área do corpo </body> </html> Prof. Mario Filho
12.3. Tag A área <head></head>: possui informações sobre o cabeçalho da página ou documento, definindo configurações. Ex.: <title>Primeira Aula de HTML</title> A área <body></body>: contém informações sobre o corpo da página. Ex.: Olá, Mundo! Observem novamente a estrutura... Prof. Mario Filho
<title>Primeira Aula de HTML</title> </head> <body> Olá, Mundo! </body> </html> CABEÇALHO CORPO DOCUMENTO HTML Prof. Mario Filho
13. Hospedagem na WWW
13.1. Hospedagem (hosting) Para que o mundo inteiro possa ver a página que você criou, é necessário que o arquivo HTML criado esteja hospedado (armazenado) em algum servidor (host) na Internet. Prof. Mario Filho
13.2. Servidor Escolhido: http://www.xpg.com.br/ Prof. Mario Filho
Prof. Mario Filho
Prof. Mario Filho
Prof. Mario Filho
Prof. Mario Filho
Abra seu e-mail e ative a conta: Prof. Mario Filho
Prof. Mario Filho
Prof. Mario Filho
13.3. Acessando por FTP Usaremos o FTP para enviarmos nosso arquivo para o host (servidor). Abra o Windows Explorer; Coloque em “Endereço:”: ftp://ftp.xpg.com.br/ Aparecerá uma tela de login, use seu login e senha criados no XPG. Após entrar na pasta onde seus arquivos serão hospedados, é só copiar e colar um ou mais arquivos para o host. Prof. Mario Filho
Prof. Mario Filho
13.4. Acessando por FTP Web Basta clicar na opção indicada no próximo slide... Prof. Mario Filho
Prof. Mario Filho
Observação: “index.html” é o nome padrão do primeira arquivo que deverá ser aberto quando um visitante digitar seu endereço em um navegador. É o arquivo com a HOME PAGE do site! Se quiser transformar a página pg1.html para a home page do site, renomeie o arquivo para index.html. Prof. Mario Filho
13.5. Visualizando a página Agora para visualizar sua página na WWW, basta digitar o endereço dela em um navegador. Ex.: www.mariozinhom.xpg.com.br Prof. Mario Filho
Prof. Mario Filho
Próxima Aula Editores HTML Prof. Mario Filho
FIM