Download - Ambiente web aula 02
![Page 1: Ambiente web aula 02](https://reader037.vdocumento.com/reader037/viewer/2022102706/55cf7ee8bb61eb53208b4680/html5/thumbnails/1.jpg)
Aula 02Ambiente Web
Prof. Fernando VieiraBlog: fernandoinstrutor.wordpress.comE-mail: [email protected]
![Page 2: Ambiente web aula 02](https://reader037.vdocumento.com/reader037/viewer/2022102706/55cf7ee8bb61eb53208b4680/html5/thumbnails/2.jpg)
• O que é linguagem de programação• Hyper Text Markup Language (HTML)• Aplicativos• Comandos
AULA AULA
02LINGUAGEM DA INTERNET - HTML
Pág. 12 a 18 15/04/23Turma: Ambiente Web
![Page 3: Ambiente web aula 02](https://reader037.vdocumento.com/reader037/viewer/2022102706/55cf7ee8bb61eb53208b4680/html5/thumbnails/3.jpg)
O QUE É A LINGUAGEM DE PROGRAMAÇÃO?
Código fonte
Todos os aplicativos que conhecemos foram desenvolvidos pelos mais diversos tipos de programação
Devido ao grau de competividade do mercado os programadores tendem a dominar mais de uma linguagem de programação
![Page 4: Ambiente web aula 02](https://reader037.vdocumento.com/reader037/viewer/2022102706/55cf7ee8bb61eb53208b4680/html5/thumbnails/4.jpg)
HYPER TEXT MARKUP LANGUAGE (HTML)
HTML é uma linguagem que possibilita apresentar informações (documentação de pesquisas científicas) na Internet.
Aquilo que você vê quando abre uma página na Internet é a interpretação que seu navegador faz do HTML
PARA QUE DEVO USAR O HTML?
![Page 5: Ambiente web aula 02](https://reader037.vdocumento.com/reader037/viewer/2022102706/55cf7ee8bb61eb53208b4680/html5/thumbnails/5.jpg)
HYPER TEXT MARKUP LANGUAGE (HTML)
Se você quer construir websites terá que conhecer HTML.
Mesmo que você use um programa para criar seu website, tal como o Dreamweaver, um conhecimento básico de HTML será necessário para tornar as coisas mais simples
A boa notícia é que HTML é fácil de aprender e de usar
HTML É USADO PARA CONSTRUIR WEBSITES. É SIMPLES!
![Page 6: Ambiente web aula 02](https://reader037.vdocumento.com/reader037/viewer/2022102706/55cf7ee8bb61eb53208b4680/html5/thumbnails/6.jpg)
O QUE SIGNIFICA HTML?
HYPER – Oposto de Linear
TEXTO – Somente texto
MARK UP – Marcação
LANGUAGE – Significa linguagem. Exatamente o que o HTLM é uma linguagem
![Page 7: Ambiente web aula 02](https://reader037.vdocumento.com/reader037/viewer/2022102706/55cf7ee8bb61eb53208b4680/html5/thumbnails/7.jpg)
PROTOCOLO
FTP: Transferências de dados
HTTP: Transferência de Hypertexto é usado para
conectar as páginas WWW
TCP/IP: Sãos os protocolos de comunicação entre dois ou mais computadores
![Page 8: Ambiente web aula 02](https://reader037.vdocumento.com/reader037/viewer/2022102706/55cf7ee8bb61eb53208b4680/html5/thumbnails/8.jpg)
APLICATIVOS
BLOCOS DE NOTAS NOTEPAD++
![Page 9: Ambiente web aula 02](https://reader037.vdocumento.com/reader037/viewer/2022102706/55cf7ee8bb61eb53208b4680/html5/thumbnails/9.jpg)
COMANDOS
Tags são rótulos usados para informar ao navegador como deve ser apresentado o website
Todas as tags têm o mesmo formato: começam com um sinal de menor "<" e acabam com um sinal de maior ">"
< HTML>
TAG DE ABERTURA
</HTML>
TAG DE FECHAMENTO
![Page 10: Ambiente web aula 02](https://reader037.vdocumento.com/reader037/viewer/2022102706/55cf7ee8bb61eb53208b4680/html5/thumbnails/10.jpg)
CONTINUANDO...
< HTML>
<HEAD> CABEÇALHO
<TITLE> NOME DA PÁGINA </TITLE>
</HEAD> CABEÇALHO
<BODY>
CONTEÚDO DA PÁGINA
</BODY>
</HTML>
AO TERMINAR A EDIÇÃO VOCÊ DEVE SALVAR COMO: HTM OU HTML
![Page 11: Ambiente web aula 02](https://reader037.vdocumento.com/reader037/viewer/2022102706/55cf7ee8bb61eb53208b4680/html5/thumbnails/11.jpg)
IMPORTANTE
Quando você estiver criando um website, os arquivos que fazem parte do mesmo, deve estar organizado numa mesma pasta.
Não há diferenças digitar as tags em minúsculo ou maiúsculo
Demais páginas com os Links
Imagens
Vídeos
Músicas
![Page 12: Ambiente web aula 02](https://reader037.vdocumento.com/reader037/viewer/2022102706/55cf7ee8bb61eb53208b4680/html5/thumbnails/12.jpg)
COMANDO <H1>
<H1> TAMANHO 01 </H1>
<H2> TAMANHO 02 </H2>
O COMANDO H1 PERMITE A VARIAÇÃO EM ATÉ 6 TAMANHOS
![Page 13: Ambiente web aula 02](https://reader037.vdocumento.com/reader037/viewer/2022102706/55cf7ee8bb61eb53208b4680/html5/thumbnails/13.jpg)
PARÁGRAFO E QUEBRA DE LINHA
<P> DEFINE UM PARÁGRAFO
DEIXA UMA LINHA EM BRANCO ENTRE CADA PARÁGRAFO
<BR> QUEBRA DE LINHA
FAZ UMA QUEBRA DE LINHA, SEM ACRESCENTAR ESPAÇOS EXTRAS ENTRE AS LINHAS
A TAG <P> E <BR> NÃO NECESSITAM DA TAG DE FECHAMENTO PARA FUNCIONAR
![Page 14: Ambiente web aula 02](https://reader037.vdocumento.com/reader037/viewer/2022102706/55cf7ee8bb61eb53208b4680/html5/thumbnails/14.jpg)
COR DE FUNDO NA PÁGINA
<BODY BGCOLOR=“ NÚMERO OU NOME”>
<BODY BGCOLOR=“RED”>
<BODY BGCOLOR=#CD5C5C”
OBSERVE A TABELA DA PÁG. 17
![Page 15: Ambiente web aula 02](https://reader037.vdocumento.com/reader037/viewer/2022102706/55cf7ee8bb61eb53208b4680/html5/thumbnails/15.jpg)
INSERINDO IMAGENS E LINKS
INSERINDO IMAGEM
<IMG SRC=“LUGAR DA IMAGEM. E EXTENSÃO”
EX: <IMG SRC=“HARLEMSHAKE.PNG”
OUTROS COMANDOS DE EDIÇÃO DE TEXTO NA PÁG. 18
CRIANDO LINK
<A HREF=“LINK.HTML/">NOME DO LINK</A>
EX: <A HREF=WWW.HARLEMINSTRUTOR.BLOGSPOT.COM>MEU BLOG</A>
![Page 16: Ambiente web aula 02](https://reader037.vdocumento.com/reader037/viewer/2022102706/55cf7ee8bb61eb53208b4680/html5/thumbnails/16.jpg)
Pág. 19 – Atividade 1 a 5