UNIVERSIDADE FEDERAL DO PARANÁ CENTRO DE COMPUTAÇÃO ELETRÔNICA DIVISÃO DE SUPORTE TÉCNICO

Transcrição

1 HTML

2 HyperText Markup Language - HTML Página 2 SUMÁRIO COMPREENDENDO OS FUNDAMENTOS DA INTERNET...5 O QUE É A INTERNET?...5 AS APLICAÇÕES BÁSICAS NA INTERNET...6 FTP - File Transfer Protocol...6 SMTP - Simple Mail Transfer Protocol...6 List Servers...6 Usenet (User s Network)...6 Gopher...7 Telnet...7 WWW - World Wide Web...7 ENDEREÇANDO REDES E COMPUTADORES...9 O básico do TCP/IP...9 Endereçamento da Rede...9 Nomes e Endereços...9 COMPREENDENDO OS CONCEITOS WEB...10 UMA VISÃO HISTÓRICA DE HIPERTEXTO...10 FUNDAMENTOS DE HIPERTEXTO...11 NODOS E LINKS...12 COMPREENDENDO O HYPERTEXT TRANSFER PROTOCOL (HTTP)...14 UNIVERSAL RESOURCE IDENTIFIER (URI)...14 UNIFORM RESOURCE LOCATOR (URL)...14 FTP - FILE TRANSFER PROTOCOL...15 GOPHER...15 MAILTO...15

3 HyperText Markup Language - HTML Página 3 TELNET...15 HYPERTEXT MARKUP LANGUAGE (HTML)...16 CARACTERÍSTICAS DA LINGUAGEM HTML...16 COMPREENDENDO A ESTRUTURA HTML...17 PROPRIEDADES DO DOCUMENTO...18 TITLE...18 PROPRIEDADES DE FORMATAÇÃO...18 Cabeçalhos...18 Parágrafos...19 Quebras de linha...19 OUTRAS MARCAÇÕES DE ESTILOS BASTANTE UTILIZADAS Linha de separação Horizontal...19 Texto Pré-Formatado...19 Ênfase EXEMPLO INICIAL...20 TRABALHANDO COM LISTAS NA LINGUAGEM HTML...22 Listas Ordenadas...22 Listas Não Ordenadas...22 Listas de Definições...23 Listas Encadeadas EXEMPLOS SOBRE LISTAS...24 TRABALHANDO COM HYPERLINKS NA LINGUAGEM HTML...27 Estabelecendo hyperlinks locais...27 Estabelecendo hyperlinks a pontos específicos em um documento...28 Estabelecendo hyperlinks a documentos ou outros recursos remotos EXEMPLOS SOBRE HYPERLINKS...30

4 HyperText Markup Language - HTML Página 4 TRABALHANDO COM IMAGENS NA LINGUAGEM HTML...34 Inserindo imagens em sua página Web...34 Transformando imagens em hyperlinks EXEMPLOS DE IMAGENS EM PÁGINAS WEB...35 TRABALHANDO COM TABELAS NA LINGUAGEM HTML EXEMPLOS DE TABELAS EM PÁGINAS WEB...39 MARCAÇÕES IMPORTANTES...40 CÓDIGOS HTML PARA CARACTERES ACENTUADOS...43 REFERÊNCIAS BIBLIOGRÁFICAS...44 OUTRAS BIBLIOGRAFIAS PESQUISADAS...44

5 HyperText Markup Language - HTML Página 5 Compreendendo os Fundamentos da Internet Você provavelmente já deve ter escutado muita coisa sobre Internet, WWW, Web, ciberespaço, hipertexto/hipermídia, etc. Estes novos termos estão ganhando uma força cada vez maior em nosso vocabulário e já fazem parte, direta ou indiretamente, de nosso cotidiano. Logicamente, não é necessário que você domine todas estas terminologias e tecnologias para poder utilizar os benefícios que elas proporcionam. Nosso dia a dia nos comprova isto. Nós não dominamos as tecnologias do videocassete ou da televisão, embora façamos bom uso delas. No campo da Informática não é diferente, ou seja, a tendência também é a de produzir programas de computador com qualidade e de fácil utilização. Apesar destas considerações, é necessário que consigamos acompanhar de alguma maneira esta (r)evolução da tecnologia da informação que aliada ao processo de globalização tem exigido da sociedade moderna uma verdadeira transformação em seus costumes. Assim, a idéia é tentar abordar alguns conceitos importantes, embora complexos, de uma maneira simples para que você consiga compreender o que realmente toda esta tecnologia pode trazer de benefícios no seu dia a dia. O que é a Internet? A Internet é uma rede mundial de redes de computadores. Podemos dizer que a Internet é a união dos computadores com as telecomunicações. Podemos dizer, também, que esta união tem causado grandes mudanças de comportamento econômico, social, e político em todo o mundo. A grande característica da Internet é proporcionar às pessoas a oportunidade de obter informações. Informações de qualquer natureza e localizadas em qualquer lugar. Sua arquitetura aberta é simples e baseada principalmente no compartilhamento de informações. Qualquer pessoa utilizando qualquer modelo de computador pode conectar-se à Internet. Atualmente atinge cerca de 50 milhões de usuários em todo o mundo. O crescimento da Internet no Brasil também é significativo. Dados recentes indicam que existem cerca de computadores ligados à Internet no Brasil, e que este número tem crescido a uma taxa de computadores por mês. Assim, é esta popularidade da Internet que tem exigido a necessidade de compreendermos como ela funciona e como poderemos utilizá-la. Neste curso vamos ver como desenvolver nossas páginas com a linguagem HTML para que possamos também contribuir de alguma maneira com esta rede mundial de informações.

6 HyperText Markup Language - HTML Página 6 As aplicações básicas na Internet Basicamente as aplicações na Internet são utilizadas para : Copiar arquivos Enviar e receber mensagens eletrônicas Compartilhar informações Pesquisar por documentos e informações em geral As seguintes aplicações darão a você uma idéia de como as pessoas estão utilizando a Internet. Estas são algumas das principais aplicações Internet que têm auxiliado no crescimento desta rede global. Se você compreender o que estas aplicações fazem, você começará a compreender como a Internet funciona. FTP - File Transfer Protocol File Transfer Protocol, mais conhecido como FTP, foi desenvolvido para copiar arquivos de um sistema para outro. É o aplicativo Internet tradicional para receber ou carregar arquivos disponíveis na rede para o seu computador. Você pode também enviar ou transmitir arquivos de seu computador para outros computadores da rede. Portanto, a idéia básica por trás deste protocolo é a sua capacidade de enviar e receber arquivos, em formato texto ou binário, entre dois computadores da rede. Apesar de parecer um processo simples, isto não era fácil há alguns anos atrás, quando os dois computadores envolvidos neste processo eram sistemas completamente diferentes. SMTP - Simple Mail Transfer Protocol Este talvez seja o principal serviço da Internet. Uma vez que computadores em todo o mundo estão interligados via rede Internet, os usuários destes sistemas podem se comunicar utilizando SMTP. Com um sistema de mensagens eletrônicas deste tipo, você pode enviar mensagens para qualquer parte do mundo pelo custo de sua conexão local com a Internet. Assim como o FTP, o SMTP foi projetado para ser fácil de utilizar e fácil de programar. Apresenta um conjunto pequeno de comandos, mas de grande utilidade para seus usuários. Vários outros serviços Internet têm sido baseados neste protocolo SMTP. List Servers Um list server é um sistema baseado em SMTP que permite aos usuários subscrever em tópicos sobre os quais outros usuários enviam mensagens eletrônicas. Quando um usuário envia uma mensagem sobre um determinado assunto, o list server remete a mensagem para todos os usuários que estejam subscritos naquele assunto. Usenet (User s Network) A Usenet é um tipo de organização de grupos de discussão na qual artigos individuais são distribuídos pelo mundo todo. A Usenet tem milhares de grupos de discussões sobre os mais

7 HyperText Markup Language - HTML Página 7 variados assuntos. Em cada instalação Internet, o administrador do sistema pode decidir se deve ou não organizar um determinado grupo de discussão. Assim, a Usenet é um outro tipo de conversação baseada em mensagens. Gopher O Gopher teve um papel importante para o avanço da popularidade da Internet. Este protocolo foi estabelecido pela Universidade de Minnesota como uma maneira fácil de pesquisar por informações on-line. Os sistemas do tipo Gopher oferecem uma interface com o usuário baseada em menus, a partir dos quais você pode acessar qualquer tipo de informação na forma de texto. Assim, este protocolo permite a um cliente acessar um servidor que contenha informações de uma maneira hierárquica similar a uma árvore de diretório com seus subdiretórios. Telnet Como um serviço público, muitos sistemas Internet são organizados para permitir a qualquer pessoa logar usando uma conta do tipo convidado (guest). Uma das características fascinantes da Internet é justamente poder utilizar um computador do outro lado do mundo como se este estivesse localizado num outro canto da nossa sala. O programa Telnet é utilizado para que você possa fazer uma conexão remota. Assim, basta digitar telnet e nome do endereço remoto, como por exemplo: telnet books.com. Quando o Telnet estabelecer a conexão, você poderá interagir com o computador remoto. WWW - World Wide Web A tecnologia da World-Wide Web pode ser vista como o produto de contínuas pesquisas por novas maneiras de compartilhar recursos através da rede Internet. A idéia foi inicialmente concebida em 1989 por Berners-Lee do então CERN (Conseil Europeen pour la Recherche Nucleaire, atualmente denominado European Laboratory for Particle Physics ), como um método para agilizar a transferência de informações entre a comunidade científica internacional. A WWW consiste de computadores (servidores), espalhados pelo mundo, os quais armazenam informações tanto no modo texto quanto no formato multimídia. São milhares de servidores ativos (cada um contendo um endereço Internet) permitindo aos usuários localizarem facilmente as informações desejadas. O objetivo principal deste serviço é proporcionar uma interface gráfica com o usuário, de forma simples e consistente o suficiente para manter uma compatibilidade com os inúmeros recursos proporcionados pela Internet. A principal característica do WWW é o seu potencial para a criação de ligações entre texto e outros meios, não só dentro de um documento individual mas também entre documentos armazenados em qualquer computador que tenha acesso à rede Internet. O projeto é baseado no princípio do leitor universal, ou seja, se a informação está disponível, então qualquer pessoa (autorizada, é claro) deve ser capaz de acessá-la de qualquer parte do mundo. A popularização do World Wide Web deve-se, em grande parte, à utilização inicial de um browser de domínio público chamado Mosaic. O Mosaic é mantido e distribuído pelo NCSA (National Center for Supercomputing Applications) da Universidade de Illinois.

8 HyperText Markup Language - HTML Página 8 Enquanto o Gopher permite que uma linha de texto de informação sirva como um link para outro documento ou outro site, o WWW permite que uma página seja mostrada com múltiplas fontes, gráficos, e links para animações, filmes e sons. Estes links podem dar acesso a outras páginas de informações com as mesmas características. Assim, o ambiente WWW utiliza a tecnologia de hipertexto para proporcionar, em uma única interface gráfica com o usuário, o acesso a diferentes classes de informações armazenadas como relatórios, notas, documentações, sistemas de ajuda on-line, e outras bases de informações.

9 HyperText Markup Language - HTML Página 9 Endereçando Redes e Computadores Agora que já compreendemos alguns conceitos sobre a rede Internet, não seria perda de tempo conhecermos um pouco sobre o seu sistema de endereçamento. As aplicações Internet comunicam-se sobre a rede utilizando o protocolo TCP/IP (Transmition Control Protocol / Internet Protocol). Este protocolo e seu mecanismo de endereçamento permitem que suas aplicações conectem e troquem informações com outros sistemas. O básico do TCP/IP O protocolo TCP/IP deixa os computadores compreenderem para onde as mensagens devem ser enviadas. Um protocolo de rede tal como o TCP/IP é freqüentemente comparado ao serviço dos correios. Quando você envia uma carta a um amigo distante, por exemplo. Depois de escrever a carta, você coloca num envelope, escreve o nome e o endereço do lado de fora da carta. O endereço diz ao serviço postal onde entregar a sua carta. Então sua carta é colocada numa caixa de correio local e posteriormente transportada para seu amigo utilizando uma seqüência de ações padronizadas pelo serviço local. Endereçamento da Rede Com o protocolo TCP/IP, cada rede e host tem um determinado e específico endereço. Este endereço é composto de quatro (4) conjuntos de oito bits cada um. Estes conjuntos são expressos como quatro números separados por pontos. Por exemplo, Nomes e Endereços Para tornar o endereçamento TCP/IP fácil de ser utilizado, uma convenção de nomes - denominado Domain Name Servers (DNS) - foi criada. Um Domain é um grupo de hosts que tem nomes de hosts associados a eles. Para acessar um servidor, pode-se através do endereço TCP/IP ou pelo seu nome DNS. Obviamente é muito mais fácil lembrar do nome dos hosts do que dos endereços numéricos. O endereçamento DNS sempre termina com um top-level domain, Por exemplo,.com.edu.br organizações comerciais instituições educacionais hosts no Brasil

10 HyperText Markup Language - HTML Página 10 Compreendendo os Conceitos Web A Internet pode ser vista como um grande repositório de informações. São milhares de computadores interligados proporcionando inúmeras fontes de conhecimento. Assim, a grande questão para todo iniciante na Intenet é : Por onde devo começar minha pesquisa? Bem, atualmente o ponto inicial é o WWW ou somente Web como tem sido chamado. A WWW funciona de acordo com o modelo cliente-servidor. Um servidor Web é um programa cujo objetivo é disponibilizar documentos para que os clientes possam acessá-los. Um cliente Web é um programa que faz a interface com o usuário, intermediando pedidos de documentos a um determinado servidor. Portanto, o processo pode ser resumido da seguinte maneira : 1. Através de um cliente Web - ou browser - o usuário seleciona um documento para visualização; 2. O cliente Web conecta-se a um computador especificado por um endereço Internet, e solicita ao servidor Web pelo documento solicitado pelo usuário; 3. O servidor responde enviando o documento (contendo textos, figuras, sons, etc...) para o cliente. A linguagem que estes clientes e servidores Web entendem para comunicar é denominada HTTP (HyperText Transfer Protocol) e será vista com detalhes adiante. Portanto, podemos dizer que todos os clientes Web precisam falar HTTP para que esta comunicação seja realizada. Assim como o Gopher, o WWW é um protocolo que permite que as informações sejam enviadas de um servidor para um cliente. A grande diferença como vimos, é que a Web permite que páginas multimídia sejam enviadas ao cliente. Enquanto o protocolo Gopher utiliza o conceito de árvore para pesquisar a estrutura de informações, o WWW utiliza o conceito de uma rede de documentos interconectados. Ou seja, a WWW não tem um ponto inicial e final. As páginas Web, que são mostradas através dos browsers, são transferidas de um servidor Web para o sistema local, para então serem interpretadas e mostradas adequadamente na tela do computador do usuário. Portanto, qualquer pessoa com um servidor Web pode contribuir para as informações contidas no WWW. Empresas provedoras de serviços na Internet permitem que seus associados publiquem suas páginas Web através de seus servidores. Uma das principais tecnologias que proporciona o embasamento teórico ao funcionamento do ambiente WWW é o hipertexto. Por isso, a próxima sessão analisa esta tecnologia com maiores detalhes para que possamos compreender adiante outros dois conceitos envolvidos neste ambiente WWW que são os protocolos HTTP (HyperText Transfer Protocol) e, é claro, o nosso objetivo que é a linguagem HTML (HyperText Markup Language). Uma visão histórica de Hipertexto Em 1945, Vannevar Bush em seu artigo intitulado As We May Think [1], imaginou

11 HyperText Markup Language - HTML Página 11 uma máquina para o armazenamento e a manipulação de informações que ele casualmente denominou Memex. Este artigo é freqüentemente citado como o precursor de grandes desenvolvimentos nas áreas de computação, recuperação de informação, e hipertexto. O sistema Memex foi idealizado como uma ferramenta de acesso à grandes quantidades de informações armazenadas em microfilmes. Este sistema propunha uma máquina que utilizasse microfilme e fotocélulas para armazenar dados, capacitando o usuário a formar trilhas de informações, ou sejam, ligações à textos e ilustrações correlacionados. Foi o primeiro sistema a descrever o uso de máquinas para armazenar conexões entre trechos de informações. Já nesta época Bush argumentava sobre a necessidade de um mecanismo para auxiliar as pessoas a tratar com a crescente quantidade de informações disponíveis no mundo. Ele visualizou o conceito embora jamais tenha criado o mecanismo para concretizá-lo. Posteriormente, nos anos 60, Douglas Engelbart influenciado pelo trabalho de Bush com relação aos conceitos de links e browsing, pesquisou a convergência destes conceitos, com o objetivo de utilizar os computadores para aumentar a capacidade intelectual da humanidade[2]. A partir das idéias originais, como parte de seu projeto Augment, Engelbart desenvolveu o NLS ( on-line System ), que inicialmente serviu para o armazenamento de memorandos, notas de pesquisas, e documentações que podiam ser interrelacionados. Posteriormente, ele classificou o NLS como um sistema de cooperação e colaboração entre pessoas dispersas geograficamente. Considerando estes trabalhos anteriores, Teodhor Nelson foi o responsável por criar o termo hipertexto referindo-se aos conceitos e técnicas utilizadas para suportar um modo de escrita não seqüencial auxiliada por computador[3]. Nelson falava sobre o impacto que a tecnologia do hipertexto produziria na sociedade futura através de uma rede on-line capaz de armazenar todo o conhecimento literário do mundo. Por volta de 1967, Nelson traduziu estas suas idéias em um projeto denominado Xanadu, que tornou-se, talvez, o mais conhecido sistema hipertexto. Este sistema seria um ambiente de publicações em constante expansão, o qual milhões de pessoas poderiam utilizar, interagindo e interconectando documentos eletronicamente. O projeto de um servidor de rede universal para o Xanadu foi descrito em várias edições de seu livro Literary Machines"[4]. Portanto, nota-se que há muitos anos os pesquisadores sonham com um banco de dados universal no qual grande quantidade de informações estariam disponíveis para que as pessoas pudessem acessar de qualquer parte do mundo. Recentemente, os avanços tecnológicos têm tornado possível a realização deste sonho pois, à medida que a popularidade da Internet aumenta, as pessoas tornam-se mais cientes de seu enorme potencial, vislumbrando um subconjunto das funcionalidades da hipermídia na estruturação e acesso às informações através do recente surgimento da atividade do World-Wide Web (WWW). Fundamentos de Hipertexto O livro tem sido tradicionalmente o principal meio de armazenamento do conhecimento. As informações são geralmente organizadas em páginas seqüenciais para serem lidas de modo linear.

12 HyperText Markup Language - HTML Página 12 Ao contrário dos livros, os sistemas hipertexto podem representar uma coleção de arquivos interconectados em uma rede de informações. Os usuários são livres para progredir, ou navegar, através desta base de informações utilizando vários caminhos distintos e não seqüenciais, cujas ligações foram de alguma maneira estabelecidas pelo projetista do sistema. Por não seqüencial, subentende-se o movimento ou salto de um ponto do programa para outro, baseado tanto nas necessidades dos usuários quanto nos padrões de relações explicitamente definidos pelo autor. Assim, os sistemas hipertexto estão baseados principalmente na suposição de que a interpretação do usuário é mais importante do que aquela do autor, e têm sido definido como uma abordagem para o gerenciamento de informação no qual os dados são armazenados em uma rede de nodos conectados por links. Os nodos podem conter texto, gráficos, som, vídeo, ou outras formas de informações. [5] Nodos e Links Um sistema hipertexto é constituído de nodos (ou unidades de informação) e links (ou relações). Os dados são organizados como segmentos separados, embora interrelacionados, de informações. Uma parte do sistema hipertexto é um conjunto de links associativos que conectam os nodos individuais em uma rede principal. Portanto, um documento hipertexto é uma rede destes nodos conectados pelos links. A figura 1 ilustra a estrutura de um documento hipertexto no qual cada palavra sublinhada em negrito é um link para um outro nodo de informação. As setas indicam o nodo alvo de cada link. Um nodo geralmente representa um único conceito ou idéia contido em uma ou mais telas de informação. Nesta figura, embora a rede hipertexto mostre somente informações textuais, é certo que poderia conter outros meios de comunicação suportados pelo sistema utilizado. Portanto, em uma rede hipertexto, os nodos estão conectados uns aos outros através dos links. O nodo origem é chamado de referência e o nodo destino é chamado de referente. São também freqüentemente chamados de âncoras. O conteúdo de cada nodo é exibido pela ativação dos links, os quais podem ser bidirecionais facilitando o processo da busca de informação.

13 HyperText Markup Language - HTML Página 13 Nodo A Talvez a primeira proposição da existência de alterações celulares subjacentes à formação de memórias tenha sido feita por Donald Hebb, em seu livro Organization of Behavior (1949). Esse psicólogo canadense propôs que na situação de aprendizagem, um neurônio estimula outro de tal forma que a sinapse entre eles se torna fortalecida, o que poderia explicar o fenômeno da memória. Nodo B A sinapse é uma junção especializada entre dois neurônios, presente em todos os sistemas nervosos. Impulsos nervosos de um neurônio são transmitidos ao seguinte através desta junção, seja quimicamente (via neurotransmissores) ou eletricamente (via correntes locais). Nodo D Os neurônios são células nervosas. São alongadas e especializadas na condução dos impulsos nervosos ( sinais elétricos ). Nodo C Memória é a capacidade de reter e recuperar informações. Processo que produz alterações no comportamento, permitindo que o indivíduo se situe no presente, considerando o passado e o futuro. As memórias podem ser de curto prazo ou longo prazo - conforme permaneçam por maior ou menor tempo - e podem ser divididas em memória semântica (conhecimento) e episódica (lembrança de eventos específicos vividos pelo indivíduo). Figura 1 - Trecho de uma rede hipertexto interrelacionando conceitos. Esta estrutura nodo-link na base de conhecimento hipertexto, permite ao usuário percorrer o espaço da informação utilizando as chamadas ferramentas de navegação ou browsers. A seqüência de links a ser seguida fica sempre à critério do usuário, constituindo-se em uma característica predominante na estruturação de materiais baseados em hipertexto. Apesar da essência deste modelo serem os links eletrônicos, os nodos contribuem significativamente para a definição das operações que um sistema hipermídia pode desempenhar. Os dois problemas clássicos freqüentemente citados na literatura de sistemas hipertexto ou hipermídia, com relação à sua utilização são: Desorientação Este é o problema de sentir-se perdido no hiperespaço, ou seja, o usuário não se sente seguro de onde ele está em relação à outras partes da rede, ou não é capaz de encontrar alguma informação que tinha certeza que estava em algum lugar no sistema. Esta tendência aumenta consideravelmente com o tamanho e a complexidade do hipertexto. Um importante ramo da pesquisa atual em hipertexto concentra-se na tentativa de desenvolver ferramentas cada vez mais poderosas para a visualização de estruturas. É preciso fornecer ao usuário um determinado nível de complexidade que seja compatível com os limites de sua cognição visual. Muitas estruturas conceituais podem ser eficazmente representadas pela exposição gráfica, e o problema da desorientação pode ser corrigido através de algum tipo de mapa.

14 Sobrecarga cognitiva UNIVERSIDADE FEDERAL DO PARANÁ HyperText Markup Language - HTML Página 14 A necessidade de acompanhar as ligações acarreta uma carga cognitiva adicional podendo significar que alguma capacidade de processamento da informação é desviada para a tarefa de tomada de decisão (que não deixa de ser a essência do trabalho com hipertexto). De outro modo, esta capacidade poderia ser concentrada no material sendo pesquisado ou estudado. Esta sobrecarga está presente até mesmo no processo de leitura de um documento hipertexto. Compreendendo o Hypertext Transfer Protocol (HTTP) O Hypertext Transfer Protocol - ou HTTP como é chamado - é o protocolo através do qual as informações são transferidas utilizando o ambiente Web. A grande expansão da Web tem promovido este protocolo a um papel muito importante na Internet. Sua principal característica é a flexibilidade e a simplicidade. Assim, este protocolo é utilizado para transferir informações dos servidores para os clientes. Além do protocolo HTTP é preciso compreender o sistema de endereçamento dos servidores utilizando o Universal Resource Identifier (URI), que permite aplicações clientes localizarem servidores dentro da rede. Universal Resource Identifier (URI) A medida que o número de protocolos cresce na rede, torna-se necessário uma padronização e simplificação da maneira como um determinado serviço é identificado e endereçado na rede. Os URIs permitem a existência de uma série de mecanismos de endereçamento. O URI define um método para empacotar um nome de um objeto de dado com um endereço universal pelo qual ele pode ser localizado no campo de outros endereços universais. O sistema de endereçamento não necessariamente revela qualquer informação útil a respeito do objeto de dado básico, sua metodologia de acesso, ou o sistema no qual o dado reside. O URI meramente permite que o dado seja encontrado. Uniform Resource Locator (URL) O URI pode incluir informações que podem identificar qual o princípio de acesso. Este tipo de identificador é chamado Uniform Resource Locator ou URL como ficou conhecido na terminologia da Internet. Assim, o URL é um URI contendo informações adicionais sobre como o objeto que está sendo endereçado deve ser acessado. O seguinte exemplo ilustra melhor estes conceitos : URI : //river.clarion.edu/trvilberg/conceptmap.html URL : Assim, o protocolo HTTP é utilizado no ambiente WWW para transferir informações dos servidores para os clientes. O exemplo de URL acima, pode ser utilizado para demonstrar isto. A seguir vamos ver então como os outros principais serviços na Internet podem utilizar o sistema de endereçamento URL para acessar informações em servidores remotos.

15 HyperText Markup Language - HTML Página 15 FTP - File Transfer Protocol Como vimos o protocolo FTP permite que arquivos sejam copiados de um computador remoto para um computador local usando o conceito de URI. Uma vez que vários parâmetros podem ser atribuídos para o FTP, algumas considerações tiveram de ser avaliadas por questões de interoperabilidade do sistema de endereçamento. O protocolo FTP quando acessado através do URL realizará a cópia do arquivo correspondente. Os endereços devem especificar o nome do usuário e a senha dentro do endereço URL, ou o usuário deve assumir que o modo de transferência de arquivo é do tipo anonymous e utilizará o endereço como senha. Por exemplo, ftp://userid:password@bighost/finance/q4-95.xls ftp://bighost/games/arcade/cdown.zip Gopher O URI para o protocolo Gopher permite que o endereço contenha o caminho completo para o diretório e também o número da porta TCP. Por exemplo, gopher://host5:70/00/research-papers/baby.txt A sintaxe do Gopher indica que a porta 70 deve ser utilizada para a conexão com este servidor e o objeto 00 indica que trata-se de um arquivo do tipo texto. Mailto Os endereços podem também apontar para mailboxes eletrônicos, para permitir que os usuários consigam enviar um feedback sobre as informações contidas em determinados links, ou para se comunicar com pessoas que podem estar envolvidas com um conjunto de informações que está sendo recuperado. Por exemplo, Telnet mailto:hamilton@cce.ufpr.br Alguns links de endereços apontam para algumas sessões em hosts que utilizam emulação de terminal para acessar informações. Estes endereços contém o nome do host e a porta para conexão. Por exemplo, telnet://infoserv.abc.com:6677

16 HyperText Markup Language - HTML Página 16 HyperText Markup Language (HTML) HTML é uma linguagem de formatação de textos utilizada para definir páginas na Web, baseada em códigos embutidos em um documento que pode servir para ajustar fontes, criar listas, mostrar imagens, entre outros tipos de formatações de páginas. A linguagem HTML está fundamentada na ISO Standard Generalized Markup Language (ou SGML como é conhecida), que é um padrão internacional de formatação de documentos. Como um subconjunto deste padrão ISO, qualquer aplicação que possa interpretar o formato SGML poderá também ler o formato HTML. Como o próprio nome diz, a HTML é uma linguagem de marcação hipertexto, e é considerada a linguagem da Web. Todos os documentos que você acessar na Web foram implementados em HTML por alguém. As formatações de páginas, as imagens coloridas, os hyperlinks que possibilitam navegar pelo mundo virtual, foram desenvolvidos utilizando HTML. A linguagem HTML é fácil de aprender e requer na verdade muita criatividade. Basicamente, os documentos escritos em HTML são arquivos no formato ASCII-texto. Assim, podem ser criados com a utilização de qualquer editor de texto que grave os arquivos em formato texto puro.. A HTML é uma linguagem interpretada. O interpretador é o browser do usuário ou o sistema cliente. Características da linguagem HTML HTML é uma linguagem simples, porém poderosa e com muitos recursos. Um fator importante para o seu aprendizado é compreender seus conceitos, seus propósitos, e o que ela pode nos oferecer. Daí em diante, nossa criatividade é constantemente colocada à prova. Algumas das principais características da HTML são : Formatação de documentos Organização de listas Capacidade de incluir hipertexto/hipermídia em documentos Web Capacidade de incluir imagens clicáveis. Freqüentemente você vai deparar com muitas outras características de implementações HTML na Web, mas certamente todas serão fáceis de assimilar se você antes de tudo compreender a filosofia da linguagem. É isto que veremos a seguir.

17 HyperText Markup Language - HTML Página 17 Compreendendo a estrutura HTML A HTML faz uso de tags e elementos que proporcionam uma maneira de especificar qual formato utilizar e quando um formato começa e termina. Para isso, utiliza marcações específicas e distintas para dizer ao browser do usuário como exibir um documento. A sintaxe básica para estas marcações HTML geralmente são especificadas da seguinte maneira : <elemento> Texto a ser formatado </elemento> Portanto, a estrutura básica de um documento HTML deve conter : uma identificação do tipo HTML: <Html> </Html> uma seção de cabeçalho delimitada por: <Head> </Head> o título do documento dentro da seção de cabeçalho: <Title>título</Title> uma área como corpo do documento: <Body>corpo_do_conteúdo</Body> Esta estrutura básica é ilustrada na figura abaixo:. A linguagem HTML não diferencia entre letras maiúsculas e minúsculas, ou seja, não é "case sensitive". Assim, a notação <HEAD> é equivalente a <Head>. Os elementos de formatação representam o coração da linguagem HTML. Os códigos de formatação do documento podem ser divididos em dois grupos básicos : propriedades do documento propriedades de formatação

18 HyperText Markup Language - HTML Página 18 Propriedades do documento As propriedades do documento descrevem o título e outras características gerais sobre o documento como um todo. Os seguintes parâmetros aparecem dentro do cabeçalho de um documento para identificar sua utilização por um sistema cliente : <HEAD> <TITLE>Curso de HTML</TITLE> </HEAD> Assim, existem várias propriedades que podem ser encontradas dentro de uma seção HEAD de um documento, mas a principal que teremos que conhecer por enquanto é TITLE. As outras são : ISINDEX, NEXTID, LINK, e BASE e não serão vistas neste curso. TITLE Cada documento tem um título que o browser utiliza para identificar a página. Este título é mostrado como parte da janela e representa uma maneira para o usuário poder ver o título do documento, principalmente se este documento é composto de várias telas. Propriedades de formatação As propriedades de formatação especificam o layout do texto e as imagens dentro do documento. Vimos que a seção HEAD contém somente informações sobre o documento. Aqui, o elemento BODY é que contém as informações sobre seus conteúdos, visto que existem vários elementos para manipular um documento a fim de formatar textos, imagens, listas e outros objetos. O elemento BODY é utilizado para indicar o início e o final do conteúdo de um documento. Cabeçalhos Os cabeçalhos geralmente são utilizados para títulos e sub-títulos em uma página Web. Na linguagem HTML, você pode utilizar até seis níveis de cabeçalhos. Tipicamente estes cabeçalhos mostrarão diferentes tamanhos de texto e formatos, dependendo destes níveis. Portanto, a notação relativa a cabeçalhos é: <Hn>Texto do cabeçalho </Hn > onde n é um número entre 1. O elemento <Hn> não define o tamanho da letra em um cabeçalho O tamanho exato com que ele será visualizado é definido pelo browser de cada usuário.

19 HyperText Markup Language - HTML Página 19 Parágrafos A marcação de parágrafo é utilizada para definir o início de um novo parágrafo. Entre dois parágrafos é deixado uma linha em branco. Portanto, este tipo de marcador é utilizado para separar a informação entre blocos lógicos de texto. A linguagem HTML não reconhece o caracter de quebra de linha dos editores de texto. Mesmo que exista uma linha em branco, os clientes Web só reconhecem o início de um novo parágrafo mediante a marcação apropriada. Assim, a notação relativa a esta marcação é dada por : <P> Texto correspondente a este parágrafo... </P> Embora esta marcação não exija o terminador </P>, é interessante colocá-lo pois existe uma tendência de que novas normas da linguagem HTML venham a incluí-lo.. Inserindo-se uma marcação de parágrafo depois de <P>, <LI>,<Hn> e algumas outras, esta marcação será ignorada. Quebras de linha A marcação <BR> faz uma quebra de linha sem acrescentar espaço extra entre as linhas. Assim como os marcadores de parágrafo, o marcador de quebra de linha indica que o texto seguinte ao marcador deve iniciar na próxima linha. A diferença entre os dois marcadores está justamente no espacejamento entre as linhas. Outras marcações de estilos bastante utilizadas... Linha de separação Horizontal A marcação <HR> produz uma linha de separação horizontal. Texto Pré-Formatado A marcação <PRE>...</PRE> é utilizada para representar blocos de texto com suas formatações originais, ou seja, espaços em branco, tabulações, e quebras de linhas são preservados. Ênfase A marcação <EM>...</EM> é utilizada para a formatação de textos enfatizados, representados com a utilização de fontes itálicas ou negritadas. A marcação <STRONG>...</STRONG> desempenha função parecida utilizando fontes negritadas. A marcação <CITE>...</CITE> é utilizada para a formatação de citações, geralmente utilizando fontes itálicas.

20 HyperText Markup Language - HTML Página 20 + Exemplo inicial Agora que já vimos a estrutura básica de um documento HTML e alguns comandos simples de formatação, já podemos fazer nossa primeira página. Assim, observe com atenção todos os comandos programados utilizando um editor de textos qualquer (neste caso o Windows NotePad), e na página seguinte o resultado obtido no browser cliente (neste caso Netscape Gold).