http_internet e html

Rodnei dos Santos Leal

HTTP, Internet e HTML

2


Sumário

O que é internet ...........................................................................................................................................3

O hardware para conexão à Internet .......................................................................................................3

O software básico para conexão à Internet .............................................................................................3

TCP/IP.......................................................................................................................................................3

O protocolo TCP .......................................................................................................................................4

O protocolo IP...........................................................................................................................................4

HTTP .........................................................................................................................................................5

Códigos de status HTTP............................................................................................................................5

URL ...........................................................................................................................................................9Domínios .br.......................................................................................................................................9Lista de Domínios Territoriais .......................................................................................................11

SEO .........................................................................................................................................................15

HTML......................................................................................................................................................16

Introdução ao HTML...................................................................................................................................17

Redigindo um documento HTML............................................................................................................17

Desvendando o código: ..........................................................................................................................18Linha 1 : <!DOCTYPE html> ................................................................................................................18Linha 2 : <HTML lang=”pt-Br”> ..........................................................................................................18Linha 3: <head>..................................................................................................................................18Linha 4: ...........................................................................................................................18

Meta Dados............................................................................................................................................20

3


O que é internetCostuma-se dizer que internet é “a grande rede mundial de computadores”, mas esta

não é uma definição exata.

Internet é o “conjunto de varias redes de computadores que se comunicam através de

um protocolo TCP/IP”.

O hardware para conexão à Internet

Para conexão discada, é preciso ter um modem para comunicação com o provedor de

acesso via linha telefônica comum.

Para conexão dedicada ADSL, é preciso ter uma placa de rede Ethernet 10/100 e um

modem ADSL, além de um separador de sinais do telefone e da transmissão de dados.

Para conexão dedicada a cabo, é preciso um cable-modem e também um separador de

sinais de TV e dos dados.

Para conexão dedicada wireless, é preciso um receptor de microondas e uma antena

externa para o acesso à rede do provedor.

O software básico para conexão à Internet

Cada equipamento de hardware tem seus programas próprios para seu

funcionamento.

Além do software associado ao hardware para conexão à Internet, é preciso ter pelo

menos um browser (navegador) para que se possam visitar os sites disponíveis.

Exemplos de browser: Netscape, Internet Explorer, Opera, Fire Fox, Chrome e Safári.

TCP/IP

Assim como temos nossas regras sociais de comunicação (por exemplo, em uma

palestra somente uma pessoa fala; em uma assembléia, são várias as pessoas que falam e,

mesmo assim, fala uma pessoa por vez), também os computadores precisam de algumas

regras para trocar informações. No caso da Internet, essas regras básicas estão reunidas no

conjunto de protocolos chamados TCP/IP.

4


As aplicações em computadores em rede utilizam o TCP/IP para criar conexões um

com o outro e em seguida trocar fluxo de dados. Estes protocolos garantem a entrega

confiável do remetente ao receptor.

O protocolo TCP

Transmission Control Protocol (TCP) - Protocolo de controle de Transmissão.

O Protocolo de Controle de Transmissão é usado na transferência de dados nas redes e

em especial na Internet.

TCP sustenta muitos protocolos de aplicações, entre as mais populares estão a WEB,

e-mail e o Secure Shell (SSH).

Suponhamos que em dado computador existem vários programas se comunicando

através da rede em um mesmo instante - por exemplo, uma página da Web sendo carregada

enquanto se verifica a caixa postal.

Como o computador "sabe" que a página da Web deve ir para o browser e os e-mails

para o programa que lê e-mails?

Isso é possível porque cada programa em execução recebe também seu endereço

próprio dentro do computador: no caso de programas que se comunicam pela Internet, esse

endereço é o número TCP.

Assim, continuando a comparação com endereços físicos, suponhamos que seu

computador é um prédio de apartamentos com um dado número IP; seu browser e seu

programa de e-mail seriam apartamentos distintos nesse prédio, cada qual com seu número

TCP.

O protocolo IP

Internet Protocol (IP) - Protocolo de Internet

Protocolo de internet é um numero que identifica um computador na rede. Assim

como cada casa tem um endereço único, o computador tem um numero único que o identifica

na rede. Quando temos acesso à Internet através de um provedor, usamos o que se chama

acesso discado e nossa conexão com a Internet em geral ganha números IPs diferentes a cada

acesso. Mesmo assim, quando nosso computador se conecta ao provedor, o número IP

atribuído a ele é único em toda a Internet.

5


Empresas que têm redes ligadas dia e noite na Internet possuem o que se chama

acesso dedicado, isto é, as conexões de sua rede têm sempre um mesmo número IP na

Internet.

HTTP

HyperText Transfer Protocol (HTTP) - Protocolo de Transferência de Hipertexto.

O HTTP é o protocolo usado para a transmissão de dados no sistema World Wide Web.

Cada vez que você aciona um link, seu browser realiza uma comunicação com um servidor da

Web através deste protocolo.

O Word-Wide-Web Consortium (W3C) e a Internet Engeneering Task Force coordenou

o desenvolvimento do HTTP, que é um protocolo de requisição-e-resposta que conecta

clientes e servidores. O cliente originário, geralmente um navegador de web é referido como

agente usuário. O servidor destinatário, que armazena ou cria recursos e pode conter arquivos

e imagens HTML, é chamado de servidor originário.

O HTTP é construído sobre o TCP, o qual é mergulhado no topo do IP. Um cliente HTTP

inicia uma requisição estabelecendo uma conexão com o servidor remoto com uma porta

particular, geralmente a pota 80 (port 80). Um servidor ouvindo esta porta espera pelo cliente

para enviar uma mensagem de requisição. Ao receber esta mensagem, o servidor devolve uma

linha de status como por exemplo: http://1.1 200Ok e sua própria resposta. Dependendo do

status, esta resposta pode ser o arquivo requisitado, uma mensagem de erro, ou outra

informação qualquer.

Códigos de status HTTP

Os códigos de status mais comuns são:

200 - o servidor retornou a página com sucesso.

404 - a página solicitada não existe.

503 - o servidor está temporariamente indisponível.

Mas, abaixo podemos ver outras respostas que um servidor pode nos enviar.

1xx (Resposta provisória)

Códigos de status que indicam uma resposta provisória e exigem que o solicitante

realize uma ação para continuar.

6


Código Descrição

100 (Continuar)O solicitante deve continuar com a solicitação. O servidor retorna esse códigopara indicar que recebeu a primeira página de uma solicitação e que estáesperando o restante.

101 (Mudandoprotocolos)

O solicitante pediu ao servidor para mudar os protocolos e o servidor estáreconhecendo a informação para, então, executá-la.

2xx (Bem-sucedido)

Códigos de status que indicam que o servidor processou a solicitação com sucesso.

Código Descrição

200 (Bem-sucedido) O servidor processou a solicitação com sucesso. Em geral, issoindica que o servidor forneceu uma página que foi solicitada.

201 (Criado) A solicitação foi bem-sucedida e o servidor criou um novo recurso.202 (Aceito) O servidor aceitou a solicitação, mas ainda não a processou.203 (Informação nãoautorizável)

O servidor processou a solicitação com sucesso, mas estáretornando informações que podem ser de outra fonte.

204 (Sem conteúdo) O servidor processou a solicitação com sucesso, mas não estáretornando nenhum conteúdo.

205 (Reconfigurarconteúdo)

O servidor processou a solicitação com sucesso, mas não estáretornando nenhum conteúdo. Ao contrário da 204, esta respostaexige que o solicitante reconfigure o modo de exibição dodocumento (por exemplo, limpe um formulário para uma novaentrada).

206 (Conteúdoparcial)

O servidor processou uma solicitação parcial GET com sucesso.

3xx (Redirecionado)

Uma ação adicional é necessária para completar a solicitação. Esses códigos de status

são usados freqüentemente para redirecionamentos.

Código Descrição

300 (Múltipla escolha)

O servidor tem muitas ações disponíveis com base nasolicitação. O servidor pode escolher uma ação com baseno solicitante (user-agent) ou apresentar uma lista paraque o solicitante escolha uma ação.

301 (Movidopermanentemente)

A página solicitada foi movida permanentemente para umnovo local. Quando o servidor retornar essa resposta(como uma resposta para uma solicitação GET ou HEAD),ele automaticamente direcionará o solicitante para o novolocal.

302 (Movidotemporariamente)

O servidor está respondendo à solicitação de uma páginade uma localidade diferente, mas o solicitante devecontinuar a usar o local original para solicitações futuras.

7


Esse código é semelhante ao 301 com relação a umasolicitação GET ou HEAD, pois direciona automaticamenteo solicitante para um local diferente.

303 (Consultar outro local)

O servidor retornará esse código quando o solicitanteprecisar fazer uma solicitação GET separadamente paraoutro local para obter a resposta. Para todas as outrassolicitações (com exceção de HEAD), o servidor direcionaautomaticamente para o outro local.

304 (Não modificado)

A página solicitada não foi modificada desde a últimasolicitação. Quando o servidor retornar essa resposta, elenão retornará o conteúdo da página.Você deverá configurar o servidor para retornar essaresposta (chamada de cabeçalho If-Modified-Since HTTP)quando uma página não tiver sido alterada desde a últimavez em que o solicitante fez o pedido.

305 (Utilizar proxy)O solicitante poderá acessar a página solicitada utilizandoum proxy. Quando o servidor retornar essa resposta,também indicará qual proxy o solicitante deverá usar.

307 (Redirecionamentotemporário)

O servidor está respondendo à solicitação de uma páginade uma localidade diferente, mas o solicitante devecontinuar a usar o local original para solicitações futuras.Esse código é semelhante ao 301 com relação a umasolicitação GET ou HEAD, pois direciona automaticamenteo solicitante para um local diferente.

4xx (Erro de solicitação)

Esses códigos de status indicam que provavelmente houve um erro na solicitação que

impediu que o servidor a processasse.

Código Descrição400 (Solicitaçãoinválida)

O servidor não entendeu a sintaxe da solicitação.

401 (Não autorizado) A solicitação requer autenticação. O servidor pode retornar essaresposta para uma página que necessita de login.

403 (Proibido) O servidor recusou a solicitação.

404 (Nãoencontrado)

O servidor não encontrou a página solicitada. Por exemplo, oservidor retornará esse código com freqüência se a solicitação forpara uma página que não existe mais no servidor.

405 (Método nãopermitido)

O método especificado na solicitação não é permitido.

406 (Não aceitável) A página solicitada não pode responder com as características deconteúdo solicitadas.

407 (Autenticaçãode proxy necessária)

Esse código de status é semelhante ao 401 (não autorizado), masespecifica que o solicitante deve autenticar usando uma proxy.Quando o servidor retornar essa resposta, também indicará qualproxy o solicitante deverá usar.

408 (Tempo limiteda solicitação)

O servidor atingiu o tempo limite ao aguardar a solicitação.

8


409 (Conflito)

O servidor encontrou um conflito ao completar a solicitação. Oservidor deve incluir informações sobre o conflito na resposta. Oservidor pode retornar esse código em resposta a uma solicitaçãoPUT que entre em conflito com uma solicitação anterior, além deuma lista de diferenças entre as solicitações.

410 (Desaparecido)

O servidor retornará essa resposta quando o recurso solicitado tiversido removido permanentemente. É semelhante ao código 404 (Nãoencontrado), mas às vezes é usado no lugar de um 404 para recursosque tenham existido anteriormente. Se o recurso foi movidopermanentemente, você deve usar o código 301 para especificar onovo local do recurso.

411 (Comprimentonecessário)

O servidor não aceitará a solicitação sem um campo de cabeçalho"Comprimento-do-Conteúdo" válido.

412 (Falha na pré-condição)

O servidor não cumpre uma das pré-condições que o solicitantecoloca na solicitação.

413 (Entidade desolicitação muitogrande)

O servidor não pode processar a solicitação porque ela é muitogrande para a capacidade do servidor.

414 (o URI solicitadoé muito longo)

O URI solicitado (geralmente um URL) é muito longo para serprocessado pelo servidor.

415 (Tipo de mídiaincompatível)

A solicitação está em um formato não compatível com a páginasolicitada.

416 (Faixa solicitadainsatisfatória)

O servidor retorna esse código de status se a solicitação for parauma faixa não disponível para a página.

417 (Falha naexpectativa)

O servidor não pode cumprir os requisitos do campo "Expectativa"do cabeçalho da solicitação.

5xx (Erro no servidor)

Esses códigos de status indicam que o servidor teve um erro interno ao tentar

processar a solicitação. Esses erros tendem a ocorrer com o próprio servidor, e não com a

solicitação.

Código Descrição500 (Erro interno doservidor)

O servidor encontrou um erro e não pode completar a solicitação.

501 (Nãoimplementado)

O servidor não tem o recurso necessário para completar asolicitação. Por exemplo, o servidor poderá retornar esse códigoquando não reconhecer o método da solicitação.

502 (Gateway inválido) O servidor estava operando como gateway ou proxy e recebeuuma resposta inválida do servidor superior.

503 (Serviçoindisponível)

O servidor está indisponível no momento (por sobrecarga ouinatividade para manutenção). Geralmente, esse status étemporário.

504 (Tempo limite dogateway)

O servidor estava operando como gateway ou proxy e nãorecebeu uma solicitação do servidor superior a tempo.

505 (Versão HTTPincompatível)

O servidor não é compatível com a versão do protocolo HTTPusada na solicitação.

9


URL

Uniform Resource Locator (URL) - Localizador Uniforme de Recursos.

O sistema de endereçamento da Web é baseado em uma sintaxe chamada URI

(Universal Resource Identifier - Identificador Universal de Recursos). Os endereços que

utilizamos atualmente são os URLs, que seguem essa sintaxe:

http://www.site.com.br/diretorio1/diretorio2/arquivo.html

Esse endereço identifica:

Estrutura:

Protocolo palavra-passe(facultativa)

Nome doservidor

Porta(facultativa se 80)

Caminho recurso

[http://] user:password@ www.site.com :80 /diretorio1/diretorio2/ Arquivo.html

I. Protocolo de acesso ao recurso desejado (http),

II. Máquina a ser contatada (www.maquina.com.br/) onde,

a. “www.site” é uma mascara para o IP real da maquina a qual você esta se

conectando.

b. “.com”, indica a categoria de dominio. Existem varias outras categorias e com

base nelas podemos identificar que tipo organização mantém o recurso.

Exemplos: “.gov” para governo, “.edu” par instituições educacionais, veja mais

exemplos na lista abaixo.

c. “.br” indica o território do dominio. Exemplo: “.br” Brasil, “.uk” Reino Unido,

“.pt” Portugal, veja mais exemplos na lista abaixo.

III. Caminho de diretórios até o recurso (diretório1/diretório2/),

IV. Recurso a ser obtido (arquivo.html).

Através de URLs também acionamos programas (scripts), enviamos parâmetros para esses

programas, etc.

Domínios .brLista de categorias de domínios

DNSSEC disponível obrigatórioDPNs genéricos

(Para pessoas físicas ou jurídicas)

COM.BR Atividades comerciais

EMP.BR Pequenas e micro-empresas

NET.BR Atividades comerciais

10


DPNs para pessoas jurídicas

AGR.BR Empresas agrícolas, fazendas

AM.BR Empresas de radiodifusão sonora

ART.BR Artes: música, pintura, folclore

B.BR Bancos

COOP.BR Cooperativas

EDU.BR Entidades de ensino superior

ESP.BR Esporte em geral

FAR.BR Farmácias e drogarias

FM.BR Empresas de radiodifusão sonora

G12.BR Entidades de ensino de primeiro e segundo grau

GOV.BR Entidades do governo federal

IMB.BR Imobiliárias

IND.BR Indústrias

INF.BR Meios de informação (rádios, jornais, bibliotecas, etc..)

JUS.BR Entidades do Poder Judiciário

MIL.BR Forças Armadas Brasileiras

ORG.BR Entidades não governamentais sem fins lucrativos

PSI.BR Provedores de serviço Internet

RADIO.BR Entidades que queiram enviar áudio pela rede

REC.BR Atividades de entretenimento, diversão, jogos, etc...

SRV.BR Empresas prestadoras de serviços

TMP.BR Eventos temporários, como feiras e exposições

TUR.BR Entidades da área de turismo

TV.BR Empresas de radiodifusão de sons e imagens

ETC.BR Entidades que não se enquadram nas outras categorias

DPNs para Profissionais Liberais(Somente para pessoas físicas)

ADM.BR Administradores

ADV.BR Advogados

ARQ.BR Arquitetos

ATO.BR Atores

BIO.BR Biólogos

BMD.BR Biomédicos

CIM.BR Corretores

CNG.BR Cenógrafos

CNT.BR Contadores

ECN.BR Economistas

ENG.BR Engenheiros

ETI.BR Especialista em Tecnologia da Informação

FND.BR Fonoaudiólogos

FOT.BR Fotógrafos

FST.BR Fisioterapeutas

11


GGF.BR Geógrafos

JOR.BR Jornalistas

LEL.BR Leiloeiros

MAT.BR Matemáticos e Estatísticos

MED.BR Médicos

MUS.BR Músicos

NOT.BR Notários

NTR.BR Nutricionistas

ODO.BR Dentistas

PPG.BR Publicitários e profissionais da área de propaganda e marketing

PRO.BR Professores

PSC.BR Psicólogos

QSL.BR Rádio amadores

SLG.BR Sociólogos

TAXI.BR Taxistas

TEO.BR Teólogos

TRD.BR Tradutores

VET.BR Veterinários

ZLG.BR Zoólogos

DPNs para Pessoas Físicas

BLOG.BR Web logs

FLOG.BR Foto logs

NOM.BR Pessoas Físicas

VLOG.BR Vídeo logs

WIKI.BR Páginas do tipo 'wiki'

Lista de Domínios TerritoriaisEsta é lista com todas as extensões de domínios territoriais atual:

Extensão Paisad Andorra

ae Emirados Árabes Unidos

af Afeganistão

ag Antigua & Barbuda

ai Anguilla

al Albânia

am Armênia

an Antillas Holandesas

ao Angola

aq Antártida

ar Argentina

as America Samoa

at Áustria

au Austrália

aw Aruba

az Azerbajão

12


ba Bósnia

bb Barbados

bd Bangladesh

be Bélgica

bf Burkina Faso

bg Bulgária

bh Bahrein

bi Burundi

bj Benin

bm Bermuda

bn Brunei

bn Brunei Darussalam

bo Bolívia

br Brasil

bs Bahamas

bt Bhutan

bv Bielorússia

bv Islã Bovet

bw Botsuana

bz Belice

ca Canadá

cc Islas Cocos

cf República Centro-africana

cg Congo

ch Suíça

ci Cote D'Ivoire

ck Islãs Cook

cl Chile

cm Camarões

cn China

co Colômbia

cr Costa Rica

cs Checoslováquia

cu Cuba

cv Cabo Verde

cx Christmas Island

cy Cyprus

cz República Checa

de Alemanha

dj Djibuti

dk Dinamarca

dm Dominica

do República Dominicana

dz Algeria

ec Equador

eq Eslováquia

ee Estônia

eg Egito

eh Sahara Ocidental

es Espanha

et Etiópia

fi Finlândia

fj Fiji

fk Islãs Falkland

fm Micronésia

fo Islãs Faroe

fr France

ga Gabão

gb Grã Bretanha

gd Granada

ge Geórgia

13


gf Guiana Francesa

gg Guernsey Islands (inc Alderney, Sark y Brethou )

gh Ghana

gi Gibraltar

gl Greenland

gm Gâmbia

gn Guiné

gp Guadalupe

gq Guiné Equatorial

gr Grécia

gt Guatemala

gu Guam

gw Guiana Bissau

hk Hong Kong

hm Islas Heard y McDonald

hn Honduras

hr Croácia

hr Hrvatska

ht Haiti

hu Hungria

id Indonésia

ie Irlanda

il Israel

im Islã deMan

in Índia

iq Iraq

ir Irã

is Islândia

it Itália

je Islã Jersey

jm Jamaica

jo Jordânia

jp Japão

ke Kenia

kg Kyrgyzstan

kh Camboja

ki Kiribati

km Islas Comoros

kn Saint Kitts and Nevis

kp Coréia do Norte

kr República de Coréia do Sul

kw Kuwait

ky Islas Cayman

kz Kazakhstan

la Laos

lb Líbano

lc Santa Lucia

li Liechtenstein

lk Sri Lanka

lr Libéria

ls Lesotho

ln Letônia

lt Lituânia

lu Luxemburgo

lv Latvia

ly Libyan Arab Jamahiriya

ly Líbia

ma Marruecos

mc Mônaco

md Moldova

mg Madagascar

14


mh Islas Marshall

mk Macedônia

ml Mali

mm Mianmar

mn Mongólia

mo Macau

mp Islas Northern Mariana

mq Martinique

mr Mauritânia

ms Montserrat

mt Malta

mu Maldivas

mu Mauritius

mw Malaui

mx México

my Malásia

mz Moçambique

na Namíbia

nc Nova Caledônia

ne Nigéria

nf Islas Norfolk

ng Nigéria

ni Nicarágua

nl Países Baixos

no Noruega

np Nepal

nr Nauru

nt Neutral Zone

nu Niue

nz Nova Zelandia

om Oman

pa Panamá

pe Perú

pf Polinésia Francesa

pg Papua Nova Guiné

ph Filipinas

Pk Paquistão

pl Polônia

pm Saint Pierre y Miquelon

pn Pitcairn

pr Porto Rico

pt Portugal

pw Palau

py Paraguai

qa Qatar

re Reunion

ro România

ru Federação Russa

rw Ruanda

sa Arábia Saudita

sb Islãs Solomon

sc Islãs Seychelles

sd Sudão

se Suécia

sg Singapura

sh Saint Helena

si Eslovênia

sj Islas Svalbard y Jan Mayen

sk Eslováquia

sl Serra Leone

sm San Marino

15


sn Senegal

so Somália

sr Suriname

st Santo Tome y Príncipe

su União Soviética

sv El Salvador

sy Síria

sz Suazilândia

tc Turks and Caicos Islands

td Chad

tg Togo

th Tailândia

tj Tajikistan

tk Tokelau

tm Turkmenistão

tn Túnez

to Tonga

tp Timor Oriental

tr Turquia

tt Trinidad y Tobago

tu Tuvalu

tw Taiwan

tz Tanzânia

ua Ucrânia

ug Uganda

uk Reino Unido

us Estados Unidos

uy Uruguai

uz Uzbekistão

va Vaticano

vc Saint Vincent y Grenadines

ve Venezuela

vg Islãs Virgenes (UK)

vi Islas Virgenes (US)

vn Vietnam

vu Vanuatu

wf Islas Wallis y Futuna

ws Samoa

ye Yemen

yu Yugoslávia

za Sudáfrica

za Zaire

zm Zâmbia

zw Zimbábue

SEO

Search Engine Optimization (SEO), Otimização para Ferramentas de Busca, processo de

escolher palavras chaves e frases relacionadas com uma website no intuito de melhorar a

classificação nos resultados fornecidos pelas ferramentas de buscas.

16


HTML

HyperText Markup Language (HTML) - Linguagem de Marcação de Hipertexto.

Não é possível programar em linguagem HTML, pois ela é simplesmente uma

linguagem de marcação ela serve apenas para indicarmos formatações para textos, inserir

imagens e ligações de hipertexto.

Os browsers são os responsáveis por identificar as marcações em HTML e apresentar

os documentos conforme o que foi especificado por essas marcações.

17


Introdução ao HTML

HTML é uma linguagem de marcação muito simples de ser utilizada, não sendonecessárias ferramentas muito sofisticadas para a sua edição, apenas um editor primitivocomo o bloco de notas. Eu disse bloco de notas e não Word, WordPad ou Write, este sãoeditores de texto. Um bom bloco de notas que nos ajuda muito é o NotePad++, ele oferecesuporte para diversas linguagens e outros recursos.

Antes de começarmos vamos conhecer o que é uma etiqueta HTML e suas partes:

Uma etiqueta HTML também chamada de tag pode ser reconhecida pelos seguintescaracteres ou aspas francesas “<” e “>”.

Sua parte interna é dividida em três <elemento atributo=”valor”>

Existem dois tipos de tag, as tags dupla onde uma inicia a formatação e a outra encerrae a tag de encerramento que possui o caractere “/” logo após a sua inicialização, exemplo:<title>...</title>, e as tags de auto fechamento também conhecidas como tags vazias, que sãoencerradas na mesma tag colocando o caractere “/” antes do fechamento, ou seja, é uma tagúnica, exemplo: <meta name="robots" content="index,follow" />

As tags são escritas em caixa baixa(minúsculas) e nunca utilize caracteres especiaiscomo ç, ^, ~ e etc.... Para inserirmos tais caracteres existe uma tabla especial de códigos querepresentam estes caracteres e são exibidos corretamente nos navegadores.

Redigindo um documento HTML

Em um bloco de notas digite o código a seguir:

Figura 1

1. <!DOCTYPE html>2. <html lang="pt-Br">3. <head>4. 5. <title>meu primeiro doc HTML</title>6. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />7. <link rel="stylesheet" type="text/css" href="styles.css" />8. <script type=”text/javaScript” src=”doc.js”>9. </head>10. <body>11. 12. </body>13. </html>

18


Desvendando o código:

Linha 1 : <!DOCTYPE html>

Linha 2 : <HTML lang=”pt-Br”>

Linha 3: <head>

Linha 4: 

Comentários e Comentários Condicionais

Termo Descrição

expression Uma conbinação de operadores, funcionalidades, e/ou valoresusados para formar uma declaração condicional.

downlevelbrowser

Qualquer browser exceto Internet Explorer 5 e versõesposteriores. Para efeitos do presente artigo, downlevel refere-seespecificamente a qualquer browser ou a versão do navegador

que não suporte condicional comentários.

uplevel browser Internet Explorer 5 e versões posteriores, que suporte conditionalcomments.

downlevel-hidden

Um bloco de comentários condicionais que é ignorado porbrowsers downlevel. Internet Explorer 5 e versões posteriores

renderizam o HTML se a expressão é avaliada como verdadeira.

downlevel-revealed

Um bloco de comentários condicionais que é analisado porbrowsers downlevel. Internet Explorer 5 e versões posteriorestambém renderizam o HTML se a expressão é avaliada como

verdadeira.

Sintaxe dos Conditional comments

A sintaxe básica dos comentários condicionais é mostrada na tabela a seguir:

Tipo de comentário Sintaxe ou valor possívelComentário HTML padrão <!– Conteúdo do Comentário –>downlevel-hidden <!–[if expression]> HTML <![endif]–>downlevel-revealed <![if expression]> HTML <![endif]>

O HTML mostrado dentro de cada bloco de comentário condicional denota qualquerbloco de conteúdo HTML, incluindo scripts. Ambos os tipos de comentárioscondicionais utilizam uma expressão condicional para indicar se o conteúdo dentro dobloco deve ser analisado ou ignorado. A expressão condicional é formada a partir deuma combinação de funcionalidade, operador, e/ou valor, como mostrado na tabela aseguir:

Item Exemplo Descrição

IE [if IE] A única característica suportada atualmente a string“IE”, correspondente ao Internet Explorer.

value [if IE 7] Um número inteiro ou ponto flutuante correspondente a

19


versão do navegador. Retorna um valor Booleano severdadeiro onde o número da versão corresponde à

versão do navegador.

! [if !IE]O operador NOT. Este é colocado imediatamente na

frente do recurso, operador, ou subexpressão parainverter o sentido da expressão booleana.

lt [if lt IE 5.5] Operador menor-do que. Retorna true se o primeiroargumento é menor que o segundo argumento.

lte [if lte IE 6]Operador menor que ou igual. Retorna true se o

primeiro argumento é menor ou igual ao segundoargumento.

gt [if gt IE 5] Operador maior que. Retorna true se o primeiroargumento é maior do que o segundo argumento.

gte [if gte IE 7]Operador maior que ou igual . Retorna true se o

primeiro argumento for superior ou igual ao segundoargumento.

( ) [if !(IE 7)]Operadores de Subexpressão. Utilizado em conjunto

com os operadores booleanos para criar expressões maiscomplexas.

& [if (gt IE 5)&(lt IE7)]

Operador E. Retorna true se todas as subexpressõesavaliadas forem verdadeiras

| [if (IE 6)|(IE 7)] Operador OU. Retorna true se algumas dassubexpressões avaliadas forem verdadeiras.

true [if true] Avalia se verdadeiro.false [if false] Avalia se falso.

Exemplos de utilização

<!–[if IE]>Você está usando o Internet Explorer.<![endif]–>

<![if !IE]>Você não está usando o Internet Explorer.<![endif]>

<!–[if IE 7]>Bem vindo ao Internet Explorer 7!<![endif]–>

<!–[if !(IE 7)]>Você não está usando a versão 7.<![endif]–>

<!–[if gte IE 7]>Você está usando a versão 7 do IE ou superior.<![endif]–>

<!–[if (IE 5)]>Você está usando o IE5 (qualquer versão).<![endif]–>

<!–[if (gte IE 5.5)&(lt IE 7)]>Você está usando o IE 5.5 ou IE 6.<![endif]–>

<!–[if lt IE 5.5]>Por favor atualize a versão do seu Internet Explorer.<![endif]–>

<!–[if true]>Você está usando uma versão uplevel do browser.<![endif]–>

<![if false]>Você está usando uma versão downlevel do browser.<![endif]>

20


<!–[if true]><![if IE 7]>Esse comentário é mostrado aninhado noIE7.<![endif]><![endif]–>

Conditional comments não precisam ser utilizados especificamente para HTML, podemser também utilizados para filtrar CSS para cada navegador(forma mais utilizada), etambém para a utilização de Scripts.

Meta Dados

Meta dados incorporados ao código XHTML são, na verdade, estruturas de dados sobre os própriosdados, uma breve descrição do conteúdo da página, seu autor, data de criação, linguagem e outrasinformações relevantes.

Alguns sistemas de busca dão aos conteúdos das meta tags uma forte ênfase no ranking dos sites, amaioria deles indexa os dados das meta tags description e keywords como sumários da página.

Se estas tags forem usadas correta e racionalmente elas podem aumentar a relevância nos resultados debusca o que é vantajoso tanto para o proprietário do site quanto para seu usuário.

1.1.Prós e contras

Como qualquer ferramenta, a utilização das meta tags tem seus prós e contras, vale ressaltar que o usoconsciente de suas potencialidades pode praticamente anular seu lado negativo. Seguem algumas dicas:

· Mantenha as meta tags simples e concisas: Descrições muito longas e palavras-chave em excessoserão ignoradas por alguns buscadores, inclusive, alguns deles indexam apenas as seis primeiraskeywords. Sistemas de indexação podem também identificar o chamado "metatag spamming", onde aspalavras-chave são repetidas várias vezes, penalizando, assim, o site em seu ranking.

· Dê prioridade às palavras-chave mais importantes: Uma vez que alguns sistemas de indexação lêemsomente algumas das keywords é importante listar as mais importantes primeiro.

· Evite o uso da meta tag REFRESH para redirecionamento: Antigamente muito usada, hoje deve serevitada, primeiramente porque ela tende a confundir os bancos de dados dos sistemas de indexação edepois porque confundem também ao usuário, especialmente os que porventura estejam navegando comleitores de tela.

· Não abuse das meta tags: Meta tags fornecem informações usadas para categorizar, priorizar erankear websites além de controlar seu conteúdo pelos webmasters e/ou autores, mas este privilégio nãodeve ser abusado. Como dito anteriormente muitos sistemas de indexação são "inteligentes" osuficientes para perceber quando há este tipo de abuso, penalizando o site em sua colocação no ranking.

· Para o Google, elas não existem! Devido à grande quatidade de "metatag spamming" o robô de buscado Google foi programado para ignorá-las! Ele indexa parte do conteúdo da própria página em seu bancode dados ao invés da "description".

1.2. Tipos de meta tags

1.2.1 HTTP-EQUIV

Meta tags com o atributto HTTP-Equiv são equivalentes aos cabeçalhos http. Normalmente elascontrolam as ações dos browsers e podem ser usadas para melhor especificar as informações.

Tags usadas desta forma têm um efeito equivalente quando sendo usadas como um cabeçalho HTTP.

Nota: Enquanto este tipo de meta tags funciona normalmente no Netscape, outros browsers podemignorá-las. Elas também são ignoradas por servidores proxy, que vêm se tornando muito comuns. É maisrecomendável usar o cabeçalho HTTP equivalente, como, por exemplo, do Apache.

Os cabeçalhos HTTP são definidos em http://www.alternic.org/rfcs/rfc1900/rfc1945.txt (HTTP 1.0)

21


E

http://www.alternic.org/rfcs/rfc2000/rfc2068.txt (HTTP 1.1)

Estes cabeçalhos podem ser gerados por scripts CGI e no Apache usando um arquivo contendo metadados.

1.2.2. Name

Meta tags com o atributo "name" são usadas para tipos que não correspondem a cabeçalhos HTTP.Muitas vezes esta distinção é ignorada. Por exemplo, alguns buscadores reconhecem a meta tag"Keywords" com o tipo "http-equiv", outros com o tipo "name".

1.2.3. Dublin Core (D.C)

Com o objetivo de melhorar a indexação das páginas pelos motores de busca, muitos grupos dedesenvolvedores acabam criando sua própria "liguagem de metatags", a mais popular delas pertence aoprojeto Dublin Core iniciado em 1995 buscando, segundo organizadores, mais flexibilidade para osautores.

1.3. Lista de Metatags, atributos e especificações

Apesar de todo o alvoroço existente em torno dos meta dados, muitas pessoas ainda não tem umconhecimento adequado da maioria dos recursos que estas ferramentas proporcionam, abaixo segueuma lista das principais meta tags, seus valores e funcionalidades.

Nota: As palavras-chave "http-equiv", "name" e "content" são case-insensitive, assim como seus valores,mas segundo as especificações do XHTML, todo o código deve ser em letras minúsculas.

Author:

O nome do autor da página.Ex.:

CODE<meta name="author" content="André">

Cache-Control

Esta tag é apenas reconhecida pelo http 1.1 e permite os seguintes valores:

Public: Os dados da página podem ser armazenados de forma compartilhada, isto é, será utilizado pordiferentes usuários de um mesmo browser (Notar que só é possível especificar usuários de browser noFirefox e Opera).

Private: É o contrário de public, o cache é armazenado para um específico usuário.

No-Cache: A página não é armazenada em Cache.

No-Store: É feito um cache temporário, a página não é arquivada.

Nota: A diretiva "cache-control:no-cache" tem a mesma função de "pragma:no-cache". O ideal quando seusa essa instrução é utilizar ambas as formas caso não se saiba se o servidor é ou não compatível com oHTTP 1.1.

Ex.:

CODE<meta http-equiv="cache-control" content="no-cache">

Content-language

22


Declara a(s) linguagem(ns) natural(is) do documento. Pode ser usada pelos motores de busca paracategorizar por idioma.

CODE<meta http-equiv="content-language" content="pt-br, en-US, fr">

Content-type

Define o tipo de conteúdo da página e o tipo de codificação de caracteres. Pode-se dizer que é a meta tagmais importante, sempre deve ser usada.

CODE<meta http-equiv="content-type" content="text/html; charset=UTF-8">

CopyRight

Como o nome já diz declara o direito autoral da página.

CODE<meta name="copyright" content="© 2004 tex texin">

Description

Contém uma descrição da página

CODE<meta name="description" content="...resumo da página...">

Expires

A data e a hora depois dos quais o documento deve ser considerado como expirado. Uma data ilegalcomo, por exemplo "0" é considerada como "agora".

Configurar "Expires" como "0" pode também ser usado para forçar uma nova checagem a cada visita dorobô de busca.

Nota: Alguns robôs de busca podem deletar um documento de seu banco de dados ao encontrá-loexpirado, outros podem marcar uma revisita

CODE<meta http-equiv="expires" content = "Mon, 22 jul 2006 11:12:01 GMT">

Keywords

As keywords tipicamente são usadas por alguns motores de busca para indexar os documentosjuntamente com informações encontradas em seu título e body.

As frases ou palavras devem ser separadas por vírgulas.

CODE<meta name="keywords" content="..palavras-chave do documento">

Pragma no-cache

Faz com que o navegador não armazene a página em cache.

23


Diferencia-se de "cache-control:no-cache" pelo fato de ser reconhecida por todas as versões do HTTP.

CODE<meta http-equiv="pragma" content="no-cache">

Refresh

Especifica um tempo em segundos para o browser atualizar a página, opcionalmente pode-se adicionaruma URL para a qual será redirecionado.

CODE<meta http-equiv="refresh" content="15;url=http://www.lendo.org">

Robots

Especifica informações de indexação para os robôs de busca, suporta os seguintes valores:

All: Valor default, significa vazio, o robô de busca não recebe nenhuma informação.

Index: Os robôs de busca podem incluir a página normalmente.

Follow: Robôs podem indexar a página e ainda seguir os links para outras páginas que ela contém.

NoIndex:Os links podem ser seguidos, mas a página não é indexada.

NoFollow: A página é indexada, mas os links não são seguidos.

None: Os robôs podem ignorar a página.

NoArchive (Apenas Google): A página não é arquivada.

CODE<meta name="robots" content="all">

GoogleBoot

Em adição com a meta tag "Robots", o Google suporta um commando "GoogleBoot". Dizendo ao googleque não quer que a página seja indexada.

Nota: A página continuará a ser indexada pelos outros buscadores

CODE<meta name="robots" content="all">

Generator

Indica o software usado para criar a página como forma de medir a popularidade do produto.

CODE<meta name="generator" content="Dreamweaver 8">

Revisit-After

Diz para os servidores proxy refazer o cache da página depois de um tempo específico.

Não mais aplicado

24


Esta meta tag não faz com que os motores de busca voltem para sua página, eles fazem isso emperíodos aleatórios.

CODE<meta name="revisit-after" content="15 days">

Rating

Esta tag funciona para classificar a página por censura, assim como no cinema, suporta os valores:

General: Para qualquer idade

14 years: Censura 14 anos

Mature: Para pessoas acima de 18 anos

CODE<meta name="rating" content="general">

Content-Script-Type

Define o tipo padrão da linguagem de script do documento.

CODE<meta http-equiv="content-script-type" content="text/javascript">

Content-Style-Type

Define o tipo padrão de linguagem para estilização do documento.

CODE<meta http-equiv="content-style-type" content="text/css">

DC.title

Desempenha a mesma função da tag "title", e deve conter o mesmo valor.

CODE<meta name= "DC.title" content="Info webdesign – Soluções Criativas, Mídias Interativas">

DC.Creator

Tem o mesmo papel da meta tag "Author"

CODE<meta name="DC.creator " content="Gazola, André">

DC.Creator.adress

E-mail para contato com o autor da página.

CODE<meta name="DC.creator.address" content="[email protected]">

DC.Suject

Tem a mesma função da meta "Keywords".

CODE<meta name="DC.subject" content="metadata, metatags, dublin core,web design>

25


DC.Description

Tem a mesma função da meta "Description".

CODE<meta name="DC.description" content="..aqui vai a descrição da página..">

DC.Publisher

Nome da organização que é responsável pelo documento.

CODE<meta name="DC.publisher" content="André Gazola">

DC.Custodian

Normalmente, o webmaster responsável pela página.

CODE<meta name="Custodian" content="Gazola, André">

DC.Date.Created

Data de criação da página no formato AAAA-MM-DD.

CODE<meta name="DC.date.created" content="2007-01-01">

DC.Date.Modified

Última data de modificação do documento, importante para buscas por data.

CODE<meta name="DC.date.modified" content="2006-02-01">

DC.Identifier

URL do documento.

CODE<meta name="DC.Identifier" content="http://www.lendo.org">

DC.Format

Especifica o tipo de dados contidos no documento.

Text/html;

Text/xml;

Text/html;

Image/jpg;

Image/gif;

Video/quicktime;

26


CODE<meta name="DC.format" content="text/xhtml">

DC.Type

Texto, Home Page, menu, image, vídeo, dados, software ou sound são alguns dos valores suportados.

CODE<meta name="DC.type" content="text.homepage.institucional">

http_internet e html

Documents