Aula 28,29 e 30 w3 c, versões, html5

W3C, Versões, HTML5
(X)HTML
Professor Jolvani
Aulas 28, 29 e 30

W3C, Versões, HTML – (x)HTML
 Olá prezados programadores de Interface, codificadores
html. A partir desse ponte, vcs podem dizer que já
sabem programar em html...
 Agora vamos ver alguns detalhes que permitem trocar
alguns arquivos (código) html para xHtml.
 Nesta aula vamos aprender sobre as versões existentes
do html, o que são doctypes, validação e até
certificação ref. ao conhecimento adquirido...

 Nós apresentamos dois portais o W3C – www.w3c.org ou
www.w3c.br e W3Schools – www.w3schools.com, ele são
mantidos pelo mesmo grupo.
 Quem mantem os portais são os criadores e fundadores da Web,
as pessoas que deram inicio as primeiras tecnologias web, os
primeiros browsers, as pessoas que definiram com as tags iam
funcionar, fazem sugestões para toda comunidade onde eles
(indústria de hardware e software, ...) seguem os padrões da
W3C.
 E seguindo esses padrões vc terá a garantia que ele funcionará
em todos os navegadores, será mais rápido. Então é bom aderir a
web standards, ou seja, os padrões da web, já é estar em um
outro nível de codificação...
 A W3C trata muito mais do que html, além do html...

 Coloca pagina W3C brasil e W3Schools.
 O Html é o básico do mundo web. Na W3C vc pode ver as
disciplinas que são tratadas para os web designer... www.w3c.br
 Html + css
 JavaScript + Ajax
 Gráficos
 Intercionalização
 Acessibilidade
 Áudio e vídeo
 Dispositivos móveis
 Privacidade e Matemática na web
 Normartizadas pela W3C.

 Na w3Schools encontramos materiais pra auxiliar vc estudante de html,
xhmtl, ajax, jquery, javascript divididos em categorias...
 Páginas em português que devem ser acessadas para agregar
conhecimento...
 www.caelum.com.br
 www.k19.com.br
 www.maujor.com
 www.tableless.com.br
 Nessas páginas nos temos
tutorias em html e html5,
referências, exemplos e
Elementos para manipulação de medias

 Falando de html, notamos que o mesmo possui varias versões.
Mas no site podemos ver html e html, dentro de html temos as
versões 4.0 e o xhtml.
 Observe as versões
 Podíamos programar as tags
em maiúsculo (html4), abrir
tag e não fechar, causando
Problemas. Então criaram o
Xhtml,H5. Por isso o cuidado de
sempre codificar em minúsculo e fechar as tags, atributos em minúsculo e
valores dos atributos em aspas duplas. Existe uma série de vantagens em
estar utilizando a formatação em xhtml e html5 (velocidade do navegador)

 Se olharmos para as versões notamos que html5 foi criado em
2012, e xhtml5 em 2013, os dois padrões estão recém se
estabelecendo (em 2011 nem todos os browser suportavam html5)
 O xhtml 1.0 é a versão estável suportada por todos os browser.
 Veremos os DTDs

Doctypes e Validadores – (x)HTML – Aula 29
 DTD – doctypes is mandatory
 Até o momento vimos a estrutura básica, sem o DTD
 A surpresa é que em xhtml devemos usar o doctype.

 Pra que serve o doctype? DTD – Document Type Definition
 É o conjunto de definições para o tipo que estamos construindo
 Informamos quais são as regras que devemos usar, ou seja, o tipo
de documento que quais são as regras pra validar o documento.

 Tipos de Validadores?
 Script
 Transitional
 FrameSet
 Acessar -> http://www.w3schools.com/html/html_intro.asp

 DTD é uma arquivo de validação
 Script
 DTD mais rigoroso, não permite usar atributos depreciados, construir xhtml
perfeitamente como manda a norma w3c (desenv. Profissional). Deve usar css externo...
 Transitional
 Dtd mais utilizado na web. Mais flexível, usa tag depreciadas e atributos também, usa-se
estilos dentro do html, é mais tranquilo para o desenvolvedor (
 FrameSet
 Validador para quem usa frames, (já esta em desuso) não deve ser usado, por isso não foi
visto nessas aulas. Frames comprometem acessibilidade do portal.
 Na prática os dois utilizados são script ou transitional. E a representação deles
nos vimos nos slides anteriores (também no site) Espero que nenhum aluno use
frameset. Como usá-los...

 Vamos criar uma arquivo usando um editor xhtml... Exemplo TopStyle5.0
 Observe que quando selecione xhtml 1.0 Transicional ele cria automaticamente o
DTD.... E também adicionou xmlns informando qual o tipo de arquivo....
 Observe também que é criado a estrutura básica do html. Crie um exemplo com
html5....

 Quando quer mudar as regras de validação eu altero o doctype isso em xhtml....
 Para exemplificar alterar nossa tag <p> eliminando o fechamento dela...
 Observe que mesmo com a falta da tag o navegador carregou a página e apresentou o
resultado (compensação). Esta correto?
 Se usarmos assim o código e não verificarmos a sintaxe correta, de nada adianta usar o
DTD. As ferramentas já possuem validador on-line use-o....
 Veja o resultado....
 Neste caso o validador irá acusar um erro na linha correspondente
 Também pode-se validar em... http://validator.w3.org/

 Faça todas as validações no W3C
 Código com 2 Worning(s)

 Considerações (padrão de encoding) mas o código passou...
 Sempre que vc estiver construindo passam pelos validadores.
 Agora vamos mudar o nosso DTD.... Para Script (profissionais
xhtml)

 Vamos mudar para o dtd Script....
 Podemos criar um documento novo com TopStyle e copiar o dtd
com o código html.
 Coloque outra tag <p>simples</p> dentro do paragrafo e teste...
 Na oportunidade de codificar em html, procurem ser exímios
programadores....

 Finalizando, se vcs usarem doctype procurem fazer a validação
do código de vcs, do contrário nem usem doctype.

Aula 28,29 e 30 w3 c, versões, html5

Mais conteúdo relacionado

Mais procurados

Destaque

Semelhante a Aula 28,29 e 30 w3 c, versões, html5

Mais de Jolvani Morgan

Aula 28,29 e 30 w3 c, versões, html5