Você está na página 1de 1

Suporte Grafico - ESTADOCOR_teste - 19-03-2008

?**?newsup?**?

Produto: EST_SUPL1 - INFORMATICA - 6 - 12/04/10


L6 - CYANMAGENTAAMARELOPRETO

L6 link
%HermesFileInfo:L-6:20100412:

SEGUNDA-FEIRA, 12 DE ABRIL DE 2010 O ESTADO DE S. PAULO

PERSONAL NERD
A linguagem da internet é o HTML
E ela, assim como a rede, Para começar...
está em constante evolução.
Através de comandos cada O que é HTML? Para ver o código
vez mais simples (chamados HTML é uma língua baseada em tags
ESSA É
UMA
TAG
ESSE É UM ATRIBUTO PARA SUA TAG. ESSES
ATRIBUTOS PODEM ALTERAR O CONTEÚDO
DA TAG DE MUITAS FORMAS, NESSE
ENTRE AS
TAGS VAI O
CONTEÚDO
TODA TAG
PRECISA SER
FECHADA,
Para ter acesso ao código fonte das
de "tags"), o HTML permite (como <h1></h1>) criada a partir do EXEMPLO ELA DEIXOU O TEXTO VERMELHO DELA ESSA “/”
INDICA ISSO
páginas clique com botão direito
SGML. Ela é a “língua franca” da internet do mouse sobre a página e
a criação de elementos e pode ser criada e processada por uma selecione a opção “código-fonte“
gráficos ou estruturais em ampla gama de softwares. Todas as <h1 style="color:red;" > Texto </h1>
um site, que vão desde o páginas na internet têm HTML escrito botão direito Código-fonte
em algum canto
espaço para um vídeo até a <html>
formatação dos textos e <head>
Crie o seu <title>Escreva seu nome aqui!</title>
links. Modelos mais recentes Escreva o texto ao lado no seu bloco de </head> <html lang="pt-BR" dir="ltr" class="y-

dos principais navegadores notas ou similar, salve o arquivo como <body style="text-align:center;"> fp-bg y-fp-pg-grad ua-ff ua-ff3_5 ua-

“minhapagina.html” e você já pode abri- <p><img src="http://bit.ly/adiTt7" /></p> win bkt707">

já oferecem suporte às <h1>Escreva seu nome aqui!</h1>


<!-- m2 template 0 -->

la no seu navegador. Basta clicar no <head>

novas tags do HTML 5 arquivo que ele abrirá no browser


<p>Escreva seu texto aqui!</p> <meta http-equiv="Content-Type"
content="text/html; charset=utf-8">
</body>
</html>

WWW.AMAZON.COM - 2006

NAVEGADOR

L
A ORGANIZAÇÃO DE
CORES E ESPAÇOS http://www.amazon.com
FICOU MAIS SIMPLES

M 2006
DEPOIS DO CSS E SUA
POPULARIZAÇÃO

T
H IBM doa 50 mil linhas de
código à Mozilla Foundation,
incluindo acessibilidade ao
Google compra YouTube WHATWG expande seu
escopo para incluir
HTML como linguagem
do

padrão DHTML DOM, além de APIs


ia

Estreia do YouTube Estreia do F3,


precursor do JavaFX
tór

2005 2007
A hi s

Saindo do TXT Chris Wilson, da Microsoft,

1993
Adobe compra a l No começo a internet era
se junta ao grupo de trabalho
Macromedia praticamente feita de texto puro, do HTML
como nas BBS (Bulletin Board
System) HTML 1.0 é publicado
pela primeira vez pela
estreia do precursor
Macromedia lança o Flex IETF
do Adobe AIR
1.0, que gera arquivos SWF
(também precursor do
Flash)

1995
WWW.YAHOO.COM - 1996

NAVEGADOR

Ian Hickson é indicado


XHTML e RDF
http://www.yahoo.com
a editor do HTML 5
FutureSplash
A INTERNET NO Animator, precursor
COMEÇO ERA FEITA
DE TEXTO E LINK do Flash

2004 Microsoft lança


o Silverlight

1996
navegadores (todos menos
o IExplorer) se juntam para
criar a Web Hypertext
Application Technology
Working Group (WHATWG)
HTTP e HTML são a
onda do momento 2008
publicado o primeiro
rascunho do HTML 5

1999 1997
HTML versão 4.01
1998
W3C foca no XML;
HTML 4.0,
recomendação W3C
SVG é removido
do HTML 5

nova geração de
HTML deve Google renova
recomeçar do zero patrocínio ao Mozilla

NAVEGADOR NAVEGADOR
Google lança
o Chrome

2010
http://www.youtube.com http://www.youtube.com

Recomeço
l A popularização do HTML 5
o HTML 5 chega aos
facilitou a vida de designers e principais sites e
usuários, incorporando serviços da web
aplicativos externos ao processo
do navegador
COM O HTML5, O A EXIBIÇÃO DE
CARREGAMENTO DE VÍDEOS EM FLASH
ÁUDIO E VÍDEO CAUSA LENTIDÃO
PASSA A SER FEITO NO NAVEGADOR E
PELO PRÓPRIO EXIGE PLUGINS
NAVEGADOR EXTERNOS

Principais implementações do HTML 5:


EXEMPLOS TECNOLOGIA SUPORTE EXEMPLOS TECNOLOGIA SUPORTE

<video> e <audio>
Para exibição de <time>
Mostra data ou hora
conteúdo multimídia

<section> e <article> * Definem elementos da <canvas>


Para renderizar gráficos
página e sua estrutura dinâmicos em tempo real

<aside> * Relativiza um elemento <command> * Permite ao usuário invocar


ao conteúdo da página comandos dentro de um

<header> e <footer> * Definem cabeçalho <progress> * Progresso de uma tarefa,


e rodapé como download de arquivos
* O comando deve ser implementado em versões futuras dos navegadores
PESQUISA: FRED LEAL INFOGRÁFICO: FILIPE CAMPOI E RUBENS PAIVA/AE

Você também pode gostar