Loading presentation...

Present Remotely

Send the link below via email or IM

Copy

Present to your audience

Start remote presentation

  • Invited audience members will follow you as you navigate and present
  • People invited to a presentation do not need a Prezi account
  • This link expires 10 minutes after you close the presentation
  • A maximum of 30 users can follow your presentation
  • Learn more about this feature in our knowledge base article

Do you really want to delete this prezi?

Neither you, nor the coeditors you shared it with will be able to recover it again.

DeleteCancel

Make your likes visible on Facebook?

Connect your Facebook account to Prezi and let your likes appear on your timeline.
You can change this under Settings & Account at any time.

No, thanks

HTML

Introdução ao HTML
by

André Luís Violin

on 2 October 2012

Comments (0)

Please log in to add your comment.

Report abuse

Transcript of HTML

1994 Introdução ao HTML O que é HTML? Linguagem utilizada para desenvolver websites. Desde o começo o HTML foi criado para ser uma linguagem independente de plataformas, browsers e outros meios de acesso. Interoperabilidade significa menos custo. Você cria apenas um código HTML e este código pode ser lido por diversos meios, ao invés de versões diferentes para diversos dispositivos. Dessa forma, evitou-se que a Web fosse desenvolvida em uma base proprietária, com formatos incompatíveis e limitada. Linguagem base da internet interpretada por navegador (browser). Criada para ser de fácil entendimento, tanto para seres humanos quanto para máquinas. HyperText Markup Language = Linguagem de Marcação de Hipertexto. HIPERTEXTO Hipertexto é um conjunto de documentos de qualquer tipo (imagens, texto, gráficos, tabelas, videoclipes) conectados uns aos outros por links. Histórias escritas em hipertexto podem ser divididas em “páginas” que se desenrolam (como aparecem na world wide web). (MURRAY; DAHER, 2003) Todo conteúdo inserido em um documento para web e que tem como principal característica a possibilidade de se interligar a outros documentos da web. [Silva, 2011] Quem criou o HTML? Tim Berners-Lee.
Para ser usada na comunicação e disseminação de pesquisas.
Passou a ser conhecida ao ser utilizada para formar a rede pública da época.
Vindo a se tornar a internet como a conhecemos O HTML surgiu baseado em uma linguagem de conhecida como SGML que foi utilizado para a estruturação de documentos. A partir desta linguagem o HTML implementou diversas características na formatação de documento. 1990 Linguagem de Marcação de Hipertexto
Seu princípio é publicar documento e conteúdos interligados na web e ser uma linguagem independente de plataformas, navegadores e outros meios de acesso. HTML teve como um de seus criadores o físico Tim Berners-Lee, e se popularizou quando o navegador Mosaic ganhou forças (este navegador foi um dos primeiros navegadores web). HTML+ HTML 2.0 HTML 3.0 HTML 4.0 HTML 4.0.1 XHTML XHTML 1.1 HTML5 1993 1994 1997 1999 2006 1994 W3C World Wide Web Consortium;
Fundado por Tim Berners-Lee;
Visa levar a Web ao seu potencial máximo;
Fóruns abertos que promovam a sua evolução e assegurem a sua interoperabilidade. 2004 - WHATWC Web Hypertext Application Technology Working Group - Grupo de Trabalho Tecnológico de Aplicações de Hipertexto para Web;
Fundado como resultado de uma grande insatisfação de empresas como Mozilla, Apple e Opera com os rumos que a Web estava tomando;
Por volta de 2006, o trabalho do WHATWG passou ser conhecido pelo mundo e principalmente pelo W3C;
Atualmente trabalham em parceria. X HTML é uma linguagem de marcação e se destina a marcar ou estruturar conteúdos para web. Também conhecida como linguagem de publicação web. MARCAÇÃO PROGRAMAÇÃO Processo complexo que segue uma metodologia completamente diferente.
Implica escrever comandos capazes de consultar, comparar, decidir, escolher, escrever, receber, transmitir e todo um vasto conjunto de comportamentos dinâmicos impossíveis de ser conseguidos com o HTML. Cria novas tags e muda a função de outras;
Padrão para criação de sessões comuns como rodapé, cabeçalho, sidebar e menus.
Muda a forma de escrever código e organizar a informação:
Mais semântica e menos código;
Mais interatividade sem plugins e perda de performance;
Código interoperável, pronto para futuros dispositivos;
Facilita a reutilização da informação de diversas formas. HTML5 Controle embutido de conteúdo multimídia (Áudio e Vídeo);
Desenvolvimento de gráficos bidimensionais;
Aprimoramento do uso off-line;
Geolocalização;
Validação de Formulários nativa;
Drag and Drop. Novos Recursos <!DOCTYPE html> Estrutura Básica <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd"> XHTML 1.0 <html xmlns="http://www.w3.org/1999/xhtml" lang="pt-br"> XHTML 1.0 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd"> HTML 4.01 </html> </body> <!-- Conteúdo aqui --> <body> </head> <title>Título da página</title> <meta charset="UTF-8"> <head> <html lang="pt-br"> O Doctype deve ser a primeira linha de código do documento antes da tag HTML.
O Doctype indica para o navegador e para outros meios qual a especificação de código utilizar. Em versões anteriores, era necessário referenciar o DTD diretamente no código do Doctype. Com o HTML5, a referência por qual DTD utilizar é responsabilidade do Browser.
O Doctype não é uma tag do HTML, mas uma instrução para que o browser tenha informações sobre qual versão de código a marcação foi escrita. O código HTML é uma série de elementos em árvore onde alguns elementos são filhos de outros e assim por diante. O elemento principal dessa grande árvore é sempre a tag HTML.
O atributo LANG é necessário para que os user-agents saibam qual a linguagem principal do documento.
Lembre-se que o atributo LANG não é restrito ao elemento HTML, ele pode ser utilizado em qualquer outro elemento para indicar o idioma do texto representado.
Para encontrar a listagem de códigos das linguagens, acesse: http://www.w3.org/International/questions/qa-choosing-language-tags. A Tag HEAD é onde fica toda a parte inteligente da página. No HEAD ficam os metadados. Metadados são informações sobre a página e o conteúdo ali publicado. Nas versões anteriores ao HTML5, essa tag era escrita da forma abaixo:

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8”> O "meta charset" define quais caracteres abstratos podem fazer parte de um documento HTML. É graças ao charset que, se você digitar uma palavra acentuada no seu site, ele vai garantir que a palavra apareça de forma correta.
A palavra "além", por exemplo, pode aparecer como "alm" em uma página com um meta charset incorreto - tendo que ser reposto por "al&eacute;m".
Tradicionalmente, usa-se o charset UTF-8 especialmente para sites em língua portuguesa. Título da página a ser exibido (texto que fica na aba de seu navegador quando uma página esta aberta). Tag onde devem ser inseridos os conteúdos do site que deverão ficar visíveis ao usuários quando a página for renderizada no navegador. Tag Como são chamados os comandos HTML.
Marcas padrões usadas para fazer indicações no navegador.
Possuem sintaxe própria:
Aparecem sempre os sinais “menor que” (<) e “maior que” (>).
Geralmente são utilizadas em pares.
Em geral:
<nome da TAG>texto</nome da TAG>
onde:
<nome da TAG>: indica o início da TAG
e </nome da TAG>: indica o final da TAG. <p> Aula de Desenvolvimento Web - HTML </p> Nome do elemento Tag de encerramento Container: Tudo o que estiver neste container irá ser renderizado graficamente conforme o estilo pré-definido para o elemento pai.
Full transcript