SlideShare uma empresa Scribd logo
1 de 21
Baixar para ler offline
• Hipertext Markup Language
• Linguagem de marcação de texto;
• Desde 1996 vêm sendo mantida pela World Wide Web Consortium (W3C);
• Utilizada na confecção de sites;
• São “rótulos” (tags) que marcam trechos e blocos de texto;
• Utilizados por um visualizador HTML (navegador) para formatar e apresentar o texto na
tela;
• O HTML é escrito em texto plano, ou seja, pode ser escrito em qualquer editor de textos.
• A representação dos elementos do HTML nas páginas de internet se dá através de
marcações ou rótulos (tags);
• O HTML não é case sensitive, ou seja, não há diferença entre letras maiúsculas ou
minúscula na representação dos elementos;
• O navegador interpreta como sendo uma tag todos os elementos HTML válidos que
estejam entre os símbolos < e >.
<br> = <BR>
• <BR> é uma tag válida que determinará uma quebra de linha em um texto;
• <CHTRU> não é uma tag válida, é ignorada o que fará com que nada seja exibido na tela;
• Mesmo não exibindo as tags inválidas não se deve utilizar desta opção como uma
maneira de ocultar conteúdo em um documento elaborado através do HTML;
• Existem marcações específicas para comentários em HTML. São elas, <!-- e -->.
• A maioria dos elementos no HTML possuem um rótulo inicial e um final, envolvendo o
texto ou elemento a ser marcado por eles:
• Os marcadores de início e final geralmente possuem o mesmo nome se diferenciando
apenas pela / (barra) no finalizador.
<!-- Exemplo de comentário HTML -->
<elemento> texto a ser marcado </elemento>
index.html
• <HTML> </HTML>
– Marca o início e o fim do documento HTML;
– Deve possuir estruturas internas distintas como um cabeçalho, um título e um corpo.
• <HEAD> </HEAD>
– Marca o início e o fim de cabeçalho;
– Não possui informações que serão exibidas na página;
– Pode conter informações acerca do documento com fins de indexação e organização.
• <TITLE> </TITLE>
Único elemento obrigatório no cabeçalho;
Esta tag delimita o texto que irá ser visualizado na barra de título do visualizador;
Não deve ser excessivamente longo, mas deve conter certa representatividade;
• Exemplo de um bom título:
<TITLE>Tutorial sobre HTML: Introdução</TITLE>
• Exemplos de títulos não aconselhados:
<TITLE>Introdução</TITLE>
<TITLE>Introdução ao HTML abrangendo recursos de listas, tabelas, ... Blá blá
blá...</TITLE>
• <BODY> </BODY>
Esta tag delimita o corpo do programa, aonde a maior parte dos elementos serão inseridos;
Com exceção de <TITLE>, que fica inserido na seção <HEAD> (cabeçalho), todos os
elementos que serão vistos a partir de agora serão inseridos na seção de corpo do
documento, ou seja, na seção <BODY>.
Não há diferença entre <br> e <BR>.
Porém, a maneira correta de escrever é em letras minúsculas, sempre escreva
assim: <br>
Navegador
Sistema Operacional
Resolução
Resolução Maior
Navegador
Sistema Operacional
2015 Win10 Win8 Win7 Vista NT* WinXP Linux Mac Mobile
November 14.1% 16.9% 45.2% 0.5% 0.1% 2.2% 5.4% 10.6% 5.0%
October 12.6% 17.3% 46.2% 0.5% 0.1% 2.4% 5.4% 10.4% 5.0%
September 10.6% 18.0% 47.6% 0.5% 0.1% 2.7% 5.6% 10.0% 5.0%
August 3.5% 19.4% 47.2% 1.2% 0.3% 3.6% 5.4% 10.9% 5.0%
July 23.1% 48.6% 1.4% 0.1% 4.0% 5.6% 11.4% 5.0%
June 23.3% 50.7% 0.7% 0.1% 3.4% 5.9% 9.9% 5.4%
May 23.5% 51.1% 0.7% 0.1% 3.3% 5.5% 10.2% 5.4%
April 22.8% 52.1% 0.7% 0.1% 3.6% 5.2% 10.2% 5.0%
March 22.2% 52.3% 0.7% 0.1% 4.1% 5.3% 10.1% 5.0%
February 21.3% 52.5% 0.8% 0.1% 4.5% 5.4% 10.1% 5.0%
January 21.0% 52.8% 0.8% 0.1% 4.7% 5.5% 9.8% 5.0%
Resolução
Date Other high 1920x1080 1366x768 1280x1024 1280x800 1024x768 800x600 Lower
January 2015 32.7% 16% 33% 7% 5% 4% 0.3% 2%
January 2014 34% 13% 31% 8% 7% 6% 0.5% 0.5%
January 2013 36% 11% 25% 10% 8% 9% 0.5% 0.5%
January 2012 35% 8% 19% 12% 11% 13% 1% 1%
January 2011 50% 6% 15% 14% 14% 0% 1%
January 2010 39% 2% 18% 17% 20% 1% 3%
January 2009 57% 36% 4% 3%
January 2008 38% 48% 8% 6%
January 2007 26% 54% 14% 6%
January 2006 17% 57% 20% 6%
January 2005 12% 53% 30% 5%
Navegador
Sistema Operacional
Resolução
Resolução Maior
+1920x1080
-800x600
• A História do HTML (http://www.frontendbrasil.com.br/artigos/a-historia-do-html/)
• HTML5 (https://en.wikipedia.org/wiki/HTML5)
• HTML (https://en.wikipedia.org/wiki/HTML)
• W3Schools (http://www.w3schools.com)

Mais conteúdo relacionado

Mais procurados (20)

Html e css
Html e cssHtml e css
Html e css
 
Html5 - Estrutura Básica
Html5 - Estrutura BásicaHtml5 - Estrutura Básica
Html5 - Estrutura Básica
 
HTML
HTMLHTML
HTML
 
Curso HTML, CSS e JavaScript
Curso HTML, CSS e JavaScriptCurso HTML, CSS e JavaScript
Curso HTML, CSS e JavaScript
 
HTML - HyperText Markup Language - Review
HTML - HyperText Markup Language - ReviewHTML - HyperText Markup Language - Review
HTML - HyperText Markup Language - Review
 
Introdução ao CSS
Introdução ao CSSIntrodução ao CSS
Introdução ao CSS
 
Aula 02
Aula 02Aula 02
Aula 02
 
Aula 03
Aula 03Aula 03
Aula 03
 
Trabalho jQuery
Trabalho jQueryTrabalho jQuery
Trabalho jQuery
 
Aula 2 – Introdução a HTML - conceitos básicos e estrutura
Aula 2 – Introdução a HTML - conceitos básicos e estruturaAula 2 – Introdução a HTML - conceitos básicos e estrutura
Aula 2 – Introdução a HTML - conceitos básicos e estrutura
 
Aula 07
Aula 07Aula 07
Aula 07
 
Aula 1 linguagem html (1)
Aula 1   linguagem html (1)Aula 1   linguagem html (1)
Aula 1 linguagem html (1)
 
Aula 05
Aula 05Aula 05
Aula 05
 
Introdução ao HTML
Introdução ao HTML Introdução ao HTML
Introdução ao HTML
 
Aula 04
Aula 04Aula 04
Aula 04
 
Meu primeiro tema de WordPress
Meu primeiro tema de WordPressMeu primeiro tema de WordPress
Meu primeiro tema de WordPress
 
Construindo layout de sites com CSS
Construindo layout de sites com CSSConstruindo layout de sites com CSS
Construindo layout de sites com CSS
 
Aula 07
Aula 07Aula 07
Aula 07
 
Padroes Web
Padroes WebPadroes Web
Padroes Web
 
Aula 06
Aula 06Aula 06
Aula 06
 

Semelhante a HTML - HyperText Markup Language - 1

Semelhante a HTML - HyperText Markup Language - 1 (20)

Mini curso html5 slides
Mini curso html5   slidesMini curso html5   slides
Mini curso html5 slides
 
Xhtml 2011 - atualizado
Xhtml   2011 - atualizadoXhtml   2011 - atualizado
Xhtml 2011 - atualizado
 
Apresentação do Curso Primeiros Passos na Web com HTML e CSS - Profite e Univ...
Apresentação do Curso Primeiros Passos na Web com HTML e CSS - Profite e Univ...Apresentação do Curso Primeiros Passos na Web com HTML e CSS - Profite e Univ...
Apresentação do Curso Primeiros Passos na Web com HTML e CSS - Profite e Univ...
 
Introdução ao HTML e CSS
Introdução ao HTML e CSSIntrodução ao HTML e CSS
Introdução ao HTML e CSS
 
Html5 - Notas de aula
Html5 - Notas de aulaHtml5 - Notas de aula
Html5 - Notas de aula
 
Curso HTML e CSS Part1
Curso HTML e CSS Part1Curso HTML e CSS Part1
Curso HTML e CSS Part1
 
Html5 em 15_minutos
Html5 em 15_minutosHtml5 em 15_minutos
Html5 em 15_minutos
 
Revisão HTML, CSS e BOOTSTRAP - Professor Franciosney
Revisão HTML, CSS e BOOTSTRAP - Professor FranciosneyRevisão HTML, CSS e BOOTSTRAP - Professor Franciosney
Revisão HTML, CSS e BOOTSTRAP - Professor Franciosney
 
Apostila html,xhtml e css
Apostila html,xhtml e cssApostila html,xhtml e css
Apostila html,xhtml e css
 
Academia Verão 2011 - HTML
Academia Verão 2011 - HTMLAcademia Verão 2011 - HTML
Academia Verão 2011 - HTML
 
Academia verao 2011 - HTML + CSS
Academia verao 2011 - HTML + CSSAcademia verao 2011 - HTML + CSS
Academia verao 2011 - HTML + CSS
 
Apostila html,xhtml e css
Apostila html,xhtml e cssApostila html,xhtml e css
Apostila html,xhtml e css
 
2 html,xhtml e css
2   html,xhtml e css2   html,xhtml e css
2 html,xhtml e css
 
Web design
Web designWeb design
Web design
 
Apostila html,xhtml e css
Apostila html,xhtml e cssApostila html,xhtml e css
Apostila html,xhtml e css
 
HTML Básico 2
HTML Básico 2HTML Básico 2
HTML Básico 2
 
Html
HtmlHtml
Html
 
Html slide
Html slideHtml slide
Html slide
 
Html5 em 15 minutos
Html5 em 15 minutosHtml5 em 15 minutos
Html5 em 15 minutos
 
AULA 01 - Conceitos de HTML.pptx
AULA 01 - Conceitos de HTML.pptxAULA 01 - Conceitos de HTML.pptx
AULA 01 - Conceitos de HTML.pptx
 

Mais de Israel Messias

Programação Multiplataforma em Ambiente Web
Programação Multiplataforma em Ambiente WebProgramação Multiplataforma em Ambiente Web
Programação Multiplataforma em Ambiente WebIsrael Messias
 
Programação Orientada a Objetos (POO) com PHP - Parte 2
Programação Orientada a Objetos (POO) com PHP - Parte 2Programação Orientada a Objetos (POO) com PHP - Parte 2
Programação Orientada a Objetos (POO) com PHP - Parte 2Israel Messias
 
Programação Orientada a Objetos (POO) com PHP - Parte 1
Programação Orientada a Objetos (POO) com PHP - Parte 1Programação Orientada a Objetos (POO) com PHP - Parte 1
Programação Orientada a Objetos (POO) com PHP - Parte 1Israel Messias
 
Arquitetura Cliente-Servidor - Modelos
Arquitetura Cliente-Servidor - ModelosArquitetura Cliente-Servidor - Modelos
Arquitetura Cliente-Servidor - ModelosIsrael Messias
 
Arquitetura Cliente-Servidor
Arquitetura Cliente-ServidorArquitetura Cliente-Servidor
Arquitetura Cliente-ServidorIsrael Messias
 
Arquitetura Cliente-Servidor - Banco de dados
Arquitetura Cliente-Servidor - Banco de dadosArquitetura Cliente-Servidor - Banco de dados
Arquitetura Cliente-Servidor - Banco de dadosIsrael Messias
 
Ferramentas para Animações de Sites - Canvas
Ferramentas para Animações de Sites - CanvasFerramentas para Animações de Sites - Canvas
Ferramentas para Animações de Sites - CanvasIsrael Messias
 
Ferramentas para Animações de Sites - Áudio
Ferramentas para Animações de Sites - ÁudioFerramentas para Animações de Sites - Áudio
Ferramentas para Animações de Sites - ÁudioIsrael Messias
 
CSS - Cascading Style Sheets - Medidas
CSS - Cascading Style Sheets - MedidasCSS - Cascading Style Sheets - Medidas
CSS - Cascading Style Sheets - MedidasIsrael Messias
 
CSS - Cascading Style Sheets - Revisão
CSS - Cascading Style Sheets - RevisãoCSS - Cascading Style Sheets - Revisão
CSS - Cascading Style Sheets - RevisãoIsrael Messias
 
CSS - Cascading Style Sheets - 2
CSS - Cascading Style Sheets - 2CSS - Cascading Style Sheets - 2
CSS - Cascading Style Sheets - 2Israel Messias
 
CSS - Cascading Style Sheets - 1
CSS - Cascading Style Sheets - 1CSS - Cascading Style Sheets - 1
CSS - Cascading Style Sheets - 1Israel Messias
 
HTML - HyperText Markup Language - FTP
HTML - HyperText Markup Language - FTPHTML - HyperText Markup Language - FTP
HTML - HyperText Markup Language - FTPIsrael Messias
 
HTML - HyperText Markup Language - Organização de arquivos
HTML - HyperText Markup Language - Organização de arquivosHTML - HyperText Markup Language - Organização de arquivos
HTML - HyperText Markup Language - Organização de arquivosIsrael Messias
 
HTML - HyperText Markup Language - Formulário
HTML - HyperText Markup Language - FormulárioHTML - HyperText Markup Language - Formulário
HTML - HyperText Markup Language - FormulárioIsrael Messias
 
HTML - HyperText Markup Language - 4 - Review
HTML - HyperText Markup Language - 4 - Review HTML - HyperText Markup Language - 4 - Review
HTML - HyperText Markup Language - 4 - Review Israel Messias
 
HTML - HyperText Markup Language - HTML5
HTML - HyperText Markup Language - HTML5HTML - HyperText Markup Language - HTML5
HTML - HyperText Markup Language - HTML5Israel Messias
 
HTML - HyperText Markup Language - Introdução
HTML - HyperText Markup Language - IntroduçãoHTML - HyperText Markup Language - Introdução
HTML - HyperText Markup Language - IntroduçãoIsrael Messias
 

Mais de Israel Messias (20)

CMS
CMSCMS
CMS
 
Programação Multiplataforma em Ambiente Web
Programação Multiplataforma em Ambiente WebProgramação Multiplataforma em Ambiente Web
Programação Multiplataforma em Ambiente Web
 
Programação Orientada a Objetos (POO) com PHP - Parte 2
Programação Orientada a Objetos (POO) com PHP - Parte 2Programação Orientada a Objetos (POO) com PHP - Parte 2
Programação Orientada a Objetos (POO) com PHP - Parte 2
 
Programação Orientada a Objetos (POO) com PHP - Parte 1
Programação Orientada a Objetos (POO) com PHP - Parte 1Programação Orientada a Objetos (POO) com PHP - Parte 1
Programação Orientada a Objetos (POO) com PHP - Parte 1
 
Websockets
WebsocketsWebsockets
Websockets
 
Arquitetura Cliente-Servidor - Modelos
Arquitetura Cliente-Servidor - ModelosArquitetura Cliente-Servidor - Modelos
Arquitetura Cliente-Servidor - Modelos
 
Arquitetura Cliente-Servidor
Arquitetura Cliente-ServidorArquitetura Cliente-Servidor
Arquitetura Cliente-Servidor
 
Arquitetura Cliente-Servidor - Banco de dados
Arquitetura Cliente-Servidor - Banco de dadosArquitetura Cliente-Servidor - Banco de dados
Arquitetura Cliente-Servidor - Banco de dados
 
Ferramentas para Animações de Sites - Canvas
Ferramentas para Animações de Sites - CanvasFerramentas para Animações de Sites - Canvas
Ferramentas para Animações de Sites - Canvas
 
Ferramentas para Animações de Sites - Áudio
Ferramentas para Animações de Sites - ÁudioFerramentas para Animações de Sites - Áudio
Ferramentas para Animações de Sites - Áudio
 
CSS - Cascading Style Sheets - Medidas
CSS - Cascading Style Sheets - MedidasCSS - Cascading Style Sheets - Medidas
CSS - Cascading Style Sheets - Medidas
 
CSS - Cascading Style Sheets - Revisão
CSS - Cascading Style Sheets - RevisãoCSS - Cascading Style Sheets - Revisão
CSS - Cascading Style Sheets - Revisão
 
CSS - Cascading Style Sheets - 2
CSS - Cascading Style Sheets - 2CSS - Cascading Style Sheets - 2
CSS - Cascading Style Sheets - 2
 
CSS - Cascading Style Sheets - 1
CSS - Cascading Style Sheets - 1CSS - Cascading Style Sheets - 1
CSS - Cascading Style Sheets - 1
 
HTML - HyperText Markup Language - FTP
HTML - HyperText Markup Language - FTPHTML - HyperText Markup Language - FTP
HTML - HyperText Markup Language - FTP
 
HTML - HyperText Markup Language - Organização de arquivos
HTML - HyperText Markup Language - Organização de arquivosHTML - HyperText Markup Language - Organização de arquivos
HTML - HyperText Markup Language - Organização de arquivos
 
HTML - HyperText Markup Language - Formulário
HTML - HyperText Markup Language - FormulárioHTML - HyperText Markup Language - Formulário
HTML - HyperText Markup Language - Formulário
 
HTML - HyperText Markup Language - 4 - Review
HTML - HyperText Markup Language - 4 - Review HTML - HyperText Markup Language - 4 - Review
HTML - HyperText Markup Language - 4 - Review
 
HTML - HyperText Markup Language - HTML5
HTML - HyperText Markup Language - HTML5HTML - HyperText Markup Language - HTML5
HTML - HyperText Markup Language - HTML5
 
HTML - HyperText Markup Language - Introdução
HTML - HyperText Markup Language - IntroduçãoHTML - HyperText Markup Language - Introdução
HTML - HyperText Markup Language - Introdução
 

HTML - HyperText Markup Language - 1

  • 1.
  • 2.
  • 3.
  • 4. • Hipertext Markup Language • Linguagem de marcação de texto; • Desde 1996 vêm sendo mantida pela World Wide Web Consortium (W3C); • Utilizada na confecção de sites; • São “rótulos” (tags) que marcam trechos e blocos de texto; • Utilizados por um visualizador HTML (navegador) para formatar e apresentar o texto na tela; • O HTML é escrito em texto plano, ou seja, pode ser escrito em qualquer editor de textos.
  • 5.
  • 6.
  • 7. • A representação dos elementos do HTML nas páginas de internet se dá através de marcações ou rótulos (tags); • O HTML não é case sensitive, ou seja, não há diferença entre letras maiúsculas ou minúscula na representação dos elementos; • O navegador interpreta como sendo uma tag todos os elementos HTML válidos que estejam entre os símbolos < e >. <br> = <BR>
  • 8. • <BR> é uma tag válida que determinará uma quebra de linha em um texto; • <CHTRU> não é uma tag válida, é ignorada o que fará com que nada seja exibido na tela; • Mesmo não exibindo as tags inválidas não se deve utilizar desta opção como uma maneira de ocultar conteúdo em um documento elaborado através do HTML;
  • 9. • Existem marcações específicas para comentários em HTML. São elas, <!-- e -->. • A maioria dos elementos no HTML possuem um rótulo inicial e um final, envolvendo o texto ou elemento a ser marcado por eles: • Os marcadores de início e final geralmente possuem o mesmo nome se diferenciando apenas pela / (barra) no finalizador. <!-- Exemplo de comentário HTML --> <elemento> texto a ser marcado </elemento>
  • 11.
  • 12. • <HTML> </HTML> – Marca o início e o fim do documento HTML; – Deve possuir estruturas internas distintas como um cabeçalho, um título e um corpo. • <HEAD> </HEAD> – Marca o início e o fim de cabeçalho; – Não possui informações que serão exibidas na página; – Pode conter informações acerca do documento com fins de indexação e organização.
  • 13. • <TITLE> </TITLE> Único elemento obrigatório no cabeçalho; Esta tag delimita o texto que irá ser visualizado na barra de título do visualizador; Não deve ser excessivamente longo, mas deve conter certa representatividade; • Exemplo de um bom título: <TITLE>Tutorial sobre HTML: Introdução</TITLE> • Exemplos de títulos não aconselhados: <TITLE>Introdução</TITLE> <TITLE>Introdução ao HTML abrangendo recursos de listas, tabelas, ... Blá blá blá...</TITLE>
  • 14. • <BODY> </BODY> Esta tag delimita o corpo do programa, aonde a maior parte dos elementos serão inseridos; Com exceção de <TITLE>, que fica inserido na seção <HEAD> (cabeçalho), todos os elementos que serão vistos a partir de agora serão inseridos na seção de corpo do documento, ou seja, na seção <BODY>.
  • 15. Não há diferença entre <br> e <BR>. Porém, a maneira correta de escrever é em letras minúsculas, sempre escreva assim: <br>
  • 18. Sistema Operacional 2015 Win10 Win8 Win7 Vista NT* WinXP Linux Mac Mobile November 14.1% 16.9% 45.2% 0.5% 0.1% 2.2% 5.4% 10.6% 5.0% October 12.6% 17.3% 46.2% 0.5% 0.1% 2.4% 5.4% 10.4% 5.0% September 10.6% 18.0% 47.6% 0.5% 0.1% 2.7% 5.6% 10.0% 5.0% August 3.5% 19.4% 47.2% 1.2% 0.3% 3.6% 5.4% 10.9% 5.0% July 23.1% 48.6% 1.4% 0.1% 4.0% 5.6% 11.4% 5.0% June 23.3% 50.7% 0.7% 0.1% 3.4% 5.9% 9.9% 5.4% May 23.5% 51.1% 0.7% 0.1% 3.3% 5.5% 10.2% 5.4% April 22.8% 52.1% 0.7% 0.1% 3.6% 5.2% 10.2% 5.0% March 22.2% 52.3% 0.7% 0.1% 4.1% 5.3% 10.1% 5.0% February 21.3% 52.5% 0.8% 0.1% 4.5% 5.4% 10.1% 5.0% January 21.0% 52.8% 0.8% 0.1% 4.7% 5.5% 9.8% 5.0%
  • 19. Resolução Date Other high 1920x1080 1366x768 1280x1024 1280x800 1024x768 800x600 Lower January 2015 32.7% 16% 33% 7% 5% 4% 0.3% 2% January 2014 34% 13% 31% 8% 7% 6% 0.5% 0.5% January 2013 36% 11% 25% 10% 8% 9% 0.5% 0.5% January 2012 35% 8% 19% 12% 11% 13% 1% 1% January 2011 50% 6% 15% 14% 14% 0% 1% January 2010 39% 2% 18% 17% 20% 1% 3% January 2009 57% 36% 4% 3% January 2008 38% 48% 8% 6% January 2007 26% 54% 14% 6% January 2006 17% 57% 20% 6% January 2005 12% 53% 30% 5%
  • 21. • A História do HTML (http://www.frontendbrasil.com.br/artigos/a-historia-do-html/) • HTML5 (https://en.wikipedia.org/wiki/HTML5) • HTML (https://en.wikipedia.org/wiki/HTML) • W3Schools (http://www.w3schools.com)