Curso Projetando e Publicando Publicações Eletrônicas Interativas na World Wide Web Instrutor Renato M.E. Sabbatini, PhD Núcleo de Informática Biomédica Universidade Estadual de Campinas Campinas, SP, Brasil [email protected] http://nibgw.unicamp.br/~sabbatin Parte II A Tecnologia O Que é a WWW? • é um serviço disponível através da Internet que permite a transmissão e acesso a documentos multimediais • Usa um protocolo especial chamado HTTP (HyperText Transfer Protocol) • Usa uma convenção de endereços eletrônicos para os recursos na rede chamada URL (Uniform Resource Locator) O Que é um Protocolo? • é uma convenção ou linguagem que permite a comunicação entre computadors através de uma rede • O protocolo principal usado pela Internet é o TCP/IP (Transmission Control Protocol/Internet Protocol) • há muitos outros protocolos sob o TCP/IP. exemplos: – SMTP: ou Simple Mail Transfer Protocol – FTP: ou File Transfer Protocol Formato de Endereço para a WWW: Uniform Resource Locator • http://www.nlm.nih.gov/visível/sample.htm Protocolo Host Directório arquivo A Arquitetura Cliente-Servidor Cliente computador que recebe os dados rede I Servidor computador que envia os dados A tecnologia “Pull” (Puxar) Cliente Internet I Software Cliente: Protocolo Netscape, Internet Explorer (browser) Servidor Software Servidor: WWW Server O Que é o Browser ? um programa (cliente) que permite ler e extrair o conteúdo de páginas na Web, usando ou protocolo HTTP. ou programa também permite identificar links dentro de um documento e em outros computadores, e pular para outros sítios na Internet (navegação). O Software Cliente do WWW (Browser) Menu ferramentas Endereço Área de exibição Status Tipos de Browsers • Netscape Communicator • Microsoft Internet Explorer • Mosaic • Opera • etc. Todos funcionam de maneira similar e hoje estão disponíveis gratuitamente através da Internet O Que é um link (“elo”) ? é uma frase ou palavra, usualmente de uma cor diferente ou sublinhado, que permite pular para outros sites ou páginas no mesmo computador ou em outras computadores. Normalmente o que se faz é "clicar" o mouse em cima da frase ou palavra. A Tecnologia “Pull” Uma Transação HTTP (1) Cliente http://www.nih.nlm.gov/visível/sample.htm Internet I Servidor www.nlm.nih.gov Buscar Conectar Pedír HTTP Software cliente: Netscape, Internet Explorer Software servidor: WWW Server A Tecnologia “Pull” Uma Transação HTTP (2) Cliente Http://www.nih.nlm.gov/visível/sample.htm Internet I Confirmar Transferir Encerrar HTTP Software cliente: Netscape, Internet Explorer Servidor www.nlm.nih.gov sample.htm logo.gif return.gif Software servidor: WWW Server A Esséncia da Publicação On-line • deve produzir-se texto e imagens com qualidade tipográfica e gráficos on-line, e imagens de resolução alta • Para reduzir o tempo de transmisão, o protocolo de HTTP transmite desde o servidor um "script" de especificação de página muito menor, em ASCII • O browser monta uma página gráfica com base neste “script” Como Funciona o HTTP Cliente Http://www.nih.nlm.gov/visível/sample.htm sample.htm logo.gif return.gif Software do browser Visualização feita pelo browser <HTML> <BODY BGCOLOR=#FFFFFF> <IMG SRC=“logo.gif” ALIGN=left> <H1>The Visível Human Project</H1> <HR> <IMG SRC=“return.gif” ALIGN=left> National Library of Medicine Script em HTML Interconectando Documentos • Como uma publicação deve subdividir-se lógicamente em segmentos separados de informação, deve haver uma maneira de conecta-los entre si, para permitir a navegação • Isto é realizado por meio do hipertexto (imagems ou texto que representam "links" a outras imagens ou texto) O Que é o Hipertexto? <HTML> <BODY BGCOLOR=#FFFFFF> <IMG SRC=“logo.gif” ALIGN=left> <H1>The Visível Human Project</H1> <HR> <IMG SRC=“return.gif” ALIGN=left> National Library of Medicine <P><A HREF=“imagem.htm”>Amostras</A> <P><A HREF=“http://www.who.ch”>WHO</A> amostra.htm <HTML> <BODY BGCOLOR=#FFFFFF> <IMG SRC=“logo.gif” ALIGN=left> <H1>Visível Human: Amostras</H1> <BR> Nesta página você poderá achar algumas amostras de imagens geradas pelo Projeto “Ser Humano Visível” em três dimensões. imagem.htm O Que é o HTML? • é uma linguagem para a especificação de documentos (HyperText MarkUp Language) • Especifica para o browser os elementos de uma página (texto, imagens, etc.) e onde e como eles devem ocorrer • um arquivo do texto que tem a extensão .HTM contém etiquetas (“tags”) demarcadoras entre os caracteres < e > • O browser interpreta estas etiquetas e comandos e monta a página na tela. Os Elementos do HTML • Etiquetas para a definição do documento: ou título, cabeçalho, corpo, etc., • Etiquetas para a definição do texto: os parágrafos, cores, tamanhos, conjunto de fontes de caracteres, ênfase de texto, etc., • Etiquetas para imagens, sons e vídeos • Etiquetas para definir links • Etiquetas para definir tabelas, formulários, etc., Formatos de Dados Comuns Formato Visualizado por: Tipo ASCII Browser TXT HTML HyperText Markup Language Browser HTM SGML Standard Generalized Markup Language Aplicações Auxiliares SGM PostScript Aplicações Auxiliares PSP PDF Portable Data Format Aplicações Auxiliares PDF RTF Rich Text Format Aplicações Auxiliares RTF Exemplo de Formato de Dados: ASCII Exemplo de Formato de dados: PDF Preparando os Aplicativos Auxiliares As Vantagens do Adobe PDF • é uma linguagem de descrição de páginas • Permite um controle total sobre a formatação de páginas (muito melhor que HTML) • um arquivo de PDF pode ser producido automáticamente por PageMaker • a visualização off-line ou on-line é realizada pelo mesmo programa (Acrobat Reader), con muitas funções adicionais • o Reader está no dominio público e disponível para baixar via rede • Permite um hardcopy de alta qualidade de publicação As Desventagens do Adobe PDF • O usuário precisa instalar o Acrobat Reader • O artigo inteiro é armazenado em um arquivo não comprimido • Portanto, o usuário deve esperar até que ele seja totalmente transmitido para poder vusualizá-lo • As palavras do texto não são colocadas em um índice acessível aos mecanismos de busca Adobe PDF: Conclusões • PDF é um método eficaz para obter qualidade de a publicação on-line, con todas as capacidades tipográficas e gráficas do PageMaker • É fácil para o productor, mas difícil para o usuário • Provavelmente a melhor maneira é oferecer ambas versões on-line: HTML e PDF O Que é ou SGML? • é uma linguagem generalizada de marcação de documentos, muito mais poderosa que o HTML, • O HTML é um subconjunto do SGML • Requer um browser especial ou um plug-in para os browsers de HTML existentes • Difícil de usar, mas muito interessante para definir elementos da publicação • Ainda não tem muito uso Outros Formatos Portáteis • • • • • • • Microsoft Windows HELP Word Perfect Envoy Farallon Replica Common Ground Folio VIEWS Macromedia Shockwave Microsoft Word Multimeios Interativos: ShockWave Multimeios Interativos: ShockWave Flash Exemplo: um Periódico em PDF/HTML Home Page (capa) Exemplo: Um Periódico em PDF/HTML (2) Sumário Exemplo: um Periódico em PDF/HTML (3) Artigo em Texto Completo Exemplo: um Periódico em PDF/HTML (4) Resumo em HTML Exemplo: um Periódico em PDF/HTML (5) Artigo em PDF Estrutura de Interconexão Resumo Sumário Texto HTML Texto PDF A Tecnologia “Push” (Empurrar) Cliente Software Cliente: PointCast, BackWeb, etc ou plug-in para o browser Internet I Servidor Software servidor: WWW Push Server (e.g., NetCaster, Castanet) a tecnologia “Push” • O push mais antigo: o email comum (SMTP) • Email reforçado: a visualização em HTML • Extensões Multimediais do Correio da Internet (MIME) • Auxiliares para os browsers: Netscape NetCaster, Webchannel para o Internet Explorer, etc. • Clientes especiais: BackWeb, PointCast, etc., Technología “Push”: PointCast PointCast: Personalização de Canais PointCast: Screen Saver Tecnologias Ativas • CGI: Common Gateway Interface Execução de programas no lado do servidor • JavaScript, Java e ActiveX Execução de programas (“applets”) no lado do cliente • Dynamic HTML, HTML Script Extensões dinámicas au HTML Programação CGI Cliente Servidor HTTPD HTML HTTP CGI-BIN Common Gateway Interface uma maneira de executr programas no servidor (localizdos no CGI-BIN) e comunicando-se com o servidor HTTP Tarefas CGI Comuns em Uma Publicação Eletrônica • • • • • • • • Resposta automática a email e formulários Geração automática de páginas personalizadas Acesso a mecanismos de busca internos Acesso por identificador e senha Acesso e mantenimento de bancos de dados Implementação de contadores de acesso Acessos por cliques (ex., estatísticas de anuncios) Funcionamento de chats on-line, assinatura de listas, etc. Programação Java Cliente Servidor HTML HTTPD HTTP JAVA JAVA JAVA Applets pequenos programas escritos em JAVA que se descarregam junto com a página solicitada e que executam na computador cliente JavaScript <SCRIPT LANGUAGE="JavaScript"> <!-- hide var tot=0; var rt=0; function getCookieVal (offset) { var endstr = document.cookie.indexOf (";", offset); if (endstr == -1) endstr = document.cookie.length; return unescape(document.cookie.substring(offset, endstr)); } </SCRIPT> Programa interpretado e que é incluso no código HTML com as etiquetas <SCRIPT> e </SCRIPT> Java Applet Programa compilado (executável) que é baizado junto com a página HTML, como um binário Tarefas JAVA Comuns em uma Publicação Eletrônica • Banners animados e gráficos • Mapas sensíveis "inteligentes” • Processamento de formulários do lado do cliente • Aprovação de campos em formulários • Questionários interativos • Bate-papos (“chats”) baseados na Web Abordagens Híbridas • A publicação principal é baseada em HTTP, os resumos e anúncios são enviados a os leitores vía email ou webcasting • A publicação principal é baseada em FTP, se colocam os resúmos em um website ou se enviam os artigos vía email, newsgroups ou webcasting • A publicação principal é baseada em email, newsgroups ou webcasting, mas um website tem os resumos e apontadores. Exemplo da Abordagem Híbrida: Johns Hopkins InteliHealth Anúncio por Email Johns Hopkins InteliHealth Chamada Direta ao artigo na Web Curso de Publicações Eletrônicas Fim da Parte II
Download
