Não é uma linguagem de programação. Não é uma linguagem de scripts. Mas é I-M-P-R-E-S-C-I-N-D-Í-V-E-L para o teu WebSite. Quem faz sites em outros formatos que me perdoem, mas não há maneira mais pura, mais personalizável e que fornece tanto aprendizado quanto este. Aqui dá pra ver o processo de formação de um site, como ele se estrutura e quais são as suas possibilidades. Aqui dá pra extravasar criatividade e criar verdadeiras obras de arte que podem ser vistas, a princípio, por todos que possuem internet!
HTML é um acrônimo para HyperText Markup Language (Linguagem de Marcação de Hypertexto). Mas não acabei de falar que não era linguagem de programação? E não é. HTML é uma linguagem sim, mas de MARCAÇÃO, ou seja, não possui estruturas típicas de linguagens de programação, como laços, condições, etc., muito menos conexão com servidor. Apenas serve para estruturar visual e funcionalmente a página da Web. Agora, se prestaram atenção em meus artigos anteriores sobre Web, perceberão que nem Javascript nem HTML são linguagens de programação, ou seja, a Web não possui linguagens de programação? Sim, possui. PHP é a mais famosa delas, mas falaremos sobre PHP mais pra frente, primeiramente vamos entender a estrutura HTML.
Um HTML puro é fácil de ser reconhecido, principalmente pelo uso das Tags, ou seja, um rótulo, etiqueta, algo para identificar um bloco. Cada bloco deve ser aberto e fechado, mas não com chaves. As próprias tags abrem e fecham o bloco, que é composto por outras tags. Para exemplificar, temos a tag inicial:
<html> </html>Essa é a tag que abre e encerra o bloco principal da estrutura. As tags devem seguir uma ordem de abertura e fechamento, um seja, a primeira tag a ser aberta tem que ser fechada por último. Por exemplo, este código não executará de maneira esperada:
<html> <body> <font color="red"> <b>Hello World</b> </html> </body> </font>A tag <html> é fechada antes que a tag <body> e a <font>, portanto, é uma forma incorreta de se estruturar a página. Assim como a tag html abre a página web inteira, temos a tag body, que abre o corpo da página. Tudo escrito antes ou depois da tag body não será mostrado na tela, a não ser que haja algo que chame esta determinada função (como é o caso do Javascript). Usamos tags fora da body para definir configurações do website (assim como o título da página, que aparece na barra superior do navegador), scripts, como Javascript e estilo. Tudo isso colocamos na tag <head>, como segue:
<html> <head> <title> Hello World </title> </head> <body> Olá, mundo! </body> </html>Esta sim é uma forma correta de se estruturar. As tags foram abertas e fechadas na ordem. Isto resultaria em uma impressão do texto "Olá, mundo" no navegador e, no título, estaria "Hello World".
Como podem ter percebido, no código que foi estruturado errado, as tags possuem propriedades que podem ser definidas manualmente. No caso da tag <font>, há as principais propriedades color, que define a cor da fonte (pode ser definido tanto pelo nome das cores em inglês, quanto pelo código hexadecimal representativo das partes da cor - RGB, ou Red/Green/Blue. Ex.: #000000 produz a cor preta, #ffffff produz a cor branca, #ff0000 produz a cor vermelha, #aaaa00 produz a cor alaranjada, e assim por diante, é só misturar as cores com a devida intensidade), face, que define qual a fonte será utilizada para aquele texto (Arial, Tahoma, Verdana, Comic Sans MS...), que tem que ser colocada entre aspas (únicas ou duplas) e contendo o nome inteiro da fonte (o correto é Comic Sans MS, não apenas Comic Sans) e size, que define o tamanho da fonte em pontos ou pixels, dependendo da definição. Existem outras propriedades para outras tags, que iremos comentar mais adiante.
O código HTML pode ser escrito em qualquer editor de texto. Para executa-lo no navegador, tem que salvar o código no formato ".html" ou simplesmente ".htm".
Devem ter ficado curiosos sobre o que se trataria "estilo". No próximo artigo explicarei melhor, mas adianto que é algo que complementa o HTML, aplicando uns enfeites e deixando o teu website muito mais bonito e personalizável!
Até a próxima :)
Nenhum comentário:
Postar um comentário
Codifique tua mensagem aí: