Sobre o HTMLdiegOCuruma     Iniciando no desenvolvimento underground
HTMLIntrodução:HTML (HyperText Markup Language, que significa Linguagem de Marcação de Hipertexto) é uma linguagem de marc...
HTMLO pai da webTim Berners-Lee criou o HTML original, na época a linguagem não era uma  especificação, mas uma coleção de...
HTMLQuem mandaW3C é um consórcio internacional que agrega empresas, órgãos governamentais e organizações  independentes, e...
HTMLSemânticaO uso da TAG ao conteúdo com o significado real.
HTMLAcessibilidade e inclusãoAcessibilidade significa permitir que pessoas com deficiências ou mobilidade reduzida   parti...
HTMLUsabilidade deixando Fácil de usarUsabilidade é um termo usado para definir a facilidade com que as pessoas podem usar...
HTMLElementos Usando o htmlUma declarção DTD usualmente é chamada de "Doctype".Por que especificar um doctype?Porque ele d...
HTMLElementos Usando o htmlTipos:HTML 4.01 Transitional<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "htt...
HTMLElementos Usando htmlTagsLista de alguns elementos que podemos utilizar no nosso dia-a-dia  para trazer significado pa...
HTMLElementos usando tagsA - Define a ancora de um elemento.Abbr - Define uma abreviação.Acronym - Indica um acrônimo.Addr...
HTMLElementos usando tagsDfn - Define que certo texto é a definição de um termo.div, span - Div e Span definem a estrutura...
HTMLElementos usando tagsh1 .. h6 - Grupo de títulos definidos por importância, onde o H1 é o mais importante e o H6 o men...
HTMLValores, família e hierarquiaTodo documento HTML possui tags, tags são comandos de formatação da linguagem. Umelemento...
ELEMENTOSResponsabilidadesO reconhecimento do front está maior que no passado, antigamente nenhuma empresa dava atenção   ...
HTMLResponsabilidades1 - Planejamento do HTMLMapeamento dos elementos do layoutEstudo de SEO e semântica dos elementosEstr...
HTMLResponsabilidades2 - Planejamento do CSSEstudo de escalabilidade do CSSModularização dos arquivosNomenclatura de class...
HTMLResponsabilidades3 - Comportamento dos elementosDefinição do comportamento (junto ao designer)Criação e padrão de funç...
HTMLResponsabilidadesTambém podem haver processos posteriores: testes de funcionalidades, usabilidade, SEO,   otimização d...
HTMLFinalmenteNinguém pode chegar a lugar algum sem antes passar por aqui:http://www.maujor.com/w3ctuto/firstcss.htmlhttp:...
Sobre o html diegOCurumaVocê esta preparado pro underground?Se não puder se destacar pelo talento, vença pelo esforço. Dav...
Upcoming SlideShare
Loading in...5
×

Sobre o HTML

327

Published on

Sobre o HTML, iniciando o desenvolvimento underground!!!

Published in: Education
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
327
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
14
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Sobre o HTML

  1. 1. Sobre o HTMLdiegOCuruma Iniciando no desenvolvimento underground
  2. 2. HTMLIntrodução:HTML (HyperText Markup Language, que significa Linguagem de Marcação de Hipertexto) é uma linguagem de marcação utilizada para produzir páginas na Web.Wikipédia
  3. 3. HTMLO pai da webTim Berners-Lee criou o HTML original, na época a linguagem não era uma especificação, mas uma coleção de ferramentas para resolver um problema de Tim: a comunicação e disseminação das pesquisas entre ele e seu grupo de colegas. Sua solução, combinada com a então emergente internet pública (que tornaria-se a Internet) ganhou atenção mundial.Wikipédia
  4. 4. HTMLQuem mandaW3C é um consórcio internacional que agrega empresas, órgãos governamentais e organizações independentes, e que visa desenvolver padrões para a criação e a interpretação de conteúdos para a Web. Fundado pelo Tim Berners-Lee em 1994 para levar a Web ao seu potencial máximo.Sites desenvolvidos segundo esses padrões podem ser acessados e visualizados por qualquer pessoa ou tecnologia, independente dos hardware ou software utilizados, como celulares e compatível com os novos padrões e tecnologias que surgen com a evolução da internet.Padrões seus como HTML, XHTML e CSS são muito populares, contudo, em muitos casos são usados de forma errônea devido ao desconhecimento da especificação.É um dever de todo o desenvolvedor web respeitar e seguir os padrões de acessibilidade do W3C, pois de outro modo poderá impor barreiras tecnológicas a diversas pessoas, desestimulando e até mesmo impedindo o acesso a suas páginas.Wikipédia
  5. 5. HTMLSemânticaO uso da TAG ao conteúdo com o significado real.
  6. 6. HTMLAcessibilidade e inclusãoAcessibilidade significa permitir que pessoas com deficiências ou mobilidade reduzida participem de atividades que incluem o uso de produtos, serviços e informação, mas a inclusão e extensão do uso destes por todas as parcelas presentes em uma determinada população.Na internet o termo acessibilidade refere-se também as recomendações do w3c, que visam permitir que todos possam ter acesso ao websites independente de terem alguma deficiência ou não.Wikipédia
  7. 7. HTMLUsabilidade deixando Fácil de usarUsabilidade é um termo usado para definir a facilidade com que as pessoas podem usar uma ferramenta ou objeto para realizar uma tarefa específica.A usabilidade pode também se referir aos métodos de mensuração da usabilidade e ao estudo dos princípios por trás da eficiência percebida de um objeto.Wikipédia
  8. 8. HTMLElementos Usando o htmlUma declarção DTD usualmente é chamada de "Doctype".Por que especificar um doctype?Porque ele define qual é a versão do (X)HTML que o documento está usando e é uma informação importante para que os navegadores processem corretamente o documento.
  9. 9. HTMLElementos Usando o htmlTipos:HTML 4.01 Transitional<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">XHTML 1.0 Strict<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">O Strict é o rígido, você estará dizendo ao browser como renderizar ele, você está dizendo que seguirá os padrões.XHTML 1.0 Transitional<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1- transitional.dtd">Com esse você está dizendoao Browser que seu código está em transição, ele não seguirá rigorozamente os padrões.
  10. 10. HTMLElementos Usando htmlTagsLista de alguns elementos que podemos utilizar no nosso dia-a-dia para trazer significado para a informação dos sites:
  11. 11. HTMLElementos usando tagsA - Define a ancora de um elemento.Abbr - Define uma abreviação.Acronym - Indica um acrônimo.Address - A tag address é utilizada para conter informações de endereço e contatos.Blockquote - Blockquote define longos blocos de citação.Cite - Define uma citação ou referência a outra fonteCode - Define que aquele texto é um código.Tirados de um artigo do Tableless: http://tableless.com.br/html-5-semantica-e-o-que-e-importante-na-web/
  12. 12. HTMLElementos usando tagsDfn - Define que certo texto é a definição de um termo.div, span - Div e Span definem a estrutura dos elementos. Div é um elemento de bloco e Span um elemento de linha.dl, dd, dt - Listas de definição são feitas para criar um grupo de termos e definições. Muito usada para fazer glossários, dicionários ou entrevistas textuais.del, ins - INS é utilizado para mostrar que certo texto foi inserido e DEL define o texto que foi deletado da redação. Isso é bastante utilizado para corrigir artigos, textos e etc.Em - Como o strong, indica uma ênfase no texto.Tirados de um artigo do Tableless: http://tableless.com.br/html-5-semantica-e-o-que-e-importante-na-web/
  13. 13. HTMLElementos usando tagsh1 .. h6 - Grupo de títulos definidos por importância, onde o H1 é o mais importante e o H6 o menos importante.ul, ol, li - Listas ordenadas (OL) e listas não ordenadas (UL) são utilizadas para definir e criar listas de itens.P - Define um parágrafo.Q - Define uma citação ou reposta que não necessita de quebra de linha ou marcação de um parágrafo.Strong - Define uma ênfase, como o EM.Var - Indica uma instância de uma variavel ou argumento de programa.Tambem podemos trabalhar com a semântica com atributos. Alt, Title, classe, cite, id, lang, longdesc, rev, rel.Tirados de um artigo do Tableless: http://tableless.com.br/html-5-semantica-e-o-que-e-importante-na-web/
  14. 14. HTMLValores, família e hierarquiaTodo documento HTML possui tags, tags são comandos de formatação da linguagem. Umelemento é formado por um nome de tag, atributos, valores e filhos. Os atributos mudam osresultados padrões dos elementos e os valores caracterizam essa mudança.<ul> <li> <a href=”#” title=”Valores”>Exemplo</a> </li></ul>
  15. 15. ELEMENTOSResponsabilidadesO reconhecimento do front está maior que no passado, antigamente nenhuma empresa dava atenção pra esse setor infelizmente, mais muita coisa mudou desde então, muitos desenvolvedores aqui no brasil e fora estão lutando pelos padrões e pela qualidadeO crescimento do mercado fez as responsabilidades do desenvolvedor front-end mudar. As responsabilidades e tambem a estrutura da equipe que ele está. Ficando se parecendo com uma linha de montagem.O dev de client-side tem as seguintes responsabilidades na minha opinião do Diego Eis, criador do Tableless para disseminar os padrões web no Brasil.Tirados de um artigo do Tableless: http://tableless.com.br/responsabilidade-de-um-dev-client- side/comment-page-1/#comment-138488
  16. 16. HTMLResponsabilidades1 - Planejamento do HTMLMapeamento dos elementos do layoutEstudo de SEO e semântica dos elementosEstrutura do HTML padrãoOtimização do códigoTirados de um artigo do Tableless: http://tableless.com.br/responsabilidade-de-um-dev-client- side/comment-page-1/#comment-138488
  17. 17. HTMLResponsabilidades2 - Planejamento do CSSEstudo de escalabilidade do CSSModularização dos arquivosNomenclatura de classes e idsNomenclatura e padronização códigoOtimização do códigoTirados de um artigo do Tableless: http://tableless.com.br/responsabilidade-de-um-dev-client- side/comment-page-1/#comment-138488
  18. 18. HTMLResponsabilidades3 - Comportamento dos elementosDefinição do comportamento (junto ao designer)Criação e padrão de funções e aplicaçãoModularização dos arquivosTirados de um artigo do Tableless: http://tableless.com.br/responsabilidade-de-um-dev-client- side/comment-page-1/#comment-138488=
  19. 19. HTMLResponsabilidadesTambém podem haver processos posteriores: testes de funcionalidades, usabilidade, SEO, otimização de banco e código, migrações etc.Veja que dividimos basicamente alguns pontos relacionados às camadas de desenvolvimento: informação, formatação e comportamento. Lembrando que na camada de comportamento o dev client-side só precisa saber a manipulação de elementos. Não precisa aprender a programar profundamente em Javascript. Basta saber um pouco de JQuery ou outra biblioteca da linguagem.Tirados de um artigo do Tableless: http://tableless.com.br/responsabilidade-de-um-dev-client- side/comment-page-1/#comment-138488
  20. 20. HTMLFinalmenteNinguém pode chegar a lugar algum sem antes passar por aqui:http://www.maujor.com/w3ctuto/firstcss.htmlhttp://tableless.com.br/categoria/artigos/http://www.w3schools.com/
  21. 21. Sobre o html diegOCurumaVocê esta preparado pro underground?Se não puder se destacar pelo talento, vença pelo esforço. Dave EeinbaumFIM
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×