Curso de HTML5 - Aula01
1 gostou1,725 visualizações
O documento fornece uma visão geral sobre HTML5, incluindo sua origem, a estrutura da web, e a função do W3C na definição de padrões web. Apresenta também uma introdução ao HTML e CSS, descrevendo tags básicas e a forma de integrá-los. O conteúdo é destinado a iniciantes na criação de páginas web, abordando elementos essenciais para a construção de sites.
Curso de HTML5 - Aula01
- 1. Curso de HTML5 Visão Geral sobre o HTML sábado, 21 de janeiro de 12
- 2. Conteúdo da Aula de Hoje O que é Web!? Como funciona a Web!? Quem é W3C e o que são padrões web!? (X)HTML CSS sábado, 21 de janeiro de 12
- 3. De onde vem a Web!? Criada por Tim Berners-Lee em 1989. Baseado no projeto ENQUIRE (1980), enquanto ele trabalhava na CERN. Seu intento original do sistema foi tornar mais fácil o compartilhamento de documentos de pesquisas entre os colegas. Também conhecida como World-Wide Web (WWW) é a parte multimídia da Internet, portanto possibilita a exibição de páginas de hipertexto, ou seja, texto em formato digital, documentos que podem conter todo o tipo de informação: textos, fotos, animações, trechos de vídeo e sons e programas e que permite conexões entre documentos (os links). sábado, 21 de janeiro de 12
- 4. Como funciona a Web!? A web consiste em um sistema cliente-servidor. ! A comunicação entre os clientes e servidores se dá através do protocolo HTTP: ! 1. Usuário digita uma URL navegador (browser) ou clica em um link; ! 2. Navegador envia a requisição até o servidor de web; ! 3. Servidor de web envia o conteúdo requisitado para o navegador; ! 4. O Navegador apresenta a informação para o usuário. sábado, 21 de janeiro de 12
- 5. Como funciona a Web!? sábado, 21 de janeiro de 12
- 6. W3C e os Padrões Web W3C (World Wide Web Consortium) é um consórcio de empresas de tecnologia. Fundado por Tim Berners-Lee em 1994 para levar a Web ao seu potencial máximo. Padrões Web ou Web Standards é um conjunto de recomendações, produzidos pelo W3C e destinados a orientar fabricantes, desenvolvedores e projetistas para o uso de práticas que possibilitem a criação de uma Web acessível a todos, independentemente dos dispositivos usados ou de suas necessidades sábado, 21 de janeiro de 12
- 7. O que é o HTML HTML é a abreviação para HyperText Markup Language, que pode ser traduzido como Linguagem de Marcação para Hipertexto. Compõe a estrutura de uma página Web através de etiquetas (tags) e atributos. sábado, 21 de janeiro de 12
- 8. O que é o HTML TAGs ou Marcadores Atributo das TAGs sábado, 21 de janeiro de 12
- 9. Tags básicas <html></html> - Define o começo e final de um documento HTML. <head></head> - Cabeçalho. Contém informação descritiva, como o título. <meta /> - Meta-Informação <title></title> - Título do documento. <body></body> - Corpo. Conteúdo da página. <div></div> - Divide página em seções lógicas. <ul></ul> - Inicia/termina Lista não ordenada; <li></li> - Item de lista padrão; <a href="X">Y<a> - Cria um hyperlink com o conteúdo; X é o endereço e Y o nome do endereço. img src="X" /> - Insere uma imagem, X é o nome ou diretório da imagem. <hX></hX> - Inicia um cabeçalho (Títulos), onde X varia de 1 até 6. Em escala descrescente. <p></p> - Inicia e finaliza um parágrafo. sábado, 21 de janeiro de 12
- 10. E esse (X)HTML O “X” aí empregado quer dizer que utilizaremos um HTML Extendido, ou seja um HTML como algo a mais, que nesse caso é o CSS. sábado, 21 de janeiro de 12
- 11. Mas o que é o CSS!? Cascading Style Sheets, em português Folhas de Estilo em Cascata, são documentos que descrevem de que forma o HTML deve ser apresentado. Contêm um conjunto de regras que descrevem o aspecto visual dos elementos (as tags) HTML. sábado, 21 de janeiro de 12
- 12. Css... mais detalhes... Sintaxe sábado, 21 de janeiro de 12
- 13. Css... mais detalhes... Uma classe define a variação de um estilo, o qual é referenciado através de uma ocorrência específica de um elemento utilizando o atributo class. No código de css é utilizado o símbolo “.” sábado, 21 de janeiro de 12
- 14. Css... mais detalhes... Pode-se atribuir um ID aos elementos e então associar estilos à este ID. Para declarar o estilo para um ID é usado o símbolo "#". sábado, 21 de janeiro de 12
- 15. Css... mais detalhes... Assim como em qualquer linguagem de programação, em CSS é possível adicionar comentários para melhor documentar o código. sábado, 21 de janeiro de 12
- 16. Não confundam!!! ! “(X)HTML para estruturar! ! e ! CSS para apresentar (formatação).” sábado, 21 de janeiro de 12
- 17. E como juntar o CSS com o HTML!? Primeira forma sábado, 21 de janeiro de 12
- 18. E como juntar o CSS com o HTML!? Segunda forma (+ utilizada) sábado, 21 de janeiro de 12
- 19. Referências dessa aula! @igorpimentel Site do W3C - você encontra toda a documentação online sobre html e css Wikipédia sábado, 21 de janeiro de 12
- 20. Mais sobre mim... Follow me os bons... @zarathon Facebook.com.br/zarathon www.zarathon.com.br (em breve online) sábado, 21 de janeiro de 12