A apresentação está carregando. Por favor, espere

A apresentação está carregando. Por favor, espere

HTML Básico João Araujo. O que é HTML HTML (HyperText Markup Language) é uma linguagem de marcação usada para apresentar informação na Web usando o protocolo.

Apresentações semelhantes


Apresentação em tema: "HTML Básico João Araujo. O que é HTML HTML (HyperText Markup Language) é uma linguagem de marcação usada para apresentar informação na Web usando o protocolo."— Transcrição da apresentação:

1 HTML Básico João Araujo

2 O que é HTML HTML (HyperText Markup Language) é uma linguagem de marcação usada para apresentar informação na Web usando o protocolo http.

3 O que é uma linguagem de marcação uma linguagem de marcação é um conjunto de códigos aplicados a um texto ou a dados, com o fim de adicionar informações particulares sobre esse texto ou dado, ou sobre trechos específicos.

4 Tags O HTML utiliza etiquetas, marcações que são conhecidas como Tags, que consistem em breves instruções tendo uma marca de início e outra de fim. Estas tags determinam a formatação do texto, imagens e demais elementos que compõem uma página HTML. Em HTML as tags iniciam com símbolo

5 Tags Básicas : Define o início de um documento HTML e indica ao navegador que todo conteúdo posterior deve ser tratado como uma série de códigos HTML. : Define o cabeçalho de um documento HTML. Este cabeçalho traz informações sobre o documento que está sendo aberto. : Define o conteúdo principal, o corpo do documento. Esta é a parte do documento HTML que é exibida no navegador. No corpo podem-se definir propriedades comuns a toda a página, como cor de fundo, margens, entre outras formatações.

6 Cabeçalho Dentro do cabeçalho (tag " ") podemos encontrar: : Define o título da página, que é exibido na barra de título dos browsers. : Define formatação em CSS. : Define programação de certas funções em página com scripts, e pode colocar funções de JavaScript. : Define ligações da página com outros arquivos como feeds, CSS, scripts, etc. : Define propriedades da página, como codificação de caracteres, descrição da página, autor, etc.

7 Exemplo (Página da Geomática) Mestrado em Geomatica...

8 Corpo Dentro do corpo (tag " ") podemos encontrar outras várias tags, como por exemplo:,,... : cabeçalhos e títulos no documento em diversos tamanhos. : novo parágrafo. : quebra de linha. :cria uma tabela (linhas são criadas com e novas células com ). : determina uma divisão na página.. : imagem. : hiperlink para uma página, ou para um endereço de .

9 Problemas de HTML Linguagem limitada: tags são pré-definidas. Não há como criar tags novas que o navegador possa entender. Não existe separação entre conteúdo e formatação. A tag define o formato. As pessoas começaram a usar o recurso de tabelas para definir o layout de uma página. Praticamente impossível de manter (ou alterar) a unidade visual de um site de várias páginas.

10 CSS Cascading Style Sheets ou CSS são estilos para páginas web. Possibilitam a mudança da aparência simultânea de todas as páginas relacionadas com o mesmo estilo.

11 Exemplo h1 { font-family:"century gothic",serif; font-size:24pt; color:#4D9FFF; font-weight:normal; margin-bottom:2pt; }

12 Mas... Mesmo com CSS o HTML ainda mantinha um pouco da formatação inserida junto com a informação.

13 XML XML (eXtensible Markup Language) é uma recomendação da W3C para gerar linguagens de marcação para necessidades especiais. XML é um subtipo de SGML (Standard Generalized Markup Language - Linguagem Padronizada de Marcação Genérica). Combina a flexibilidade de SGML com a simplicidade de HTML

14 Objetivos Separação do conteúdo e da formatação legibilidade tanto por humanos quanto por máquinas possibilidade de criação de tags sem limitação criação de arquivos para validação de estrutura com seu uso pode-se interligar bancos de dados distintos Simplicidade XML concentra-se na estrutura da informação e não na sua aparência.

15 Exemplo Adriana dos Santos Aparício 2001 Ontologias, Uma Alternativa para Integração de Bases de Dados Heterogêneas Oscar Luiz Monteiro de Farias, D.Sc., UERJ Neide dos Santos, D.Sc., UERJ sim

16 Derivações de XML XML serve para definir outras linguagens de marcação, por exemplo: XHTML: O XHTML, ou eXtensible Hypertext Markup Language, é uma reformulação da linguagem de marcação HTML baseada em XML. GML: Geography Markup Language é uma sintaxe XML desenvolvida pela OGC para descrever feições geográficas. DOCBOOK: uma linguagem de marcação para autoria de documentos.

17 Sopa de letrinhas XSD: XML Schema Definition (XSD). Define um tipo de documento XML de acordo com certas restrições sobre quais elementos e atributos podem aparecer, suas relações, os tipos de dados que podem conter. Também pode ser usado para validar um arquivo XML.

18 Exemplo

19 XSL XSL (eXtensible Stylesheet Language) é uma família de linguagens do W3C definindo transformações em documentos XML. A que nos interessa é a XSLT - Extensible Stylesheet Language Transformations.

20 Exemplo

21 XHTML O XHTML, ou eXtensible Hypertext Markup Language, é uma reformulação da linguagem de marcação HTML baseada em XML. Combina as tag's de marcação HTML com regras da XML (mais rígidas) Enquanto HTML é uma aplicação da SGML, XHTML é uma aplicação da XML. XHTML não é a versão atual de HTML. Enquanto HTML está na versão 4.01, XHTML está na versão 1.1 (com a 2.0 em draft)

22 HTML e Mapserver No curso vamos usar o HTML versão Com algumas poucas tags podemos apresentar um mapa na Web.

23 Tags HTML para Mapserver Precisamos de formulários para enviar os pedidos para o cgi do mapserver....

24 Atributos de ACTION Especifica o URL do script ao qual serão enviados os dados do formulário. No nosso caso action="/cgi-bin/mapserv" METHOD Seleciona um método para acessar o URL de ação.

25 Métodos de Os métodos de form transferem dados do cliente para o sevidor. Podem ser: POST - os dados entrados fazem parte do corpo da mensagem enviada para o servidor; - transfere grande quantidade de dados. GET - os dados entrados fazem parte do URL (endereço) associado à consulta enviada para o servidor; - suporta até 128 caracteres.

26 Os formulários podem conter qualquer formatação - parágrafos, listas, tabelas, imagens - exceto outros formulários. Para entrada de dados podemos usar 3 campos:, e

27 Campo Input O campo tem um atributo TYPE, ao qual atribuímos seis valores diferentes para gerar tipos diferentes de entrada de dados. Campo de dados texto:

28 Type=Text Insere espaço para digitação de texto. Nome: Produz:

29 Type=Password Insere espaço para digitar password portegida por asteriscos Login: Password: Produz:

30 Type=CHECKBOX Insere um botão para escolha de opções Qual a camada? Aeroportos Municípios rios

31 Produz

32 Também podemos pré-selecionar: Uma diretiva CHECKED marca uma escolha inicial, isto é, se o usuário não escolher nenhuma opção, o formulário irá considerar a alternativa "pré-escolhida" Municípios

33 RADIO Determina que somente pode ser escolhida uma opção: Aeroportos rios Produz

34 SUBMIT Mostra um botão que permite o envio de dados para o servidor: Produz:

35 Reset RESET restaura os valores iniciais das entradas de dados. Produz:

36 Hidden Permite colocar entradas que não mostradas, mas que são enviadas ao servidor

37 Além do campo INPUT Também temos a nossa disposição o SELECT e o TEXTAREA.

38 SELECT Também podemo pré-selecionar;: Aeroporto Municípios Rios

39 Produz

40 SELECT Apresenta uma lista de valores: Aeroporto Municípios Rios

41 Produz

42 SELECT com SIZE Com o atributo SIZE, escolhe-se quantos itens da lista serão mostrados Aeroporto Municípios Rios

43 Produz

44 SELECT Múltiplo Com o atributo MULTIPLE, define-se que se pode selecionar mais de um item (pressionando a tecla Shift do teclado enquanto se selecionam os itens): Aeroporto Municípios Rios

45 Produz

46 TEXTAREA Abre uma área para entrada de texto, de acordo com atributos para número de colunas, linhas, e - se for o caso - um valor inicial. Deixe seu comentário

47 Produz

48 CGI CGI, ou Common Gateway Interface, é uma interface definida de maneira a possibilitar a execução de programas - "gateways" - sob um servidor HTTP Neste contexto, os "gateways" são programas ou scripts (também chamados "cgi-bin") que recebem requisições de informação, retornando um documento com os resultados correspondentes.

49 Fim


Carregar ppt "HTML Básico João Araujo. O que é HTML HTML (HyperText Markup Language) é uma linguagem de marcação usada para apresentar informação na Web usando o protocolo."

Apresentações semelhantes


Anúncios Google