Agora podemos definitivamente dizer que a WEB pode ser poderosa sem aqueles milhões de plugins, única e flexivel afinal, esse conceito de aplicações na 'nuvem' é algo que pensando genericamente a WEB sempre fez.
Hoje vou mostrar algumas mudanças com o HTML5 criando um site básico vamos ainda manipular esse HTML com o Jquery aliado a definições da nossa folha de estilo o CSS.
Vou dar uma definição rápida de cada uma dessas 3 tecnologias que vamos utilizar:
HTML5
HTML5 é a linguagem de marcação que amplia de forma surpreendente as funcionalidades da HTML, alterando de maneira significativa como você desenvolve para a web. Trata-se da mais extensa especificação para a HTML focada em criar funcionalidades para desenvolvimento não só de sites, mas também de aplicações de internet rica (RIA).
(Maurício Samy Silva. HTML5 2011)
Jquery
jQuery é uma biblioteca JavaScript cross-browser desenvolvida para simplificar os scripts client side que interagem com o HTML. Ela foi lançada em janeiro de 2006 no BarCamp de Nova York por John Resig. Usada por cerca de 41% dos 10 mil sites mais visitados do mundo, jQuery é a mais popular das bibliotecas JavaScript.
CSS
Folha de estilo em cascata é um mecanismo simples para adicionar estilos (p.ex., fontes, cores, espaçamentos) aos documentos Web.
Se você não sabe nada sobre HTML então recomendo pesquisa um pouco antes de acompanhar meu POST ok?
Estrutura
A estrutura básica do HTML5 continua sendo a mesma das versões anteriores da linguagem, há apenas uma excessão na escrita do Doctype.
Segue abaixo a estrutura básica:
<!DOCTYPE HTML>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="estilo.css">
<title>CRIANDO UM SITE EM HTML5 COM PV</title>
</head>
<body>
<header>
CABECALHO... AINDA VAMOS TRABALHAR AQUI
RODAPE 2011
</html>
O Doctype
O Doctype deve ser a primeira linha de código do documento antes da tag HTML.
<!DOCTYPE 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.
A tag HTML você já conhece (ou deveria conhecer), agora o atributo LANG é necessário para que os user-agents saibam qual a linguagem principal do documento. Nosso caso pt-br:
<html lang="pt-br">
O Head tambem conhecemos é nele que fica a parte ‘inteligente’ do site, chamada css, metadados e onde a grande maioria faz a chamada JS (eu não). Só para deixar claro os metadados são informações sobre a página e o conteúdo ali publicado.
No nosso exemplo há uma metatag responsável por chavear qual tabela de caractéres a página está utilizando.
<meta charset="UTF-8">
Nas versões anteriores ao HTML5 essa tag era escrita dessa forma
meu IDE sempre fez automatico e em 5 anos nunca decorei e isso naturalmente me irritava.
Essa forma antiga não foi extinta no HTML5 ta? Contudo, é melhor que você utilize a nova forma.
Depois estamos chamando nossa folha de estilo CSS para formatar o site essa chamada todos estamos acostumados<link rel="stylesheet" type="text/css" href="estilo.css">Depois utilizamos a nova tag nativa do HTML5 que é o <header> atenção ele não vem com formatação pré-definida nem NADA mas é feito para uma divisão e padronização do código ok? Isso serve para o </footer> isso tudo ajuda em mecanismos de busca e claro padrão.
salve como aula1.html no próximo post vamos criar o layout e manipular o HTML com Jquery pois se eu centralizar tudo nesse post ele fica gigante!
Obrigado e até a próxima.
Hoje vou mostrar algumas mudanças com o HTML5 criando um site básico vamos ainda manipular esse HTML com o Jquery aliado a definições da nossa folha de estilo o CSS.
Vou dar uma definição rápida de cada uma dessas 3 tecnologias que vamos utilizar:
HTML5
HTML5 é a linguagem de marcação que amplia de forma surpreendente as funcionalidades da HTML, alterando de maneira significativa como você desenvolve para a web. Trata-se da mais extensa especificação para a HTML focada em criar funcionalidades para desenvolvimento não só de sites, mas também de aplicações de internet rica (RIA).
(Maurício Samy Silva. HTML5 2011)
Jquery
jQuery é uma biblioteca JavaScript cross-browser desenvolvida para simplificar os scripts client side que interagem com o HTML. Ela foi lançada em janeiro de 2006 no BarCamp de Nova York por John Resig. Usada por cerca de 41% dos 10 mil sites mais visitados do mundo, jQuery é a mais popular das bibliotecas JavaScript.
CSS
Folha de estilo em cascata é um mecanismo simples para adicionar estilos (p.ex., fontes, cores, espaçamentos) aos documentos Web.
Se você não sabe nada sobre HTML então recomendo pesquisa um pouco antes de acompanhar meu POST ok?
Estrutura
A estrutura básica do HTML5 continua sendo a mesma das versões anteriores da linguagem, há apenas uma excessão na escrita do Doctype.
Segue abaixo a estrutura básica:
<!DOCTYPE HTML>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="estilo.css">
<title>CRIANDO UM SITE EM HTML5 COM PV</title>
</head>
<body>
<header>
CABECALHO... AINDA VAMOS TRABALHAR AQUI
</header>
CONTEUDO DO MEU SITE
<footer> RODAPE 2011
</footer>
</body></html>
O Doctype
O Doctype deve ser a primeira linha de código do documento antes da tag HTML.
<!DOCTYPE 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.
A tag HTML você já conhece (ou deveria conhecer), agora o atributo LANG é necessário para que os user-agents saibam qual a linguagem principal do documento. Nosso caso pt-br:
<html lang="pt-br">
O Head tambem conhecemos é nele que fica a parte ‘inteligente’ do site, chamada css, metadados e onde a grande maioria faz a chamada JS (eu não). Só para deixar claro os metadados são informações sobre a página e o conteúdo ali publicado.
No nosso exemplo há uma metatag responsável por chavear qual tabela de caractéres a página está utilizando.
<meta charset="UTF-8">
Nas versões anteriores ao HTML5 essa tag era escrita dessa forma
meu IDE sempre fez automatico e em 5 anos nunca decorei e isso naturalmente me irritava.
Essa forma antiga não foi extinta no HTML5 ta? Contudo, é melhor que você utilize a nova forma.
Depois estamos chamando nossa folha de estilo CSS para formatar o site essa chamada todos estamos acostumados<link rel="stylesheet" type="text/css" href="estilo.css">Depois utilizamos a nova tag nativa do HTML5 que é o <header> atenção ele não vem com formatação pré-definida nem NADA mas é feito para uma divisão e padronização do código ok? Isso serve para o </footer> isso tudo ajuda em mecanismos de busca e claro padrão.
salve como aula1.html no próximo post vamos criar o layout e manipular o HTML com Jquery pois se eu centralizar tudo nesse post ele fica gigante!
Obrigado e até a próxima.
AMIGO TO PRECISANDO DE UMA AJUDA EM HTML5 E JQUERY, COMO EU FAÇO PANO DE FUNDO DA PÁGINA, EXEMPLO, TENHO BACKGROUND E COLOCO LÁ, EXEMPLO DE PÁGINA: olha fundo dessa página abaixo..
ResponderExcluirhttp://www.mba-multimedia.com/
email/msn:pioedisp@hotmail.com