Programação para Internet -...
Transcript of Programação para Internet -...
Introdução a Web
• HTML é a sigla em inglês para HiperTextMarkup Language, que em português significalinguagem para marcação de hipertexto.
• Hipertexto pode ser resumido como todoconteúdo inserido em um documento para webe que tem como principal característica apossibilidade de se integrar a outrosdocumentos na web.
• O que torna possível a construção de hipertextosão os links, presentes nas páginas dos sitesque estamos acostumados a visitar quandoentramos na internet.
Histórico
• A web foi inventada em 1922 por Sir Tim
Berners-Lee. Atualmente diretor do World
Wide Web Consortiun (W3C), pesquisador
senior do Laboratório da
Ciência da Computação
e Inteligência Artificial
do Instituto de
Tecnologia de Massachusetts (MIT).
Histórico
• Em meados dos anos 90, Tim Berners-
Lee trabalhava na Seção de Computação
da Organização Européia de Pesquisa
Nuclear, quando iniciou a pesquisa
visando descobrir um método para que os
cientistas do mundo inteiro
compartilhassem eletronicamente seus
textos e pesquisas, sendo criado o
rascunho da web.
Histórico
• Em 1990, Tim criou o protótipo de um
navegador para rodar em computadores
NeXT, uma companhia fundada em 1985
por Steve Jobs.
• Inicialmente o navegador foi chamado de
WorldWideWeb, posteriormente
renomeado para Nexus a fim de evitar a
confusão com a World Wide Web.
Histórico
• Tim acreditava que era possível interligar
hipertextos em computadores diferentes
usando links globais. Ele desenvolveu um
software pronto e um protocolo para
recuperar hipertextos, denominado HTTP.
• A marcação para hiperlinks conduzindo a
documentos que não estivessem em um
mesmo computador obviamente não
constavam nas normas padrões da época
(SGML), e foi inventada por Tim em 1990.
Histórico
• Tim em uma estação de trabalho NeXT,
nos laboratórios da CERN, mostrou o
embrião da World Wide Web, bem como a
primeira versão da linguagem HTML.
• A partir daí, a evolução cronológica da
Web deu continuação até o que a gente
vê hoje.
HTML
• HTML não é uma linguagem de
programação, e sim uma linguagem de
marcação. (programação ocorre
transformação da informação e marcação:
você marca o conteúdo, ou seja, significa
que sua especificação prescreve como o
dado estruturado será mostrado, porém
outras linguagens de marcação, tal como
XML, não possui semântica predefinida....)
HTML
• HTML é interpretado pelos navegadores
(internet explorer, firefox, google crome,
opera, safari...). Sites rodam em cima de
navegadores, é a forma que o usuário usa
para se comunicar. Grande problema quando
se fala em html, porque o código não é
compilado (delphi) e sim o código continua
sendo puramente texto e ele é transmitido
pela internet até o navegador de quem
acessa, e o navegador é quem vai
interpretar.
HTML
• O problema existe quando as marcas de
navegadores começam a inovar (muita
tecnologia) e às vezes os criadores de
sites não conseguem acompanhar o
padrão (normas do w3c) dos
navegadores. Então, geram-se os erros.
Como escreve o HTML?
• Todo documento HTML apresenta
etiquetas(TAGS), elementos entre
parênteses angulares (< e >); esses
elementos são os comandos de
formatação da linguagem. A maioria das
etiquetas tem sua correspondente de
fechamento:
<etiqueta>...</etiqueta>
Como escreve o HTML?
• Isso é necessário porque as etiquetas
servem para definir a formatação de uma
porção do documento, e assim marcamos
onde começa e termina o texto com a
formatação especificada por ela. Alguns
elementos são chamados “vazios”, pois
não marcam uma região de texto, apenas
inserem algum elemento (imagem, som,
link) no documento:
<etiqueta>
Como escreve o HTML?
• Uma etiqueta é formada por comandos,
atributos e valores. Os atributos modificam
os resultados padrões dos comandos e os
valores caracterizam essa mudança.
Exemplo
<HR color="red">
No qual:
• HR = comando que desenha uma barra
horizontal
• color = atributo que especifica a cor da
barra
• red = valor do atributo color, que é a cor
da barra que será desenhada
Para testar...
• Abra o bloco de notas;
• Digite o seguinte:
<HR color="blue">
<font color="blue"> O CRUZEIRO É O
MELHOR TIME DO MUNDO!!! </font>
<HR color="blue">
• Salve como exemplo1.html
• Abra-o para ver o resultado.
Desafio...
• Com base no exemplo anterior, escreva a
frase: “Ordem e progresso” , tanto na
parte de cima quanto na parte de baixo
faça as faixas com as cores da bandeira.
Antes de Prosseguir...
• TAG P:
• A tag ou etiqueta <p> é usada para definir
um parágrafo, para facilitar o aprendizado
digitem em um bloco de notas:
• Linha 01
• Linha 02
• Linha 03
Salve com o nome teste03.html
Antes de Prosseguir...
• Abra o exemplo anterior e a cada inicio de
linha coloque a tag <p> e no final de cada
linha coloque a tag de finalização </p>.
• Salve com o nome teste04.html e veja
como ficou