Hypertext Markup Language (HTML)

SUMÁRIO

1 INTRODUÇÃO 3

2 DESENVOLVIMENTO 4

2.1 HTML 4

2.2 Comandos html 4

2.2.1 Principais TAGS 5

2.2.1.1 Cabeçalhos 5

2.2.2 Parágrafos 7

2.2.3 Listas 8

2.2.4 Tabelas 9

2.2.5 Imagens 10

2.2.6 Video 11

3 Cascading Style Sheets (CSS) 12

3.1 Como funciona 12

3.2 Benefícios 13

4 Escopo de Variáveis 14

5 CONCLUSÃO 15

REFERÊNCIAS 16

1 INTRODUÇÃO

O trabalho que foi proposto tem como objetivo apresentar o HTML, linguagem de marcação na qual é utilizada por desenvolvedores para a criação de web site, abordamos temas como a estrutura básica, tags de cabeçalhos, parágrafos, links, inserção de mídias nas páginas e estilização da aparências da mesma.

2 OBJETIVO

O propósito do trabalho é apresentar tecnologias utilizadas para a criação de websites entendo como funciona seus principais comandos de utilização para somar mais conhecimentos nas disciplinas.

DESENVOLVIMENTO

2.1 HTML

O HTML (HyperText Markup Language ou Linguagem de Marcação de Hipertexto) é uma linguagem de marcação utilizada na criação de páginas Web. Criado pelo físico Tim Berners-Lee na década de 90 tinha como objetivo facilitar a comunicação e disseminação de pesquisas entre ele e seu grupo de colegas. Logo após o HTML ganhou bastante notoriedade e principalmente aceitação por parte dos usuários devido ao emergir da internet pública na qual ganhou atenção mundial. Com o seu rápido crescimento o HTML passou por diversas melhorias no qual o foco é criar um padrão para que todos os autores e navegadores pudessem reconhecer quaisquer versões do HTML, que são as seguintes: HTML 2.0, HTML 3.2, HTML 4.0, HTML 4.01, HTML5. Onde cada versão possui suas variantes e peculiaridades. A W3C (World Wide Web Consortium) é a principal organização de padronização da World Wide Web e é responsável pela padronização do HTML 4.01 e XHTML 1.0. Para escrever documentos HTML não é necessário mais do que um editor de texto simples e conhecimento dos códigos que compõem a linguagem. Os códigos (conhecidos como TAGS) servem para indicar a função de cada elemento da página Web.

2.2 COMANDOS HTML

Os comandos do HTML são chamados de TAG ou "Etiqueta", esses comandos são responsáveis pela forma estrutural de como os nossos elementos do website será apresentado pelo navegador, com ele podemos definir títulos, parágrafos, links, inserir mídias de áudio, vídeo e imagem.

Para podermos utilizar as TAGS primeiro precisamos entender como elas funcionam, para declarar uma TAG basta inserir a símbolo "<" em seguida o nome da TAG e utilizar o sinal de ">", ficando da seguinte forma: <exemplo> outro detalhe muito importante é que precisamos "fechar" essa TAG, para isso basta copiar o nome da TAG e adicionar "/" entre o "<" e "exemplo" ficando: <exemplo>conteúdo </exemplo> e colocar o conteúdo desejado entre elas.

2.2.1 Principais TAGS

Segue abaixo um exemplo da estrutura do HTML.

Figura 1 – Estrutura HTML.

Fonte: Computador pessoal.

2.2.1.1 Cabeçalhos

Os cabeçalhos são utilizados para a divisão do texto em seções. Eles se destacam do restante do texto, existindo 6 níveis, que são indicados pela Tag <H*>, onde * corresponde ao nível do cabeçalho.

Figura 2 – Estrutura em HTML dos títulos.

Fonte: Computador pessoal

Figura 3 – Estrutura de títulos renderizada no navegador.

Fonte: Computador pessoal

2.2.2 Parágrafos

Utilize as tags <p> e </p> para delimitar parágrafos.

Figura 4 – Estrutura de parágrafos renderizada no navegador.

Fonte: Computador pessoal

Figura 5 – Estrutura de parágrafos em HTML.

Fonte: Computador pessoal

2.2.3 Listas

A linguagem HTML contém elementos que permitem criar listas de definições, listas ordenadas ou não.

Figura 6 – Estrutura de lista renderizada no navegador.

Fonte: Computador pessoal

Figura 7 – Estrutura de lista em HTML.

Fonte: Computador pessoal

2.2.4 Tabelas

As tabelas são definidas com a tag <table>. Uma tabela é dividida em linhas (com a tag <tr>), e cada linha é dividida em células de dados (com a tag <td>). As letras td significam "table data," que é o conteúdo de uma célula de dados. Uma célula de dados pode conter texto, imagens, listas, parágrafos, formulários, filetes horizontais, tabelas, etc.

Figura 8 – Estrutura de lista em HTML.