Portfolio

1 INTRODUÇÃO

Atualmente é possível criar infinitas combinações de atributos para desenvolver um documento HTML, este trabalho tem como finalidade demonstrar quais tags e atributos podem ser usados no processo de criação, proporcionando assim uma melhor personalização da página, maior dinamismo e compatibilidade com os diversos browsers disponíveis hoje em dia, consequentemente facilitando o processo de criação e simplificando o HTML.

E também é relatado no mesmo o uso de variáveis e suas passagens por referência e por valor.

Finalizando o trabalho conta com um organograma da organização Telecine Mozzer.

2 O QUE É HTML:

HTML é uma linguagem de marcação de hipertexto utilizada para criar páginas web, normalmente esses documentos possuem a extensão “.html” ou “.htm”, documentos esses que são interpretados pelo browser (navegador) e podem ser escritos em qualquer editor de texto básico.

Como qualquer outra linguagem de programação, o HTML possui uma sintaxe própria, com comandos específicos, comandos esses denominados de TAGs.

2.1 O QUE SÃO TAGS

Os TAGs são comandos dados ao navegador através do código fonte, podemos definir se determinado texto será em negrito ou itálico utilizando uma TAG.

O TAG sempre é iniciado pelo sinal de menor “<” e sempre finalizado com o sinal de maior “>” ficando desta maneira “<>” e geralmente são usados em pares, por exemplo:

Uma TAG é normalmente aberta com o sinal de maior e fecha com o sinal de menor, mas no fechamento deve-se incluir a barra “/”, ficando como o exemplo abaixo:

Mas também existem TAGs que não se fecham, como a TAG <br> (quebra de linha).

2.1.1 Títulos

Títulos são definidos com as TAGs <h1> a <h6>. A <h1> define o título maior. A <h6> define o título menor.

2.1.2 Parágrafos

Os parágrafos são definidos com a TAG <p>.

2.1.3 Quebra de Linhas

A tag <br> é usada quando você quer terminar uma linha, mas não quer começar um novo parágrafo. A tag <br> força a quebra de linha onde quer que você a coloque.

2.2 ESTRUTURA BÁSICA DE UM DOCUMENTO HTML

Existem muitos TAGs que podem ser utilizados em um documento HTML, porém 3 deles são necessários para que o browser interprete o código fonte, que são:

O HTML que inicia o documento e permite de o atributo Lang seja adicionado ao código, cuja finalidade é definir a língua na qual o documento será escrito.

O HEAD que é responsável por conter as informações que não estão visíveis no corpo da página e sim na aba da página.

O BODY que é o corpo do documento é nele que se encontra todo o conteúdo da página.

Com essa estrutura é possível criar uma página HTML, desde uma bem simples, com um titulo e um texto no corpo da página, até as mais complexas.

Observe o exemplo abaixo de um documento simples utilizando a estrutura básica:

2.3 FORMATAÇÃO DE TEXTOS

Para melhorarmos a aparência da nossa página web existem muitas TAGs que podem ser utilizadas, como, cabeçalhos, parágrafos, tipos de fonte e suas respectivas cores e tamanhos, margens, linhas, alinhamento de texto, links, imagens, vídeos, listas ordenadas ou não ordenadas, tabelas, citações, formulários e entradas de texto entre muitos outros. Ao decorrer deste trabalho veremos cada um deles mais detalhadamente.

2.3.1 Cabeçalhos

As Heading Tags (Cabeçalhos) são recursos de programação HTML utilizados para destacar títulos e sub-títulos de uma página. H1 é a abreviação do inglês para Header 1, ou Cabeçalho 1, logo, o mais importante dos Headers.

As TAGs de cabeçalho vão de H1 até H6, sendo o H1 o maior e mais importante, pois será utilizado por sites de busca, e o H6 o menor.

2.3.2 Parágrafo e Quebra de Linha

Quando estamos escrevendo nosso código fonte e pressionamos a tecla “enter” ele cria uma quebra de linha, mas o Browser não interpreta essa quebra, por isso precisamos utilizar TAGs para que isso aconteça, e essas TAGs são o parágrafo representado por <p> e a quebra de linha representada por <br>.

A TAG <p> cria um parágrafo, e automaticamente adiciona uma quebra de linha logo após, já a TAG <br> só adiciona a quebra de linha e deve ser adicionada logo após o objeto no qual deseja a quebra, podendo ser usada múltiplas vezes em sequencia.

2.3.3 Formatando Textos

Existem comandos para definir estilos de textos, tornando possível a personalização e criando um aspecto mais agradável para a página web.

Como em um editor de textos convencional é possível deixar um determinado texto em negrito, itálico, sublinhado, entre outras formatações, no HTML também é possível utilizando TAGs.

Tags de Formatação de Texto:

<b> Define texto em negrito

<big> Define texto grande

<em> Define texto enfatizado

<i> Define texto em itálico

<small> Define texto pequeno

<strong> Define texto forte

<sub> Define texto subescrito

<sup> Define texto superescrito

<ins> Define texto inserido

<del> Define texto cancelado

<u> Define um texto sublinhado.

2.3.4 Linha de Separação

Como