Universidade Luterana do Brasil Curso de Comunicação Social/Jornalismo Disciplina: Webjornalismo e Novas Tecnologias Professora Maria Clara Aquino Tópico: Hipertexto e HTML
HIPERTEXTO Tecnicamente, um hipertexto é um conjunto de nós interligados por conexões (Lévy, 1993, p. 33) ESCRITA DA WEB, QUE OCORRE POR LINKS !!!
HIPERTEXTO MEMEX - (1945) Vannevar Bush As We May Think Marginalias (lugares comuns) Pensamento humano que Funciona por associações
HIPERTEXTO MEMEX – Memory Extension
HIPERTEXTO MEMEX - (1945) Vannevar Bush As We May Think Trilhas associativas Uso de microfilme e fitas magnéticas Texto, áudio e imagem conectados através das trilhas associativas
HIPERTEXTO Projeto Xanadu (1965) Theodor Holm Nelson Acessível a todos Todos os documentos Comentários
HIPERTEXTO Projeto Xanadu (1965) Theodor Holm Nelson Criação do termo hipertexto para desenvolver a idéia de leitura/escrita não linear
HIPERTEXTO Páginas web - WWW (1989) Tim Berners-Lee Naveadores (browsers)
HTML - Linguagem de Marcação de Hipertexto Linguagem hipertextual que serve para criar documentos web TAGS (etiquetas) Exemplo: <HTML>
HTML - Linguagem de Marcação de Hipertexto Tags mínimos: <HMTL> </HTML> <HEAD> </HEAD> - Cabeçalho <TITLE> </TITLE> - Título da página
HTML - Linguagem de Marcação de Hipertexto Tags mínimos: <BODY> </BODY> - Corpo (texto, imagens, sons, etc) As tags podem ser digitadas em maísculo ou minúsculo!!!
HTML - Linguagem de Marcação de Hipertexto <HTML> <HEAD> <TITLE>Exemplo</TITLE> </HEAD> <BODY>Este é um exemplo de documento Web</BODY> </HTML>
HTML - Linguagem de Marcação de Hipertexto Tag Font: <FONT> </FONT> <font size=2 color=000080 face=arial>. A variável "size" determina o tamanho das letras (1=pequeno, 6=grande). Tag Headings: tamanho da fonte <H1>, <H2>, <H3>, <H4>, <H5> e <H6>
HTML - Linguagem de Marcação de Hipertexto Tag Espaçamento: <BR> e <P> <BR> Equivale ao espaçamento simples <P> equivale ao novo parágrafo As tags headings e espaçamento não precisam ser fechadas!!
HTML - Linguagem de Marcação de Hipertexto <HTML> <HEAD> <TITLE>Exemplo</TITLE> </HEAD> <BODY><H1>Aula de HTML</H1><BR> <H2>Tags Básicos da HTML</H2><P> <H4> Este é um exemplo de documento Web</H4> </BODY> </HTML>
HTML - Linguagem de Marcação de Hipertexto Tag Body: <BODY> </BODY> <BODY BGCOLOR="#000000" TEXT="# FFFFFF"> Padrão de cores hexadecimal RGB PRETO = "#000000 BRANCO = "#FFFFFF” VERDE = "#00FF00” AZUL = "#0000FF” VERMELHO = "#FF0000” AMARELO = "#FFFF00"
HTML - Linguagem de Marcação de Hipertexto <HTML> <HEAD> <TITLE>O comando BODY</TITLE> </HEAD> <BODY BGCOLOR="#000000" TEXT="#FFFFFF"> <H1>CURSO DE HTML</H1><BR> <H2>Tags Básicos da HTML</H2><P> <H4>Este é um exemplo de documento Web</H4> </BODY> </HTML>
HTML - Linguagem de Marcação de Hipertexto <HTML> <HEAD> <TITLE>O comando BODY</TITLE> </HEAD><BODY BACKGROUND=“google.jpg" TEXT="#000000" LINK="#327595" VLINK="#007597" ALINK="C4C4C4"> <H1>CURSO DE HTML</H1><BR> <H2>Tags Básicos da HTML</H2> <BODY> </HTML>
HTML - Linguagem de Marcação de Hipertexto LINK = link que levará para o outro documento VLINK = link já visitado ALINK = cor do link ativado no momento
HTML - Linguagem de Marcação de Hipertexto Inserção de links: <A HREF=http://www.google.com”>Google</A> Linkando imagens: <A HREF=" http://www.google.com "><IMG SRC= “ google.jpg“></A>
<HTML> <HEAD> <TITLE>O comando BODY</TITLE> </HEAD><BODY> <H1>AULA DE HTML</H1><BR> <H2><A HREF="http://www.google.com">Google</a></H2> <BODY> </HTML> <HTML> <HEAD> <TITLE>O comando BODY</TITLE> </HEAD><BODY> <H1>AULA DE HTML</H1><BR> <A HREF="http://www.google.com"><IMG SRC= “ google.jpg”></A> </BODY> </HTML> HTML - Linguagem de Marcação de Hipertexto
HTML - Linguagem de Marcação de Hipertexto Inserção de vídeos:
HTML - Linguagem de Marcação de Hipertexto <HTML> <HEAD> <TITLE>Exemplo de vídeo></TITLE> </HEAD> <BODY>Este é um exemplo de documento Web <br> <object width="560" height="340"><param name="movie" value="http://www.youtube.com/v/XJulhGUh8vU&hl=pt-br&fs=1&"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/XJulhGUh8vU&hl=pt-br&fs=1&" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="560" height="340"></embed></object> </BODY></HTML>
0 comments
Post a comment