• URL – http://www.sc.senac.br/2016/ead.html • http – protocolo • www.sc.senac.br – nome de domínio – (registro.br) • 2016 – caminho • ead.html – arquivo
• HTTP - Hypertext Transfer Protocol (Protocolo de Transferência de Hipertexto)
• Métodos HTTP (request - solicitação) • GET – (Padrão) Solicita um recurso. Os dados são transferidos pela URL mesmo. • POST – na transferência com este método os dados são codificados. • HEAD – retoma a linha de resposta e os cabeçalhos de resposta. • PUT/PATCH – permite que documentos/recursos sejam transferidos e armazenados. • DELETE – permite que documentos/recursos sejam excluídos. • OPTIONS - permite fazer uma consulta de quais comandos estão disponíveis. • TRACE - permite depurar as requisições, devolvendo o cabeçalho de um documento.
• Métodos HTTP (response - resposta) • 200 (OK) – significa que a confirmação da requisição foi respondida com sucesso. • 304 (NOT MODIFIED) – informa que os recursos não foram alterados desde a última vez que foi solicitada. Isso ocorre por causa dos mecanismos de “cache” do browser. • 401 (UNAUTHORIZED) – significa que o cliente não tem acesso autorizado para acessar a área requisitada. • 403 (FORBIDDEN) – informa que o acesso à área requisitada falhou. • 404 (NOT FOUND) - Não encontrado.
• 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 (conteúdo) </elemento>
Não há diferença entre <br> e <BR>. Porém, a maneira correta de escrever é em letras minúsculas, sempre escreva assim: <br>
• Esta declaração deve ser a primeira coisa em seu documento HTML, antes da tag <html>. • O <! DOCTYPE> declaração não é uma tag HTML; é uma instrução para o navegador da web sobre qual versão do HTML da página é escrito. <!DOCTYPE HTML>
<div class="titulo-maior"></div> class: pode-se repetir no html
<div id="titulo-cabecalho"></div> id: é único em todo html
<img src="imagem.jpg">
<tag atributo="valor"> <img src="imagem.jpg"> <tag atributo="valor">Texto</tag>
<a></a> <html></html> <head></head> <title></title> <body></body> <meta> <h1></h1> - <h6></h6> <p></p> <br> <hr> <ul></ul> <li></li> <ol></ol>
<img> <table></table> <tr><td></td></tr> <pre></pre> <blockquote></blockquote> <address></address> <cite></cite> <code></code> <em></em>
<strong></strong> <i></i> <b></b> <u></u> <strike></strike> <big></big> <small></small> <sub></sub> <sup></sup> <font></font> <div></div> <span></span>
<title><h2><center>titulo<h2><center></title> <div class="Bem Vindo"></div> file:///F:/html/index2.html / file:///F:/html/imagem Sem Título-3.jpg
<form> Atributos • method – método HTTP de envio das informações (POST / GET) • action – endereço a serem enviados os dados - # • enctype - multipart/form-data – para envio de arquivos <form method="#" action="POST">
<input> Tipo de dado Tipo de campo text Texto radio Opção, seleção única checkbox Opção, seleção múltipla file Arquivo hidden Oculto password Senha Tipo de dado Tipo de campo color Seleção de cor date Data datetime Data e Hora month Mês email E-mail number Número range Intervalo numérico search Busca tel Telefone time Hora url URL week Semana
<form></form> <input></input> <textarea></ textarea> <button></button> <select></select> <label></label> <input type="text" value="Campo" required>
- _docs – Documentos relacionados ao projeto (docs, imagens, briefing) - _layout – Layout do projeto (html / imagem) - _sql – Arquivo de banco de dados
- css – Cascading Style Sheet (.css) - fonts – fontes utilizadas no site / ícones (.ttf, woff, svg, woff2, .otf) - img – imagens estáticas utilizadas no layout do site (.png, jpg, .gif, .svg) - js – Scripts Javascript (.js) index.html favicon.ico
HTTP FTP
Arquivos sendo enviados e recebidos FileZilla Client Computador RemotoComputador Local Dados e log da conexão
• História da Internet (https://pt.wikipedia.org/wiki/História_da_Internet) • Internet (https://pt.wikipedia.org/wiki/Internet) • E-mail (https://pt.wikipedia.org/wiki/E-mail) • História da Internet no Brasil (https://pt.wikipedia.org/wiki/História_da_Internet_no_Brasil) • Uniform Resource Name (https://en.wikipedia.org/wiki/Uniform_Resource_Name) • Sebben, Naiara. Programação Web. Joaçaba. Unoesc Virtual. 2013. 200p. ISBN 978-85- 65600-17-0 • A História do HTML (http://www.frontendbrasil.com.br/artigos/a-historia-do-html/) • HTML5 (https://en.wikipedia.org/wiki/HTML5)
• HTML5 (https://en.wikipedia.org/wiki/HTML5) • HTML (https://en.wikipedia.org/wiki/HTML) • W3Schools (http://www.w3schools.com) • HTML Princípios Básicos - (http://pt.slideshare.net/mayzaoliveira/htmlprincipiosbasicos) • Tutorial de HTML - Tabelas (http://www.clem.ufba.br/tuts/html/c09.htm) • FTP - (https://pt.wikipedia.org/wiki/File_Transfer_Protocol) • Organização - (https://pt.wikipedia.org/wiki/Organiza%C3%A7%C3%A3o)

HTML - HyperText Markup Language - Review

  • 2.
    • URL –http://www.sc.senac.br/2016/ead.html • http – protocolo • www.sc.senac.br – nome de domínio – (registro.br) • 2016 – caminho • ead.html – arquivo
  • 3.
    • HTTP -Hypertext Transfer Protocol (Protocolo de Transferência de Hipertexto)
  • 4.
    • Métodos HTTP(request - solicitação) • GET – (Padrão) Solicita um recurso. Os dados são transferidos pela URL mesmo. • POST – na transferência com este método os dados são codificados. • HEAD – retoma a linha de resposta e os cabeçalhos de resposta. • PUT/PATCH – permite que documentos/recursos sejam transferidos e armazenados. • DELETE – permite que documentos/recursos sejam excluídos. • OPTIONS - permite fazer uma consulta de quais comandos estão disponíveis. • TRACE - permite depurar as requisições, devolvendo o cabeçalho de um documento.
  • 5.
    • Métodos HTTP(response - resposta) • 200 (OK) – significa que a confirmação da requisição foi respondida com sucesso. • 304 (NOT MODIFIED) – informa que os recursos não foram alterados desde a última vez que foi solicitada. Isso ocorre por causa dos mecanismos de “cache” do browser. • 401 (UNAUTHORIZED) – significa que o cliente não tem acesso autorizado para acessar a área requisitada. • 403 (FORBIDDEN) – informa que o acesso à área requisitada falhou. • 404 (NOT FOUND) - Não encontrado.
  • 6.
    • Hipertext MarkupLanguage (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.
  • 8.
    • A representaçãodos 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>
  • 9.
    • <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;
  • 10.
    • Existem marcaçõesespecí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 (conteúdo) </elemento>
  • 11.
    Não há diferençaentre <br> e <BR>. Porém, a maneira correta de escrever é em letras minúsculas, sempre escreva assim: <br>
  • 13.
    • Esta declaraçãodeve ser a primeira coisa em seu documento HTML, antes da tag <html>. • O <! DOCTYPE> declaração não é uma tag HTML; é uma instrução para o navegador da web sobre qual versão do HTML da página é escrito. <!DOCTYPE HTML>
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.
  • 19.
  • 20.
  • 21.
  • 24.
    <form> Atributos • method –método HTTP de envio das informações (POST / GET) • action – endereço a serem enviados os dados - # • enctype - multipart/form-data – para envio de arquivos <form method="#" action="POST">
  • 25.
    <input> Tipo de dadoTipo de campo text Texto radio Opção, seleção única checkbox Opção, seleção múltipla file Arquivo hidden Oculto password Senha Tipo de dado Tipo de campo color Seleção de cor date Data datetime Data e Hora month Mês email E-mail number Número range Intervalo numérico search Busca tel Telefone time Hora url URL week Semana
  • 27.
  • 29.
    - _docs –Documentos relacionados ao projeto (docs, imagens, briefing) - _layout – Layout do projeto (html / imagem) - _sql – Arquivo de banco de dados
  • 30.
    - css –Cascading Style Sheet (.css) - fonts – fontes utilizadas no site / ícones (.ttf, woff, svg, woff2, .otf) - img – imagens estáticas utilizadas no layout do site (.png, jpg, .gif, .svg) - js – Scripts Javascript (.js) index.html favicon.ico
  • 32.
  • 33.
    Arquivos sendo enviadose recebidos FileZilla Client Computador RemotoComputador Local Dados e log da conexão
  • 34.
    • História daInternet (https://pt.wikipedia.org/wiki/História_da_Internet) • Internet (https://pt.wikipedia.org/wiki/Internet) • E-mail (https://pt.wikipedia.org/wiki/E-mail) • História da Internet no Brasil (https://pt.wikipedia.org/wiki/História_da_Internet_no_Brasil) • Uniform Resource Name (https://en.wikipedia.org/wiki/Uniform_Resource_Name) • Sebben, Naiara. Programação Web. Joaçaba. Unoesc Virtual. 2013. 200p. ISBN 978-85- 65600-17-0 • A História do HTML (http://www.frontendbrasil.com.br/artigos/a-historia-do-html/) • HTML5 (https://en.wikipedia.org/wiki/HTML5)
  • 35.
    • HTML5 (https://en.wikipedia.org/wiki/HTML5) •HTML (https://en.wikipedia.org/wiki/HTML) • W3Schools (http://www.w3schools.com) • HTML Princípios Básicos - (http://pt.slideshare.net/mayzaoliveira/htmlprincipiosbasicos) • Tutorial de HTML - Tabelas (http://www.clem.ufba.br/tuts/html/c09.htm) • FTP - (https://pt.wikipedia.org/wiki/File_Transfer_Protocol) • Organização - (https://pt.wikipedia.org/wiki/Organiza%C3%A7%C3%A3o)