View
209
Download
2
Category
Preview:
Citation preview
• 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)
Recommended