html, css e java script - renato araujo

HTML, CSS e JavaScript BREVE INTRODUÇÃO Nome: Renato Araujo E-mail: orenatoaraujoj@gmail.com Linkedin: https://br.linkedin.com/in/orenatoaraujo Facebook: https://www.facebook.com/renato.araujo.jesus

HTML  A principal linguagem para criação de páginas Web  Sigla do inglês: HyperText Markup Language  O que é uma linguagem de marcação de texto?

HTML (criador)  Tim Berners-Lee  Criou a linguagem com o objetivo de poder se comunicar e compartilhar informações com outros pesquisadores  É usada até hoje para compartilhas informações e etc.

HTML (evolução)  A primeira versão oficial foi lançada em 1993 sendo padronizada pelo IETF  Foi mantida pelo CERN e IETF até 1995  Em 1995 é criado o World Wide Web Consortium (W3C) para controlar os padrões web  Em 2001 é lançado a primeira versão do XHTML

WHATWG  Web Hypertext Application Technology Working Group – WHATWG  WHATWG x W3C  WHATWG e W3C  HTML5

HTML5  Revolucionou a Web porque?  Novas tags  Melhorou ainda mais a semântica  Exemplo resultado do Google  Menos código para DTD (ver próximo slide)

Diferença de DTD de HTML e HTML5

HTML e HTML5 algumas tags  <div></div>  <p></p>  <span></span>  <canvas />  <header></header>  <nav></nav>  <section></section>  Entre outras.

HTML boas práticas  Verificar sempre se o elemento ou atributo usado está obsoleto para a versão atual  Verificar o contexto em que a tag esta  Verificar sempre a sintaxe e a semântica  https://validator.w3.org/

CSS  Cascading Style Sheet  Linguagem de estilo da Web  Porque se chama Cascading Style Sheet?

CSS (evolução)  Foi idealizado em 1995  Primeira versão lançada em 1996 já pela W3C  CSS1 (básico)  CSS2 (pseudo-elementos e Pseudo- classes)  CSS3 (media queries, animações, transições e transformações e etc.)

CSS (como escrever)  Regra CSS  seletor {propriedade: valor}  Seletor (elemento, classe ou id)  Propriedade (atributo: margin, padding, etc)  Valor (característica especifica: fonte do tipo Arial, largura de 10 pixel)

CSS (como adicionar no HTML)  Existem 3 (três) formas:  inline  dentro da head  arquivo externo

CSS (exemplo dentro da tag head)

CSS (exemplo de arquivo externo)

CSS (boa práticas)  Evite usar a CSS dentro da tag head e inline  Prefira o arquivo externo  Entenda para que serve a propriedade  Entenda a precedência dos seletores

JavaScript  Linguagem de script client-side  Mas hoje em dia também do lado do servidor (server-side) com NodeJS

JavaScript (criador)  Brendan Eich

JavaScript (confusão com Java)  JavaScript não é Java  O nome se deu pelo fato da Sun ajudar a Netscape em alguns detalhes da liguagem  Que no fim foi apenas uma jogada de marketing entre a união da Sun e Netscape

JavaScript (padronização)  JavaScript é padronizado pela Ecma International sob o nome de ECMAScript desde 1996  Especificação do JavaScript é o ECMA-262 (http://www.ecma- international.org/publications/files/EC MA-ST/Ecma-262.pdf)

JavaScript (uso e aplicação)  Antigamento o JavaScript era usado apenas para válidar formulário e trocar imagens quando colocava e tirava o mouse de cima (hover)  Hoje em dia o JavaScript é usado para criar uma web mais rica e responsiva

JavaScript (características e dificuldades)  Tipo dinâmico (loser type)  Funções de primeira classe (First-class Function)  Funções aninhadas (Nested Functions)  Fechamentos (Closure)  Funções de Retorno (callback)  Escopo da variável e escopo léxico  Baseada em protótipo (prototype)

JavaScript (características e dificuldades)  Baseada em objetos e não orientada a objetos  Mas é possível simular características OO, como: encapsulamento, herança, interface e design patterns

JavaScript (DOM)  Através do JavaScript é possível manipular os elementos HTML  Criar eventos  mouse, temporização, carregamento, fechamento, etc.

JavaScript (AJAX)  Asynchronous JavaScript e XML  Uso do XMLHttpRequest  Faz requisições sem a necessidade de atualizar a página  Pode enviar e receber informações no formatos: JSON, XML, HTML e TEXT

Sites para aprender  http://tableless.com.br/  https://css-tricks.com/  https://developer.mozilla.org/pt-BR/  http://www.w3.org/  http://www.smashingmagazine.com/  http://www.maujor.com/index.php

Contatos  Nome: Renato Araujo  E-mail: orenatoaraujoj@gmail.com  Linkedin: https://br.linkedin.com/in/orenatoaraujo  Facebook: https://www.facebook.com/renato.araujo.jesus

html, css e java script - renato araujo

Mais conteúdo relacionado

Mais procurados

Destaque

Semelhante a html, css e java script - renato araujo

html, css e java script - renato araujo