Tutorial HTML

Introdução

E aí galera! Hoje vou começar a escrever um pouco sobre HTML.

• Como programar em HTML?
• O que são tags?
• Como posso usar estilo em minha página?

Primeira mente gostaria de dizer que também sou um iniciante em programação HTML. Por isso criei esse blog. Para por em prática meus conhecimentos e poder ajudar alguns estudantes dessa linguagem de programação voltada para WEB.

Construindo sua primeira página

Para construir uma página HTML você necessita saber algumas tags iniciais básicas que são comuns em todas as páginas WEB. Segue um código HTML com as tags básicas

O significado de cada "tag básica"

É uma forma de de declaração do tipo de HTML que irá compor uma página. A declaração do tipo de HTML é necessária para o navegador reconhecer a forma de linguagem que a página utiliza e assim traduzir para texto, posições, imagens, etc. Como exemplo, vou propor a seguinte situação: Você está navegando na WEB e, acessa uma página escrita em uma língua diferente. Você percebe que não está escrito em inglês, nem em espanhol, muito menos em francês. Para começar a traduzir a página você teria que, antes de tudo, descobrir em qual língua está escrita, assim poderá pesquisar em um dicionário o significado das palavras(Suponha que não exista Google Tradutor rs). Bom, é exatamente o que a declaração DOCTYPE! faz, facilita as coisas para o navegador.

Após a declaração podemos começar a usar as tags. A primeira delas é a html. Essa tag irá conter as outras tags principais e só deve ser terminada quando a página estiver pronta. Dentro da tag html podemos encontrar as outras tgs principais, são elas: head e body. Então a ordem até aqui fica: html, head, /head, body, /body, /html.

Dentro da tag head temos as informações principais da página, o que o navegador irá interpretar primeiro. temos a tag title que nomeia o título da página e a tag meta.
A tag meta serve para definir os tipos de caracteres que a página irá utilizar, pois temos vários tipos como o alfabeto arábico, por exemplo. Como pode ver dentro da tag meta existe um código charset="utf-8" que diz ao navegador que vamos utilizar o alfabeto ocidental. A tag meta também serve para adicionar palavras chaves a sua página para facilitar a busca em mecanismos de pesquisa. A tag head também armazena a tag style que será responsável por incorporar códigos CSS(Cascading Style Sheets que srão abordados no decorrer do tutorial

A tag body é responsável por armazenar todo o corpo de texto da sua página como: tópicos, parágrafos, tabelas, imagens, listas, etc. Que vamos aprender no próximo tópico.

Você só falou sobre códigos... Como eu posso praticar? Onde eu escrevo esse código?

Bom, para praticar crie um novo documento de texto e digite seu código, quando terminar escolha a opção "Salvar Como" e salve como .html. É só abrir com o seu navegador! Aqui vai um código para teste...

Teste HTML

Como abrir Teste HTML como uma página WEB

1. Faça o download
2. Abra o arquivo e tente entender cada tag
3. Use "Salvar Como" e altere .txt para .html e salve o arquivo
4. Abra o novo arquivo .html com um navegador

Você deve ver algo como: