HTML - HyperText Markup Language - Review

• 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.

http://www.globo.com/

http://www.globo.com/

• 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, .

• 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.



<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)

https://pt.wikipedia.org/wiki/História_da_Internet

https://pt.wikipedia.org/wiki/Internet

https://pt.wikipedia.org/wiki/E-mail

https://pt.wikipedia.org/wiki/História_da_Internet_no_Brasil

https://en.wikipedia.org/wiki/Uniform_Resource_Name

• 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)

http://www.w3schools.com/

http://www.clem.ufba.br/tuts/html/c09.htm

https://pt.wikipedia.org/wiki/File_Transfer_Protocol