Unidade A - Introdução ao desenvolvimento para Web

A Internet e a World Wide Web

Internet

Você já deve ter ouvido/lido que a internet tem mais de 50 anos. Pois bem, por que a Internet existe há tanto tempo, mas o uso dos seus recursos é bem mais recente?

Isso porque a Internet é a grande rede de computadores, ou seja, o conjunto de computadores que estão conectados através de várias redes.  Então podemos entender a Internet como a infraestrutura.

A Internet surgiu em meados de 1969 com um projeto do governo americano denominado ARPANET. O objetivo do projeto era interligar universidades e instituições de pesquisa militares.

Web

E a Web? Bem, ela é bem mais nova. Em 1991, Tim Berners-Lee, pesquisador do CERN, lançou a WWW (World Wide Web – rede de alcance mundial) ou simplesmente, Web, com o objetivo de compartilhar arquivos (HTML e outros), tendo o navegador como ferramenta de acesso. Assim, a Web é um serviço da Internet, um ambiente onde os documentos são publicados, disponibilizados e acessados.

Então, podemos dizer que a web usa a Internet, mas ela em si não é a Internet. Sempre que acessamos um site, estamos navegando na web, mas quando usamos o MSN, por exemplo, estamos usando um software que usa a Internet e não necessariamente a Web.

Os documentos disponibilizados na Web podem estar na forma de vídeos, sons, hipertextos e figuras. Para visualizar as informações, usamos o navegador (browser) para descarregar os documentos (ou "páginas") de servidores web (ou "sítios") e mostrá-los ao usuário. O usuário pode então seguir as hiperligações na página para outros documentos ou mesmo enviar informações de volta para o servidor para interagir com ele. Esta funcionalidade é baseada em três padrões: URI, HTTP e HTML. Vamos ver mais detalhadamente cada um deles.

 

Internet e internet possuem significados diferentes. Enquanto internet significa um conjunto de redes de computadores interligadas, a Internet se refere à internet global e pública. Assim, existem inúmeras internets espalhadas por redes particulares, seja interligando empresas, universidades ou residências. Porém, existe somente uma rede única e global, o conjunto de todas as redes, a Internet.

 

URI - Universal Resource Identifier (Identificador Universal de Recursos)

URI é a base do sistema de endereçamento da Web que usa uma cadeia de caracteres para identificar ou denominar um recurso na Internet. Um URI pode ser classificado como um localizador (URL) ou um nome (URN), ou ainda como ambos.

Um URN (Uniform Resource Name - Nome de Recursos Uniforme ) é como o nome de uma pessoa, enquanto que um URL (Uniform Resource Locator - Localização de Recursos Uniforme) é como o seu endereço.

Os endereços que utilizamos atualmente na Web são os URLs, que possuem a seguinte estrutura:

  1. o protocolo de acesso ao recurso desejado (http)
  2. a máquina a ser conectada (www.ifsul.edu.br)
  3. o caminho de pastas até o recurso (portal/)
  4. o recurso (arquivo) a ser obtido (index.php)

Veja exemplo apresentado na figura A.1 abaixo:


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

O HTTP é o protocolo que especifica como o navegador e o servidor web se comunicam. Cada vez que você aciona um link, seu navegador realiza uma comunicação com um servidor da Web através deste protocolo.

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

O HTML é uma linguagem de marcação utilizada para produzir documentos que são interpretados por navegadores. O HTML mescla textos com códigos especiais (tags ou etiquetas).

As etiquetas(ou tags) permitem estruturar o conteúdo do documento e dar instruções ao navegador sobre o que fazer. As etiquetas são elementos entre parênteses angulares (< e >). A maioria das etiquetas tem sua correspondente de fechamento:

<etiqueta>...</etiqueta>

Isso é necessário porque as etiquetas servem para definir a formatação de uma porção do documento, e assim marcamos onde começa e termina o texto com a formatação especificada por ela. Alguns elementos são chamados “vazios”, pois não marcam uma região de texto, apenas inserem algum elemento no documento:

<etiqueta>

Exemplos:

<p> Introdução ao desenvolvimento para Web </p>

Acima com a etiqueta <p></p> o texto será apresentado em um novo parágrafo.

<b> Linguagem de Marcação de Hipertexto </b>

Com a etiqueta <b></b> texto será apresentado em negrito.

Como pudemos perceber vários novos conceitos vão sendo apresentados quando começamos a falar em Web e Internet. Por isso, esse documenta se destina a apresentar várias informações importantes que devemos saber antes de iniciarmos o aprendizado específico das tecnologias para programação. A seguir vamos falar com pouco sobre: W3C, XHTML, CSS, linguagens do lado cliente e servidor e sobre tendências para a Web.

W3C

Conhecer o que é o W3C (World Wide Web Consortium) é muito importante, pois ele é responsável por desenvolver os padrões para criação e a interpretação de conteúdos para a Web.  O W3C é um consórcio internacional com cerca de 300 membros, que agrega empresas, órgãos governamentais e organizações independentes, fundado por Tim Berners-Lee em 1994. O objetivo principal é desenvolver protocolos comuns e fóruns abertos que promovam a evolução da Web e assegurem a sua interoperabilidade. Assim, os sites que seguem esses padrões podem ser acessados e visualizados por qualquer pessoa ou tecnologia, independente de hardware ou software utilizados, de maneira rápida e compatível com os novos padrões e tecnologias que possam surgir.

Padrões seus como HTML, XHTML e CSS (que vamos mencionar mais adiante) são muito populares, contudo, em muitos casos são usados de forma errônea devido ao desconhecimento da especificação. É um dever de todo o desenvolvedor Web respeitar e seguir os padrões de acessibilidade do W3C, pois de outro modo poderá impor barreiras tecnológicas a diversas pessoas, desestimulando e até mesmo impedindo o acesso a suas páginas.

 

Para saber mais sobre o W3C acesse <a href="http://www.w3c.org" target="_new">www.w3c.org</a>&gt;

 

Uma iniciativa interessante do W3C é um validador de páginas HTML que foi disponibilizado com o objetivo de auxiliar os desenvolvedores na tarefa de verificar e corrigir os códigos criados por eles.  O endereço é http://validator.w3.org/.

XHTML

XHTML? Por que este X? Bem, a XHTML (EXtensible HyperText Markup Language - Linguagem Extensível para Marcação de Hipertexto) foi criada para substituir a HTML, sendo uma linguagem mais  "pura, clara e limpa".

A XHTML é uma reformulação da HTML, baseada em XML (Extensible Markup Language). A XML tem como princípio que você pode criar seus próprios elementos de marcação e atributos para escrever seu documento. Isto significa que é você quem cria sua linguagem de marcação. A transformação de um documento existente de HTML para XHTML é uma tarefa bem simples, uma vez que a XHTML é baseada na HTML.

Mas o que muda de fato?

Esse processo de padronização tem em vista a exibição de páginas web em diferentes dispositivos (televisão, smartphone, celular, tablet).

As principais diferenças são:

  1. todas as tags devem ser escritas em letras minúsculas;
  2. as tags devem estar convenientemente aninhadas;
  3. os documentos devem ser bem formados;
  4. o uso de tags de fechamento é obrigatório;
  5. elementos vazios devem ser fechados;
  6. sintaxe para atributos.

CSS

Talvez você nunca tenha ouvido falar do CSS (Cascading Style Sheets - Folha de Estilos em Cascata) e nem tenha percebido a sua aplicação, mas praticamente todos os sites que você acessa usam este recurso. O CSS é também uma linguagem, mas esta é usada para criar estilos que definem o layout do documento HTML. Por exemplo, estilos para fontes, cores, margens, linhas, alturas, larguras, imagens de fundo, posicionamentos e muito mais.

O CSS é suportado por qualquer navegador e proporciona inúmeras opções de formatação para apresentação do layout de forma bastante sofisticada.

É fundamental que um desenvolvedor web saiba aplicar os recursos desta linguagem que foi proposta justamente como objetivo de separar o estilo do conteúdo da página.

Talvez você se pergunte se não pode fazer isso com HTML. Bem, a questão é que a recomendação W3C e os padrões de desenvolvimento indicam que o HTML deve ser usado para estruturar conteúdos e o CSS para formatar conteúdos estruturados.

E quais são os benefícios do uso de CSS:

  1. controle do layout de vários documentos a partir de uma simples folha de estilos;
  2. maior precisão no controle do layout;
  3. aplicação de diferentes layouts para servir diferentes mídias (tela, impressora, etc.);
  4. emprego de variadas, sofisticadas e avançadas técnicas de desenvolvimento que facilitam a manutenção.
 

Esta disciplina não prevê abordar a linguagem CSS. No entanto, é importante que o aluno compreenda sua aplicação, até porque na linguagem HTML nos deteremos as tags que tratam apenas da estrutura do documento