Criando Páginas na Web

  Bem-vindos ao blog CriArte, Gostaria de passar tais conhecimentos aos interessados em Desenvolvimento Web.

  Começaremos com a criação de páginas Web, utilizando a linguagem de marcação HTML. 
   Você irá se familiarizar com os termos técnicos chaves relacionados a Internet e a Web.

  A Internet é uma rede de computadores ao redor do mundo, onde cada computador pode se comunicar com outro. Na Internet, você pode interagir com pessoas de todo o mundo. Por outro lado, usando a Intranet, você pode interagir somente com pessoas de uma mesma organização.

  A World Wide Web (WWW), conhecida como Web, é um sistema de informação que une dados de vários serviços de internet. Enquanto a internet refere-se aos componentes físicos da rede global, a Web refere-se ao corpo da informação compartilhada usando esta rede.

O que é linguagem de marcação?

  Páginas Web são os conteúdos que você vê nos sites. Estas páginas são armazenadas como arquivos com extensão htm ou html.

   Uma linguagem de marcação é a linguagem usada para formatar páginas Web com texto e informações separadamente. Isto assegura que as páginas Web serão acessíveis de qualquer parte do mundo usando qualquer tipo de browser.

O que é HTML?

  Hypertext Markup Language (HTML) é uma linguagem de formatação usada para criar páginas Web.

Um documento HTML contém:

• O texto a ser exibido.
• A informação sobre como o texto deve ser formatado.
• A informação sobre como o texto deve ser estruturado.

  Hipertexto é um tipo de texto, digital, que permite a leitura não linear, através de links. Quando você clica num link, é redirecionado à página correspondente. 

  Browsers são programas que você usa para acessar, visualizar e interagir com páginas Web. A Web permite que browsers de diferentes plataformas interpretem, formatem e exibam páginas Web.

  Exemplos de browsers são: Internet Explorer, Firefox, Chrome, Opera e Safari.

 Servidores Web são computadores robustos, com programas que processam pedidos recebidos dos browsers. Estes servidores armazenam os websites, que são uma coleção de páginas Web relacionadas entre si.

O que é uma home page?

  A home page é a primeira página de um site, ou a página de entrada. Por exemplo, quando você conecta ao site da Microsoft em www.microsoft.com, você pode não ser capaz de especificar um nome de arquivo. Nestes casos, o servidor Web exibirá um arquivo padrão. Este arquivo é a home page.

  Uma homepage é normalmente chamada de index.htm ou de default.htm (os arquivos também podem possuir a extensão .html como padrão).

HTTP, FTP e TCP

  Protocolos são um conjunto de regras para a comunicação em uma rede. Eles determinam como computadores em uma rede se comunicam, como começar, como manter e como terminar a comunicação.

• Hyper Text Transfer Protocol (HTTP) é o protocolo usado pelos servidores Web para transmitir documentos HTML pela Internet.
• File Transfer Protocol (FTP) é outro protocolo muito utilizado para transmitir arquivos entre computadores na Web, porém sua interface gráfica não é tão agradável como o HTTP.
• Transfer Control Protocol (TCP) é um conjunto de protocolos usado para a transmissão de informação pela Web, e possui a função de verificar se os dados são transferidos de forma correta, na sequência apropriada e sem erros.
• IP significa Internet Protocol, e é um protocolo de endereçamento, ou seja, ele fornece o endereço dos computadores na rede.

O que é URL?         

  Universal Resource Locator (URL) é o sistema de endereçamento usado pelos browsers para localizar redes, computadores e arquivos na Internet. Um URL especifica: 

• Protocolo a ser usado para acessar o arquivo. 
• Endereço do servidor.
• Nome do arquivo no servidor.

O que significa HTML?

  Agora você irá aprender a usar o HTML, suas características, benefícios e funções. HTML significa Hypertext Markup Language. Uma linguagem de marcação é uma linguagem que você usa para formatar informações como uma entidade separada em um documento.

  Você usa HTML para criar páginas Web. HTML é baseado no Standard Generalized Markup Language (SGML). O SGML foi o primeiro padrão internacional para a troca de documento usando qualquer meio eletrônico. As características principais do HTML são:

• HTML é uma linguagem de formatação.
• Documentos HTML contêm textos ASCII como seu elemento básico.

Quais as vantagens do uso do HTML?

  Vamos aprender agora as vantagens do uso do HTML. Com o HTML você pode:

• Criar facilmente documentos Web.
• Assegurar a acessibilidade das suas páginas Web por um grande número de plataformas e Web browsers.
• Transmitir facilmente documentos pela Internet.

Como criar um documento HTML?

  HTML utiliza um formato simples que pode ser gerado sem a ajuda de aplicações especiais. Para criar um documento HTML, tudo o que precisa é de um editor de texto ASCII. Se você precisar verificar o formato do documento durante a criação, você pode usar qualquer browser.

  O HTML foi a primeira linguagem de marcação que pôde atender um grande número de plataformas de computadores e browsers. Além disso, com o HTML pode-se assegurar que seu documento será lido por um grande número de pessoas. Isto acontece por que todos os browsers são capazes de interpretar o código.

  Este tipo de linguagem é adequada para a transmissão de documentos pela Internet para vários tipos de computadores, usuários e browsers. Você pode transmitir rapidamente páginas Web criadas usando o HTML.

  ASCII - American Standard Code for Information Interchange (Código Padrão Americano para o Intercâmbio de Informação) é uma codificação de caracteres em oito bits, baseada no alfabeto norte-americano. Todos os caracteres são convertidos em bits utilizando esta tabela.

Qual é o papel do HTML?

  Você aprendeu as características e benefícios do HTML. Agora, você irá aprender a função do HTML na World Wide Web. Existem várias linguagens de marcação disponíveis que você pode usar para formatar suas páginas Web. Linguagens como Virtual Reality Modeling Language (VRML) e SGML possuem varias características adicionais, como a renderização multidimensional de documentos e objetos complexos. Entretanto, o HTML continua sendo a linguagem de marcação mais popular devido ao seu formato simples e amigável. Com o HTML, você pode criar, facilmente e rapidamente, documentos para a Web.

Criando Front-End

  O HTML também tem uma função importante em aplicações Web, que são programas que você incorpora em Web sites para gerenciar tarefas adicionais como o gerenciamento de pedidos de usuários. Aplicações Web aumentam a interação do usuário na Web.

  Quando você entra com alguma informação em uma página Web, o browser envia essa informação para um conjunto especial de programas chamados Common Gateway Interface (CGI) scripts. Estes CGI scripts processam a informação e exibem o resultado no browser segundos depois que você entrou com a informação. Você usa o HTML para fornecer a interface básica para a interação com aplicações Web. Você pode também usar o HTML para criar interfaces gráficas entre os bancos de dados usados nestas aplicações e o usuário final.

Função das tags

  Agora você irá aprender as partes e a função das tags em um documento HTML. Também irá aprender a criar um documento HTML simples, utilizando tags. Para recordar: páginas Web são documentos que você visualiza na internet, e são criadas utilizando um editor de texto e linguagens de marcação. 

  Uma página Web que você cria usando o HTML é chamada de um documento HTML, que consiste do texto a ser exibido na página Web e as informações sobre a formatação e estrutura do texto e imagens.

Partes de um documento HTML

  Um documento HTML possui duas partes: head (cabeçalho) e body (corpo). No head você entra com o título da página Web e outras informações, que detalharemos mais adiante. No body você entra com todo o conteúdo da página Web.

  O editor de texto utilizado o é o Notepad (Bloco de Notas). 

O papel das tags

  Tags são os elementos básicos de um documento HTML. Você usa tags para especificar o formato do conteúdo de uma página Web. As tags são denotadas por um único caractere ASCII ou uma string de caracteres entre os sinais < (menor que) e > (maior que), e geralmente são palavras em inglês ou simplesmente abreviações de palavras da língua norte-americana.

  Sinais de maior e menor permitem aos browsers distinguir tags de um texto comum. Por exemplo, um web browser irá interpretar, num documento HTML, como uma tag tudo que está entre < e > e como body (ou corpo da página) o texto que você quer exibir na página Web correspondente, necessariamente fora do espaço entre < e >.

Tags com fechamento

  Grande parte das tags de HTML requerem seu fechamento: se você abre uma tag parágrafo <p>, você tem de fechá-la com </p>. Então, tudo que estiver compreendido entre <p> e </p> será encarado como o corpo do parágrafo. Todas as tags que necessitam de fechamento têm esta mesma estrutura: seu fechamento é idêntico à tag de abertura, porém com o sinal /.

  Por exemplo, você pode querer exibir um bloco de texto em negrito. No documento HTML, você usa a tag de inicio <b> no começo do bloco de texto e a de finalização </b> no fim. A tag Bold (negrito) é uma tag que requer fechamento.

Tags sem fechamento

  Algumas outras tags não necessitam de fechamento, e sua sintaxe é somente de abertura. Por exemplo, a tag Break <br>, que insere uma quebra de linha, é uma delas.

Especificando tudo

  Você aprendeu as partes e a função das tags em um documento HTML. Agora você irá aprender a criar um documento HTML simples. Em qualquer documento HTML, você usa uma tag chamada HTML no começo do documento. Esta tag informa ao browser que o documento é um documento formatado em HTML. A criação de um documento HTML envolve a criação do cabeçalho e o corpo do documento. Você usa a tag HEAD para criar o cabeçalho de um documento HTML. A sintaxe desta tag é exibida na imagem ao lado. 

  A parte do cabeçalho de um documento HTML contém o titulo da página Web. Para especificar o titulo, você usa a tag TITLE entre a de inicio e de finalização da tag HEAD. 
  O browser não exibe nada que estiver dentro do cabeçalho, exceto o título. Outras informações como O meta-tags e propriedades globais do documento não são visíveis para o usuário final.

Usando a Tag BODY para criar o corpo de um documento HTML

  Depois da criação do cabeçalho de um documento HTML, você cria o corpo deste documento. O corpo contém o texto, os objetos que serão exibidos na página Web e o tipo da formatação.

  Você usa a tag BODY para criar o corpo de um documento HTML. A sintaxe desta tag está exibida na imagem ao lado. O browser exibe o texto, no formato especificado, que está incluído entre o inicio e o fim da tag BODY.

  Na próxima postagem continuarei com a explicação de como formatar um documento HTML e também como criar listas.

Fonte:

  Escola Virtual – Fundação Bradesco