HTML - O que é, para que serve e como utilizar

 Neste artigo vamos entender a importância da linguagem HTML no mundo do desenvolvimento web

Imagem de Gerd Altmann por Pixabay

 

O que é HTML?

HTML é o acrônimo para Hyper Text Markup Language que, em bom português significa: Linguagem de Marcação de Hiper Texto. É uma linguagem de marcação, ou seja, sua função, diferente das linguagens de programação, é marcar as partes do conteúdo, informando ao browser, o que é cada parte da página.

De uma visão bem simplista é como se colássemos etiquetas indicativas nas diversas partes de um documento, indicando: Isto é um cabeçalho, aquilo é uma imagem, etc. 

Para que serve o HTML?

A linguagem foi criada por Tim Berners-Lee, nos anos noventa para compartilhar artigos técnicos de uma forma mais organizada e apresentável. Imediatamente a comunidade percebeu o potencial da tecnologia e o resultado é a internet que temos atualmente.

Sites, aplicações web, aplicações mobile, etc. Praticamente, tudo que você acessa na internet usa o HTML para montar a estrutura principal. Este conteúdo que você está lendo é estruturado em HTML.

Como se utiliza o HTML?

A codificação HTML é escrita a partir de um editor de texto não formatado. Um bom exemplo disso é o Bloco de Notas do Windows, o Xed do Linux ou o Text Editor do Mac, mas é evidente que estes editores são limitados. Neste caso o mais indicados são os editores profissionais como o VS Code, Sublime Text e o Brackets. Eu utilizo e recomendo o VS Code. Tanto o VS Code como os demais tem versões para Linux, Windows e Mac.

Sintaxe da Linguagem HTML

A sintaxe do HTML é bastante simples. Ela é toda baseada em Tags (Etiquetas). Estas tags são formadas por parenteses angulares (também conhecidos como sinal de menor < e sinal de maior >), que envolvem o nome do elemento. A maioria dos elementos possuem uma tag de abertura e outra de fechamento, que se caracteriza por uma barra antes do nome do elemento. Veja o exemplo a seguir:

Exemplo de comando HTML

Os arquivos HTML

Toda a codificação do HTML é escrita em arquivos de texto simples e sem formatação que devem ser salvos com a extensão html conforme a figura a seguir.

Exemplo de arquivo HTML

Nomes dos arquivos

Existem algumas regras a serem seguidas quando damos nomes para nossos arquivos HTML. Basicamente os principais cuidados que devemos ter são:

• Não use acentos e caracteres especiais.
• Não use espaços.
• Use sempre letras minúsculas, embora não seja obrigatório é uma boa pratica.
• Não comece com números. Também faz parte das boas práticas.
• Separe as palavras com hifens. Facilita a leitura visual e dos mecanismos de busca.
• Use nomes compreensíveis, que remetam ao conteúdo do arquivo.
• Evite nomes muito extensos.
• Mantenha um padrão no seu projeto. Ex.: Se você separa os nomes com underline no lugar de hífen mantenha o padrão em todo o projeto. Da mesma forma, seu não misture idiomas nos nomes dos arquivos. 

Observe o exemplo a seguir:

Nomeando arquivos corretamente.

Onde salvar seus arquivos

Na fase de desenvolvimento é comum armazenar os arquivos de um projeto em sua máquina, para tanto você deve criar uma pasta para cada site. Todos os arquivos que farão parte do projeto deverão estar dentro dessa pasta ou em sub-pastas desta pasta principal que é chamada de raiz.
É bastante comum o uso de sub-pastas, dentro da raiz para abrigar diferentes tipos de arquivos. Observe o exemplo na figura abaixo:

Organização de arquivos e pastas

Conclusão

O HTML é uma linguagem imprescindível na construção de sites e aplicações web, pois é o responsável pela estruturação do conteúdo. Embora seja uma linguagem muito simples e fácil de aprender, é a responsável pela sustentação de quase totalidade dos conteúdos espalhados pela rede mundial.

Conhecer, compreender e saber utilizar esta tecnologia em concordância com os padrões da web e ficando atento as boas práticas faz a diferença entre sites que são vistos e os que são esquecidos.

Outras Informações

Quer mais conteúdos? Então acompanhe o CANAL DO PROFESSOR LUIS no Youtube.

Você também pode contribuir com esse trabalho, com qualquer valor pela chave PIX webcursoprofessorluis@gmail.com